{% raw %} # Qyoto 中的小部件 > 原文： [http://zetcode.com/gui/vbqyoto/widgets/](http://zetcode.com/gui/vbqyoto/widgets/) 在 Visual Basic Qyoto 編程教程的這一部分中，我們將介紹 Qyoto 小部件。 小部件是 GUI 應用的基本構建塊。 多年來，幾個小部件已成為所有 OS 平臺上所有工具包中的標準。 例如，按鈕，復選框或滾動條。 Qyoto 有一組豐富的小部件，可以滿足大多數編程需求。 可以將更多專門的窗口小部件創建為自定義窗口小部件。 ## `QCheckBox` `QCheckBox`是具有兩種狀態的窗口小部件：開和關。 開狀態通過復選標記顯示。 它用來表示一些布爾屬性。 `QCheckBox`小部件提供一個帶有文本標簽的復選框。 ```vb ' ZetCode Mono Visual Basic Qt tutorial ' This program toggles the title of the ' window with the QCheckBox widget ' ' author jan bodnar ' last modified April 2009 ' website www.zetcode.com Imports Qyoto Public Class VBQApp Inherits QWidget Public Sub New() Me.SetWindowTitle("QCheckBox") Me.InitUI() Me.Resize(250, 200) Me.Move(300, 300) Me.Show() End Sub Private Sub InitUI() Dim cb As New QCheckBox("Show title", Me) cb.Move(50, 50) cb.SetCheckState(True) Connect(cb, SIGNAL("clicked(bool)"), Me, SLOT("OnToggle(bool)")) End Sub <Q_SLOT()> _ Private Sub OnToggle(ByVal state As Boolean) If state Me.SetWindowTitle("QCheckBox") Else Me.SetWindowTitle("") End If End Sub Public Shared Sub Main(ByVal args() As String) Dim qapp As New QApplication(args) Dim app As New VBQApp QApplication.Exec() End Sub End Class ``` 在我們的示例中，我們在窗口上放置了一個復選框。 復選框顯示/隱藏窗口的標題。 ```vb Me.SetWindowTitle("QCheckBox") ``` 在構建窗口期間，我們為窗口設置標題。 ```vb Dim cb As New QCheckBox("Show title", Me) ``` `QCheckBox`小部件已創建。 構造器的第一個參數是其文本標簽。 第二個參數是父窗口小部件。 ```vb cb.SetCheckState(True) ``` 標題在應用的開始處可見。 因此，也必須選中該復選框。 我們使用`SetCheckState()`方法來選中該復選框。 ```vb Connect(cb, SIGNAL("clicked(bool)"), Me, SLOT("OnToggle(bool)")) ``` 當我們單擊復選框時，將發出`clicked(bool)`信號。 發出信號時，我們觸發`OnToggle()`方法。 ```vb <Q_SLOT()> _ Private Sub OnToggle(ByVal state As Boolean) ... End Sub ``` 方法定義之前帶有`Q_SLOT()`屬性。 此屬性通知編譯器有關自定義槽的信息。 ```vb If state Me.SetWindowTitle("QCheckBox") Else Me.SetWindowTitle("") End If ``` 根據復選框的狀態，我們顯示或隱藏窗口的標題。  圖：`QCheckBox` ## `QLabel` `QLabel`小部件用于顯示文本或圖像。 沒有用戶交互。 ```vb ' ZetCode Mono Visual Basic Qt tutorial ' ' This program shows lyrics on the ' window ' ' author jan bodnar ' last modified April 2009 ' website www.zetcode.com Imports Qyoto Public Class VBQApp Inherits QWidget Public Sub New() Me.SetWindowTitle("You know I'm no Good") Me.InitUI() Me.Resize(250, 200) Me.Move(300, 300) Me.Show() End Sub Private Sub InitUI() Dim text As String text = "Meet you downstairs in the bar and heard" + vbNewLine + _ "your rolled up sleeves and your skull t-shirt" + vbNewLine + _ "You say why did you do it with him today?" + vbNewLine + _ "and sniff me out like I was Tanqueray" + vbNewLine + _ "" + vbNewLine + _ "cause you're my fella, my guy" + vbNewLine + _ "hand me your stella and fly" + vbNewLine + _ "by the time I'm out the door" + vbNewLine + _ "you tear men down like Roger Moore" + vbNewLine + _ "" + vbNewLine + _ "I cheated myself" + vbNewLine + _ "like I knew I would" + vbNewLine + _ "I told ya, I was trouble" + vbNewLine + _ "you know that I'm no good" Dim label As New QLabel(text, Me) label.Font = New QFont("Purisa", 9) Dim vbox As New QVBoxLayout() vbox.AddWidget(label) SetLayout(vbox) End Sub Public Shared Sub Main(ByVal args() As String) Dim qapp As New QApplication(args) Dim app As New VBQApp QApplication.Exec() End Sub End Class ``` 我們的示例在窗口中顯示了歌曲的歌詞。 ```vb Dim text As String text = "Meet you downstairs in the bar and heard" + vbNewLine + _ "your rolled up sleeves and your skull t-shirt" + vbNewLine + _ ... ``` 我們定義了多行文字。 與 C# ，Python 或 Ruby 不同，沒有簡單的結構可以用 Visual Basic 語言創建多行文本。 若要在 Visual Basic 中創建多行文本，我們使用`vbNewLine`打印常量，`+`連接字符和`_`行終止字符。 ```vb Dim label As New QLabel(text, Me) label.Font = New QFont("Purisa", 9) ``` 我們創建標簽小部件并更改其字體。 ```vb Dim vbox As New QVBoxLayout() vbox.AddWidget(label) SetLayout(vbox) ``` 代替手動編碼標簽的位置和大小，我們將標簽放入盒子布局中。  圖：`QLabel` ## `QLineEdit` `QLineEdit`是一個小部件，允許輸入和編輯單行純文本。 `QLineEdit`小部件具有撤消/重做，剪切/粘貼和拖放功能。 ```vb ' ZetCode Mono Visual Basic Qt tutorial ' ' This program demonstrates the ' QLineEdit widget. Text entered in the QLineEdit ' widget is shown in a QLabel widget. ' ' author jan bodnar ' last modified April 2009 ' website www.zetcode.com Imports Qyoto Public Class VBQApp Inherits QWidget Dim label As QLabel Public Sub New() Me.InitUI() Me.SetWindowTitle("QLineEdit") Me.Resize(250, 200) Me.Move(300, 300) Me.Show() End Sub Private Sub InitUI() label = New QLabel(Me) Dim edit As New QLineEdit(Me) Connect(edit, SIGNAL("textChanged(QString)"), Me, _ SLOT("OnChanged(QString)")) edit.Move(60, 100) label.Move(60, 40) End Sub <Q_SLOT()> _ Private Sub OnChanged(ByVal text As String) label.SetText(text) label.AdjustSize() End Sub Public Shared Sub Main(ByVal args() As String) Dim qapp As New QApplication(args) Dim app As New VBQApp QApplication.Exec() End Sub End Class ``` 在我們的示例中，我們顯示了兩個小部件。 行編輯和標簽小部件。 輸入到行編輯中的文本顯示在標簽窗口小部件中。 ```vb Dim edit As New QLineEdit(Me) ``` `QLineEdit`小部件已創建。 ```vb Connect(edit, SIGNAL("textChanged(QString)"), Me, _ SLOT("OnChanged(QString)")) ``` 當我們在行編輯中鍵入或刪除某些文本時，將觸發`OnChanged()`方法。 該方法采用字符串參數。 ```vb <Q_SLOT()> _ Private Sub OnChanged(ByVal text As String) label.SetText(text) label.AdjustSize() End Sub ``` 在`OnChanged()`方法中，我們將行編輯的內容設置為標簽窗口小部件。 `AdjustSize()`方法確保所有文本都是可見的。  圖：`QLineEdit`小部件 ## `ToggleButton` 切換按鈕是設置了可檢查標志的按鈕。 切換按鈕是具有兩種狀態的按鈕。 已按下但未按下。 通過單擊可以在這兩種狀態之間切換。 在某些情況下此功能非常合適。 ```vb ' ZetCode Mono Visual Basic Qt tutorial ' ' This program uses toggle buttons to ' change the background color of ' a widget ' ' author jan bodnar ' last modified April 2009 ' website www.zetcode.com Imports Qyoto Public Class VBQApp Inherits QWidget Dim square As QWidget Dim color As QColor Dim redb As QPushButton Dim greenb As QPushButton Dim blueb As QPushButton Public Sub New() Me.InitUI() Me.SetWindowTitle("Toggle buttons") Me.Resize(350, 240) Me.Move(300, 300) Me.Show() End Sub Private Sub InitUI() color = New QColor() redb = New QPushButton("Red", Me) redb.Checkable = True greenb = New QPushButton("Green", Me) greenb.Checkable = True blueb = New QPushButton("Blue", Me) blueb.Checkable = True Connect(redb, SIGNAL("toggled(bool)"), Me, SLOT("OnToggled()")) Connect(greenb, SIGNAL("toggled(bool)"), Me, SLOT("OnToggled()")) Connect(blueb, SIGNAL("toggled(bool)"), Me, SLOT("OnToggled()")) square = New QWidget(Me) square.SetStyleSheet("QWidget { background-color: black }") redb.Move(30, 30) greenb.Move(30, 80) blueb.Move(30, 130) square.SetGeometry(150, 25, 150, 150) End Sub <Q_SLOT()> _ Private Sub OnToggled() Dim red As Integer = color.Red() Dim green As Integer = color.Green() Dim blue As Integer = color.Blue() If redb.Checked red = 255 Else red = 0 End If If greenb.Checked green = 255 Else green = 0 End If If blueb.Checked blue = 255 Else blue = 0 End If color = New QColor(red, green, blue) Dim sheet As String = String.Format("QWidget {{ background-color: {0} }}", _ color.Name()) square.SetStyleSheet(sheet) End Sub Public Shared Sub Main(ByVal args() As String) Dim qapp As New QApplication(args) Dim app As New VBQApp QApplication.Exec() End Sub End Class ``` 在代碼示例中，我們使用三個切換按鈕來更改矩形小部件的顏色。 ```vb Dim square As QWidget Dim color As QColor Dim redb As QPushButton Dim greenb As QPushButton Dim blueb As QPushButton ``` 我們定義了五個對象。 正方形小部件是`QWidget`，它顯示顏色。 `color`變量用于保存顏色值。 這三個按鈕是切換按鈕，用于混合顏色值。 ```vb redb = New QPushButton("Red", Me) redb.Checkable = True ``` 我們創建一個`QPushButton`小部件。 `Checkable`屬性將按鈕更改為切換按鈕。 ```vb Connect(redb, SIGNAL("toggled(bool)"), Me, SLOT("OnToggled()")) Connect(greenb, SIGNAL("toggled(bool)"), Me, SLOT("OnToggled()")) Connect(blueb, SIGNAL("toggled(bool)"), Me, SLOT("OnToggled()")) ``` 所有三個按鈕都插入到一個方法調用中，即`OnToggled()`方法。 ```vb square = New QWidget(Me) square.SetStyleSheet("QWidget { background-color: black }") ``` 我們創建方形小部件。 一開始是黑色的。 在 Qyoto 中，我們使用樣式表來自定義小部件的外觀。 在`OnToggled()`方法內部，我們確定顏色值并將正方形小部件更新為新顏色。 ```vb Dim red As Integer = color.Red() Dim green As Integer = color.Green() Dim blue As Integer = color.Blue() ``` 在這里，我們確定方形小部件的當前顏色。 ```vb If redb.Checked red = 255 Else red = 0 End If ``` 根據紅色切換按鈕的狀態，更改顏色的紅色部分。 ```vb color = New QColor(red, green, blue) ``` 我們創建一個新的顏色值。 ```vb Dim sheet As String = String.Format("QWidget {{ background-color: {0} }}", _ color.Name()) ``` 我們使用 Visual Basic 格式對象創建適當的樣式表。 ```vb square.SetStyleSheet(sheet) ``` 正方形的顏色已更新。  圖：開關按鈕 ## `QComboBox` `QComboBox`是一個小部件，允許用戶從選項列表中進行選擇。 這是一個顯示當前項目的選擇小部件，可以彈出可選擇項目的列表。 組合框可能是可編輯的。 它以占用最少屏幕空間的方式向用戶顯示選項列表。 ```vb ' ZetCode Mono Visual Basic Qt tutorial ' ' In this program, we use the QComboBox ' widget to select an option. ' The selected option is shown in the ' QLabel widget ' ' author jan bodnar ' last modified April 2009 ' website www.zetcode.com Imports Qyoto Public Class VBQApp Inherits QWidget Dim label As QLabel Public Sub New() Me.SetWindowTitle("QComboBox") Me.InitUI() Me.Resize(250, 200) Me.Move(300, 300) Me.Show() End Sub Private Sub InitUI() label = New QLabel("Ubuntu", Me) Dim combo As New QComboBox(Me) combo.AddItem("Ubuntu") combo.AddItem("Mandriva") combo.AddItem("Fedora") combo.AddItem("Red Hat") combo.AddItem("Gentoo") combo.Move(50, 30) label.Move(50, 100) Connect(combo, SIGNAL("activated(QString)"), _ Me, SLOT("OnActivated(QString)")) End Sub <Q_SLOT()> _ Private Sub OnActivated(ByVal text As String) label.SetText(text) label.AdjustSize() End Sub Public Shared Sub Main(ByVal args() As String) Dim qapp As New QApplication(args) Dim app As New VBQApp QApplication.Exec() End Sub End Class ``` 在我們的代碼示例中，我們有兩個小部件。 組合框和標簽小部件。 從組合框中選擇的選項顯示在標簽中。 ```vb label = New QLabel("Ubuntu", Me) ``` 這是一個標簽，它將顯示組合框中當前選擇的選項。 ```vb Dim combo As New QComboBox(Me) ``` 我們創建`QComboBox`小部件的實例。 ```vb combo.AddItem("Ubuntu") combo.AddItem("Mandriva") combo.AddItem("Fedora") combo.AddItem("Red Hat") combo.AddItem("Gentoo") ``` 組合框將填充值。 ```vb Connect(combo, SIGNAL("activated(QString)"), _ Me, SLOT("OnActivated(QString)")) ``` 當我們從組合框中選擇一個選項時，將觸發`OnActivated()`方法。 ```vb <Q_SLOT()> _ Private Sub OnActivated(ByVal text As String) label.SetText(text) label.AdjustSize() End Sub ``` 在`OnActivated()`方法中，我們將標簽小部件更新為從組合框中選擇的當前字符串。  圖：`QComboBox`小部件 在 Visual Basic Qyoto 教程的這一部分中，我們介紹了幾個 Qyoto 小部件。 {% endraw %}