65.9K
CodeProject 正在变化。 阅读更多。
Home

MBTab 控件自定义视觉样式

starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.33/5 (5投票s)

2013年9月8日

CPOL

1分钟阅读

viewsIcon

33744

downloadIcon

2909

使用 VB.NET 的 MBTab 控件,具有自定义视觉风格

650295/MBTabControl_Demo.JPG

引言

为什么需要另一个 Tab 控件? 标准 Tab 控件的功能过于有限,而且我找不到一个编写的自定义控件能够满足我所有的需求。这是一个具有大量属性和灵活性的用户控件。它使用起来很简单,只需将其拖放到窗体上,调整设计时属性,然后像使用普通的 Tab 控件一样使用它。

背景

MBTabControl 是一个Control,它继承了简单 TabControl 控件的所有属性。我在 MBTabControl 中添加了一些额外的功能,例如发光效果带有圆角的选项卡带有图像的选项卡等。使用的语言是 VB.NET。

控件属性

以下是 MBTabControl 中可用的一些属性列表
  • SelectedTabBorderColor:此属性用于设置选中选项卡的边框颜色。
  • TabCloseButton:此属性用于在选项卡上显示关闭按钮。
  • TabTextColor:此属性用于设置选项卡的文本颜色。
  • Radius:此属性用于设置选项卡的圆角半径。
  • CloseButtonColor:此属性用于设置选项卡的关闭按钮颜色。

使用代码

这个 MBTabControl 的概念来自 “Microsoft Ribbons”。 我将控件事件和函数组织成如下层级结构

此方法为 MBTabControl 绘制选项卡页

''' <summary>
''' Draw TabPage for MBTabControl
''' </summary>
Private Sub DrawTabPage(ByVal index As Integer, ByVal graphics As Graphics)
        graphics.SmoothingMode = SmoothingMode.HighSpeed
        Using tabPageBorderPath As GraphicsPath = Me.GetTabPageBorder(index)
            Using fillBrush As Brush = Me._StyleProvider.GetPageBackgroundBrush(index)
                graphics.FillPath(fillBrush, tabPageBorderPath)
            End Using
            If Me._Style <> MBTabStyle.None Then
                Me._StyleProvider.PaintTab(index, graphics)
                Me.DrawTabImage(index, graphics)
                Me.DrawTabText(index, graphics)
            End If
            Me.DrawTabBorder(tabPageBorderPath, index, graphics)
        End Using
End Sub  
此方法为 MBTabControl 绘制选项卡上的图像
''' <summary>
''' Draw TabImage for MBTabControl
''' </summary>
Private Sub DrawTabImage(ByVal index As Integer, ByVal graphics As Graphics)
        Dim tabImage As Image = Nothing
        If Me.TabPages(index).ImageIndex > -1 AndAlso Me.ImageList IsNot Nothing AndAlso Me.ImageList.Images.Count > Me.TabPages(index).ImageIndex Then
            tabImage = Me.ImageList.Images(Me.TabPages(index).ImageIndex)
        ElseIf (Not String.IsNullOrEmpty(Me.TabPages(index).ImageKey) AndAlso Not Me.TabPages(index).ImageKey.Equals("(none)", StringComparison.OrdinalIgnoreCase)) AndAlso Me.ImageList IsNot Nothing AndAlso Me.ImageList.Images.ContainsKey(Me.TabPages(index).ImageKey) Then
            tabImage = Me.ImageList.Images(Me.TabPages(index).ImageKey)
        End If
        If tabImage IsNot Nothing Then
            If Me.RightToLeftLayout Then
                tabImage.RotateFlip(RotateFlipType.RotateNoneFlipX)
            End If
            Dim imageRect As Rectangle = Me.GetTabImageRect(index)
            If Me.TabPages(index).Enabled Then
                graphics.DrawImage(tabImage, imageRect)
            Else
                ControlPaint.DrawImageDisabled(graphics, tabImage, imageRect.X, imageRect.Y, Color.Transparent)
            End If
        End If
End Sub 
此方法为 MBTabControl 绘制选项卡上的关闭按钮
Protected Overridable Sub DrawTabCloseButton(ByVal index As Integer, ByVal graphics As Graphics)
        If Me._ShowTabCloser Then
            Dim closerRect As Rectangle = Me._TabControl.GetTabCloserRect(index)
            graphics.SmoothingMode = SmoothingMode.AntiAlias
            Using closerPath As GraphicsPath = MBTabStyleProvider.GetCloserPath(closerRect)
                If closerRect.Contains(Me._TabControl.MousePosition) Then
                    Using closerPen As New Pen(Me._CloserColorActive)
                        graphics.DrawPath(closerPen, closerPath)
                    End Using
                Else
                    Using closerPen As New Pen(Me._CloserColor)
                        graphics.DrawPath(closerPen, closerPath)
                    End Using

                End If
            End Using
        End If
End Sub

关注点

650295/MBTabControlPOI.JPG

在您的应用程序中使用 MBTabControl 非常容易。只需将提供的 DLL 的引用添加到您的应用程序,然后拖放即可。

650295/MBTabControl.JPG

历史

  • 2013/9/8:MBTabControl 版本 1.0
© . All rights reserved.