# Qyoto 中的自定義小部件 > 原文： [http://zetcode.com/gui/vbqyoto/customwidget/](http://zetcode.com/gui/vbqyoto/customwidget/) 在 Visual Basic Qyoto 編程教程的這一部分中，我們將創建一個自定義窗口小部件。 工具箱通常僅提供最常見的窗口小部件，例如按鈕，文本窗口小部件，滑塊等。沒有工具箱可以提供所有可能的窗口小部件。 程序員必須自己創建此類小部件。 他們使用工具箱提供的繪圖工具來完成此任務。 有兩種可能性。 程序員可以修改或增強現有的小部件。 或者，他可以從頭開始創建自定義窗口小部件。 ## 刻錄小部件 在下一個示例中，我們將創建一個自定義刻錄小部件。 可以在 Nero 或 K3B 之類的應用中看到此小部件。 該小部件將從頭開始創建。 `burning.vb` ```vb Imports Qyoto NameSpace Burning Public Class Burning Inherits QWidget Const PANEL_HEIGHT As Integer = 30 Const DISTANCE As Integer = 19 Const LINE_WIDTH As Integer = 5 Const DIVISIONS As Integer = 10 Const FULL_CAPACITY As Double = 700.0 Const MAX_CAPACITY As Double = 750.0 Dim redColor As New QColor(255, 175, 175) Dim yellowColor As New QColor(255, 255, 184) Dim parent As QWidget Dim num() As String = { _ "75", "150", "225", "300", _ "375", "450", "525", "600", _ "675" _ } Public Sub New(ByVal parent As QWidget) Me.parent = parent MinimumHeight = PANEL_HEIGHT End Sub Protected Overrides Sub PaintEvent(ByVal e As QPaintEvent) Dim painter As New QPainter(Me) Me.DrawWidget(painter) painter.End() End Sub Private Sub DrawWidget(ByVal painter As QPainter) Dim burn As CustomWidget.VBQApp = CType(parent, CustomWidget.VBQApp) Dim slid_width As Double = burn.GetCurrentWidth() Dim width As Double = Size.Width() Dim move As Double = width / DIVISIONS Dim till As Double = (width / MAX_CAPACITY) * slid_width Dim full As Double = (width / MAX_CAPACITY) * FULL_CAPACITY If slid_width > FULL_CAPACITY painter.SetPen(New QPen(New QBrush(yellowColor), 1)) painter.SetBrush(New QBrush(yellowColor)) painter.DrawRect(New QRectF(0, 0, full, PANEL_HEIGHT)) painter.SetPen(New QPen(New QBrush(redColor), 1)) painter.SetBrush(New QBrush(redColor)) painter.DrawRect(New QRectF(full+1, 0, till-full, PANEL_HEIGHT)) Else If (slid_width > 0) painter.SetPen(New QPen(New QBrush(yellowColor), 1)) painter.SetBrush(New QBrush(yellowColor)) painter.DrawRect(New QRectF(0, 0, till, PANEL_HEIGHT)) End If End If painter.SetPen(New QColor(90, 90, 90)) painter.SetBrush(BrushStyle.NoBrush) painter.DrawRect(0, 0, Size.Width()-1, PANEL_HEIGHT-1) Dim newFont As QFont = painter.Font() newFont.SetPointSize(7) painter.SetFont(newFont) Dim metrics As New QFontMetrics(newFont) For i As Integer = 1 to num.Length painter.DrawLine(New QLineF(i*move, 1, i*move, LINE_WIDTH)) Dim w As Integer = metrics.Width(num(i-1)) painter.DrawText(New QPointF(i*move-w/2, DISTANCE), num(i-1)) Next End Sub End Class End Namespace ``` 在這個文件中，我們創建了刻錄小部件。 ```vb Public Class Burning Inherits QWidget ``` 自定義窗口小部件基于`QWidget`小部件。 ```vb Const PANEL_HEIGHT As Integer = 30 Const DISTANCE As Integer = 19 Const LINE_WIDTH As Integer = 5 Const DIVISIONS As Integer = 10 Const FULL_CAPACITY As Double = 700.0 Const MAX_CAPACITY As Double = 750.0 ``` 這些是重要的常數。 `PANEL_HEIGHT`定義自定義窗口小部件的高度。 `DISTANCE`是比例尺上的數字與其父邊框頂部之間的距離。 `LINE_WIDTH`是垂直線的寬度。 `DIVISIONS`是秤的數量。 `FULL_CAPACITY`是媒體的容量。 達到目標后，就會發生過度刻錄。 用紅色顯示。 `MAX_CAPACITY`是介質的最大容量。 ```vb Dim num() As String = { _ "75", "150", "225", "300", _ "375", "450", "525", "600", _ "675" _ } ``` 我們使用這些數字來構建刻錄小部件的比例。 ```vb Protected Overrides Sub PaintEvent(ByVal e As QPaintEvent) Dim painter As New QPainter(Me) Me.DrawWidget(painter) painter.End() End Sub ``` 自定義窗口小部件的圖形委托給`DrawWidget()`方法。 ```vb Dim burn As CustomWidget.VBQApp = CType(parent, CustomWidget.VBQApp) ``` 我們檢索對父窗口小部件的引用。 ```vb Dim slid_width As Double = burn.GetCurrentWidth() ``` 我們使用它來獲取當前選定的滑塊值。 ```vb Dim width As Double = Size.Width() ``` 我們得到小部件的寬度。 自定義窗口小部件的寬度是動態的。 用戶可以調整大小。 ```vb Dim till As Double = (width / MAX_CAPACITY) * slid_width Dim full As Double = (width / MAX_CAPACITY) * FULL_CAPACITY ``` 我們使用`width`變量進行轉換。 在比例尺值和自定義小部件的度量之間。 請注意，我們使用浮點值。 我們在繪圖中獲得了更高的精度。 ```vb painter.SetPen(New QPen(New QBrush(redColor), 1)) painter.SetBrush(New QBrush(redColor)) painter.DrawRect(New QRectF(full+1, 0, till-full, PANEL_HEIGHT)) ``` 這三行畫出紅色矩形，表示過度燃燒。 ```vb painter.DrawRect(0, 0, Size.Width()-1, PANEL_HEIGHT-1) ``` 這是小部件的周長。 外部矩形。 ```vb painter.DrawLine(New QLineF(i*move, 1, i*move, LINE_WIDTH)) ``` 在這里，我們畫出小的垂直線。 ```vb Dim w As Integer = metrics.Width(num(i-1)) painter.DrawText(New QPointF(i*move-w/2, DISTANCE), num(i-1)) ``` 在這里，我們繪制刻度的數字。 為了精確定位數字，我們必須獲得字符串的寬度。 `main.vb` ```vb Imports Qyoto ' ZetCode Mono Visual Basic Qt tutorial ' ' In this program, we create ' a custom widget ' ' @author jan bodnar ' website zetcode.com ' last modified May 2009 NameSpace CustomWidget Public Class VBQApp Inherits QWidget Const MAX_CAPACITY As Integer = 750 Dim slider As QSlider Dim widget As QWidget Dim cur_width As Integer Public Sub New() Me.SetWindowTitle("The Burning Widget") Me.InitUI() Me.Resize(370, 200) Me.Move(300, 300) Me.Show() End Sub Private Sub InitUI() slider = New QSlider(Qt.Orientation.Horizontal , Me) slider.Maximum = MAX_CAPACITY slider.SetGeometry(50, 50, 130, 30) Connect(slider, SIGNAL("valueChanged(int)"), Me, _ SLOT("ValueChanged(int)")) Dim vbox As New QVBoxLayout(Me) Dim hbox As New QHBoxLayout vbox.AddStretch(1) widget = New Burning.Burning(Me) hbox.AddWidget(widget, 0) vbox.AddLayout(hbox) SetLayout(vbox) End Sub <Q_SLOT()> _ Public Sub ValueChanged(ByVal val As Integer) cur_width = val widget.Repaint() End Sub Public Function GetCurrentWidth() As Integer Return cur_width End Function 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 NameSpace CustomWidget ``` 這是主文件。 在這里，我們創建滑塊小部件并使用我們的自定義小部件。 ```vb widget = New Burning.Burning(Me) hbox.AddWidget(widget, 0) ``` 我們創建了刻錄小部件的實例，并將其添加到水平框中。 ```vb <Q_SLOT()> _ Public Sub ValueChanged(ByVal val As Integer) cur_width = val widget.Repaint() End Sub ``` 當滑塊的值更改時，我們將其存儲在`cur_width`變量中，然后重新繪制自定義窗口小部件。 ```vb Public Function GetCurrentWidth() As Integer Return cur_width End Function ``` 定制小部件調用此方法以獲取實際的滑塊值。  圖：刻錄小部件 在 Visual Basic Qyoto 教程的這一部分中，我們演示了如何創建自定義窗口小部件。