VB.NET：標準ラベルコントロールにグラデーションを追加したGradientLabelコントロール

2025/05/11

VB.NETで標準ラベルコントロールから派生した、背景色をグラデーション描画するGradientLabelコントロールを作成しました。

このコントロールには以下の追加プロパティが備わっています。

プロパティ	概要
`BackColor2`	グラデーション終了色 (デフォルトのBackColorからBackColor2への色の変化)
`FrameColor`	ラベルの枠色
`GradientMode`	グラデーションの方向(LinearGradientMode)
`GradientCount`	グラデーションの回数 (回数は1から10に強制的におさえている)

このGradientLabelコントロールのソースは以下の様になっています。
バックグラウンド描画イベント処理にてグラデーション用ブラシでグラデーションの色と位置を設定し、内部を描画します。さらに、枠色で枠を描画しています。

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

Imports System.ComponentModel
Imports System.Drawing.Drawing2D
 
Public Class GradientLabel
    Inherits System.Windows.Forms.Label
 
    ''' <summary>
    ''' コンストラクタ
    ''' </summary>
    ''' <remarks></remarks>
    Public Sub New()
        MyBase.New()
        MyBase.BackColor = Color.Transparent
        Me._GradientMode = LinearGradientMode.Horizontal
    End Sub
 
    ''' <summary>
    ''' バックグラウンド描画イベント処理
    ''' </summary>
    Protected Overrides Sub OnPaintBackground(ByVal pevent As System.Windows.Forms.PaintEventArgs)
        Dim g As Graphics = pevent.Graphics
        If Me.BackColor.A < 255 OrElse Me.BackColor2.A < 255 Then
            MyBase.OnPaintBackground(pevent)
        End If
        '描画領域
        Dim rect As Rectangle = New Rectangle(0, 0, Me.Width, Me.Height)
        'グラデーション用ブラシ
        Dim lgb As LinearGradientBrush = New LinearGradientBrush(rect, Color.Red, Color.Violet, Me._GradientMode)
        'グラデーション用のColorBlendクラス
        Dim cb As ColorBlend = New ColorBlend()
        'グラデーションの色と位置を設定
        Dim arrColors(Me._GradientCount) As Color
        Dim arrPos(Me._GradientCount) As Single
        For i As Integer = 0 To _GradientCount
            If (i And 1) = 0 Then
                arrColors(i) = Me._BackColor
            Else
                arrColors(i) = Me._BackColor2
            End If
            arrPos(i) = i / _GradientCount
        Next
        cb.Colors = arrColors
        cb.Positions = arrPos
        lgb.InterpolationColors = cb    '複数の色による線形グラデーション定義
        g.FillRectangle(lgb, rect)      '描画
 
        '枠を描画する(取敢えず線の幅は２)
        Using pen As New Pen(Me._FrameColor, 2)
            pen.DashStyle = Drawing2D.DashStyle.Solid
            g.DrawRectangle(pen, rect)
        End Using
    End Sub
 
    Private _BackColor As Color
    Public Shadows Property BackColor() As Color
        Get
            If Me._BackColor <> Color.Empty Then
                Return Me._BackColor
            End If
            If Me.Parent IsNot Nothing Then
                Return Me.Parent.BackColor
            End If
            Return Control.DefaultBackColor
        End Get
        Set(ByVal value As Color)
            Me._BackColor = value
            Me.Invalidate() '再描画
        End Set
    End Property
 
    Private _BackColor2 As Color
    <Category("Display"), Description("グラデーション終了色")> _
    Public Property BackColor2() As Color
        Get
            If Me._BackColor2 <> Color.Empty Then
                Return Me._BackColor2
            End If
            If Me.Parent IsNot Nothing Then
                Return Me.Parent.BackColor
            End If
            Return Control.DefaultBackColor
        End Get
        Set(ByVal value As Color)
            Me._BackColor2 = value
            Me.Invalidate() '再描画
        End Set
    End Property
 
    Private _FrameColor As Color = Color.Black
    <Category("Display"), Description("枠色")> _
    Public Property FrameColor() As Color
        Get
            If Me._FrameColor <> Color.Empty Then
                Return Me._FrameColor
            End If
            Return Color.Black
        End Get
        Set(ByVal value As Color)
            Me._FrameColor = value
            Me.Invalidate() '再描画
        End Set
    End Property
 
    Private _GradientMode As LinearGradientMode
    <Category("Display")> _
    <DefaultValue(GetType(LinearGradientMode), "Horizontal"), Description("グラデーションの方向")> _
    Public Property GradientMode() As LinearGradientMode
        Get
            Return Me._GradientMode
        End Get
        Set(ByVal value As LinearGradientMode)
            Me._GradientMode = value
            Me.Invalidate() '再描画
        End Set
    End Property
 
    Private _GradientCount As Integer = 4
    <Category("Display")> _
    <DefaultValue(GetType(Integer), "4"), Description("グラデーションの回数")> _
    Public Property GradientCount() As Integer
        Get
            Return Me._GradientCount
        End Get
        Set(ByVal value As Integer)
            If value < 1 Then value = 1
            If value > 10 Then value = 10
            Me._GradientCount = value
            Me.Invalidate() '再描画
        End Set
    End Property
End Class

このコントロールを使った例を以下に示します。

■GradientMode：Horizontal
左から右に向かってグラデーションされます。
BackColor⇒BackColor2の色変化のグラデーションです。
GradientCount=1の場合は、BackColor⇒BackColor2のみのグラデーションで
GradientCount=2の場合は、BackColor⇒BackColor2⇒BackColorのグラデーションとなります。
その後、GradientCountの値が増えるに従って、「BackColor2」「BackColor」が繰り返されます。

■GradientMode：Vertical
上から下に向かってグラデーションされます。

■GradientMode：ForwardDiagonal
左上から右下に向かってグラデーションされます。

■GradientMode：BackwardDiagonal
右上から左下に向かってグラデーションされます。

=====
2015/03/23：の時の情報

VB.NET-TIPS などプログラミングについて

おすすめ本

コメント