自製 ProgressBar 控制項(一)可自行訂義外觀色彩

工具箱裡 ProgressBar 要變化預設色彩好像要花些功夫,那就自製一個簡單的....

工具箱裡 ProgressBar 要變化預設色彩好像要花些功夫,那就自製一個簡單的…

 


做成 Dll 後的執行效果:

image image

 

 


程式碼沒有重新整理過,不過也不算複雜,有興趣的朋友可參考看看有哪些要修正的。

Imports System.ComponentModel
Imports System.Drawing.Drawing2D
<Description("進度顯示控制項"), System.Drawing.ToolboxBitmap(GetType(ku_ProgressBar), "__kuProgressBar.png")> _
Public Class ku_ProgressBar
    Private new_最大設定值 As Integer
    Private new_最小設定值 As Integer
    Private new_當下進度值 As Single
    Private new_進度列背景色 As Color
    Private new_進度列前景色 As Color
    Private new_漸層圖 As Image
    Private new_以立體呈現 As Boolean = True
#Region "---屬性---"
    '---關掉原屬性---
    <Browsable(False)> Overloads Property Backcolor() As Color
    <Browsable(False)> Overloads Property Forecolor() As Color
    '---加入新屬性---
    <Description("最大設定值"), Browsable(True), Category("行為")> _
    Public Property 最大設定值() As Integer
        Get
            Return new_最大設定值
        End Get
        Set(value As Integer)
            new_最大設定值 = value
        End Set
    End Property
    <Description("最小設定值"), Browsable(True), Category("行為")> _
    Public Property 最小設定值() As Integer
        Get
            Return new_最小設定值
        End Get
        Set(ByVal value As Integer)
            new_最小設定值 = value
        End Set
    End Property
    <Description("當下進度值(R/W)"), Browsable(True), Category("行為")> _
    Public Property 當下進度值() As Single
        Get
            Return Math.Round(new_當下進度值, 2)
        End Get
        Set(ByVal value As Single)
            If value < 0 Then value = 0
            If value > new_最大設定值 Then value = new_最大設定值
            new_當下進度值 = value
            pic_進度圖.Size = New System.Drawing.Point((Me.Width * new_當下進度值 / new_最大設定值), Me.Height)
        End Set
    End Property
    <Description("進度列的前景色(R/W)"), Browsable(True), Category("外觀")> _
    Public Property 進度列前景色() As Color
        Get
            Return new_進度列前景色
        End Get
        Set(ByVal value As Color)
            new_進度列前景色 = value
            pic_進度圖.BackColor = value
            更新介面()
        End Set
    End Property
    <Description("進度列的背景色(R/W)"), Browsable(True), Category("外觀")> _
    Public Property 進度列背景色() As Color
        Get
            Return new_進度列背景色
        End Get
        Set(ByVal value As Color)
            new_進度列背景色 = value
            pic_進度底圖.BackColor = value
        End Set
    End Property
    <Description("決定進度列是否以立體呈現(True/False)"), Browsable(True), Category("外觀")> _
    Public Property 以立體呈現() As Boolean
        Get
            Return new_以立體呈現
        End Get
        Set(ByVal value As Boolean)
            new_以立體呈現 = value
            更新介面()
        End Set
    End Property
#End Region
#Region "---內部動作---"
    Sub New()
        InitializeComponent()
        Me.Size = New Size(160, 12)
        new_最大設定值 = 100
        new_最小設定值 = 0
        new_當下進度值 = 25
        new_進度列背景色 = Color.FromArgb(200, 255, 200)
        new_進度列前景色 = Color.Green
        pic_進度圖.Location = New System.Drawing.Point(0, 0)
        pic_進度圖.Size = New System.Drawing.Point((Me.Width * new_當下進度值 / new_最大設定值), Me.Height)
        更新介面()
    End Sub
    Public Sub Demo()
        Dim f = New demo
        f.ShowDialog()
    End Sub
    Private Sub 更新介面()
        pic_進度底圖.BackColor = new_進度列背景色
        pic_進度圖.BackColor = new_進度列前景色
        If new_以立體呈現 Then
            new_漸層圖 = 新建漸層色塊(2, 10, new_進度列前景色, Color.White, 90)
            pic_進度圖.BackgroundImage = new_漸層圖
        Else
            pic_進度圖.BackgroundImage = Nothing
        End If
    End Sub
    Private Function 新建漸層色塊 _
    (ByVal w As Integer, ByVal h As Integer, ByVal 暗色 As Color, ByVal 亮色 As Color, ByVal 方向 As Integer) As Image
        Dim bmp As Bitmap = New System.Drawing.Bitmap(w, h)
        Dim g As Graphics = Graphics.FromImage(bmp)
        Dim rect0 As New Rectangle(0, 0, bmp.Size.Width, bmp.Size.Height)
        Dim 漸層色0 As LinearGradientBrush = New LinearGradientBrush(rect0, 亮色, 暗色, 方向)
        g.FillRectangle(漸層色0, rect0)
        Return bmp
    End Function
    Private Sub ProgressBar_Resize(sender As Object, e As System.EventArgs) Handles Me.Resize
        '---當介面大小改變時同時調整進度圖之大小---
        With pic_進度底圖
            .Location = New System.Drawing.Point(0, 0)
            .Size = New System.Drawing.Point(Me.Width, Me.Height)
        End With
        With pic_進度圖
            .BringToFront()
            .Location = New System.Drawing.Point(0, 0)
            .Height = Me.Height
            .BackgroundImageLayout = ImageLayout.Stretch
        End With
        If Not IsNothing(MyBase.ParentForm) Then
            pic_進度圖.Size = New System.Drawing.Point((Me.Width * new_當下進度值 / new_最大設定值), Me.Height)
        End If
    End Sub
#End Region
End Class

 

 

 

 

 


因為 Demo 功能寫在控制項裡,所以測試專案只要一列程式就可以了:

Public Class Form1
    Private Sub Form1_Load(sender As System.Object, e As System.EventArgs) Handles MyBase.Load
        Ku_ProgressBar1.Demo()
    End Sub
End Class

 

 

 

 

 

 


可以設定的屬性有以下這些:

image

 


專案包下載:ProgressBar.rar

 


ku3