Question

我正在尝试创建一个由三个不同元素组成的动画可折叠面板。每个元素都是从位于用户控件上的面板容器创建的。它由标题面板，内容面板和页脚面板组成（页脚面板位于内容面板内）：

enter image description here

在每个面板中，我覆盖绘制事件并执行我自己的自定义绘图。这包括圆角，绘制边框和填充背景（以及在页眉和页脚的情况下绘制文本）。

该控件还允许用户在设计时和运行时嵌入到内容面板中。

当放在表单上时，它看起来就像我想要的那样，但是，我似乎无法在无缝的平滑＆＃39;中为面板设置动画。过渡。在扩展面板时，它是生涩，紧张，看起来很可怕（即使没有内容）。

它的工作方式是，当最小化时，内容面板（包括页脚面板）缩小到只有标题面板的高度。然后标题面板重绘自己看起来不同。然后，当最大化时，面板基本上反过来做所有事情。

我的动画代码如下：

Dim m_Height As Integer = Me.Height
Dim m_HeaderHeight As Integer = 40
Dim m_FooterHeight As Integer = 35
Dim ShrinkStepSize As Integer = CInt((m_Height - m_HeaderHeight) / 10)
Dim ExpandStepSize As Integer = CInt((m_Height - m_HeaderHeight) / 4)

Private Sub picMinimize_Click(sender As Object, e As EventArgs) Handles picMinimize.Click
    While (Me.Height > m_HeaderHeight)
        Me.Height -= Math.Min(Me.Height - m_HeaderHeight, ShrinkStepSize)
        Application.DoEvents()
    End While

    picMaximise.Visible = True
    picMinimize.Visible = False
    m_Minimized = True
    Me.Invalidate(pnlHeader.ClientRectangle, True)
End Sub

Private Sub picMaximise_Click(sender As Object, e As EventArgs) Handles picMaximise.Click
    While (Me.Height < m_Height)
        Me.Height += Math.Min(m_Height - Me.Height, ExpandStepSize)
        Application.DoEvents()
    End While

    picMaximise.Visible = False
    picMinimize.Visible = True
    m_Minimized = False
    Me.Invalidate(pnlHeader.ClientRectangle, True)
End Sub

并且没有发布我的所有代码（除非它是必需的），以下是标题，内容和页脚面板的所有绘制事件：

Private Sub pnlHeader_Paint(sender As Object, e As PaintEventArgs) Handles pnlHeader.Paint
    Dim rect As Rectangle = pnlHeader.ClientRectangle
    rect.X = rect.X + 1
    rect.Y = rect.Y + 1
    rect.Width -= 2
    rect.Height -= 2

    'Position the icon elements
    picClose.Location = New Point(rect.Width - (picClose.Width + 8), CInt(((rect.Height - picClose.Height) / 2) + 3))
    picOptions.Location = New Point(rect.Width - ((picClose.Width + picOptions.Width) + 10), CInt(((rect.Height - picOptions.Height) / 2) + 2))
    picMinimize.Location = New Point(rect.Width - ((picMinimize.Width + picOptions.Width + picClose.Width) + 15), CInt(((rect.Height - picMinimize.Height) / 2) + 3))
    picMaximise.Location = New Point(rect.Width - ((picMaximise.Width + picOptions.Width + picClose.Width) + 15), CInt(((rect.Height - picMaximise.Height) / 2) + 3))

    Dim path As Drawing2D.GraphicsPath = RoundRectangle(rect, CornerRadius, Me.CornerRounding)

    If m_Minimized Then
        'Draw the background
        Using br As Brush = New SolidBrush(Color.White)
            e.Graphics.FillPath(br, path)
        End Using

        'Draw the border
        Using br As Brush = New SolidBrush(BorderColour)
            e.Graphics.DrawPath(New Pen(br, 1), path)
        End Using
    End If

    'Draw the text
    Dim textRect As Rectangle = rect
    textRect.X += m_HeaderAdjustment

    Using string_format As New StringFormat()
        string_format.Alignment = StringAlignment.Near
        string_format.LineAlignment = StringAlignment.Center
        e.Graphics.DrawString(HeaderText, New Font("Segoe UI", 13, FontStyle.Bold, GraphicsUnit.Pixel), New SolidBrush(Color.FromArgb(157, 159, 162)), textRect, string_format)
    End Using
End Sub

Private Sub pnlContent_Paint(sender As Object, e As PaintEventArgs) Handles pnlContent.Paint
    Dim rect As Rectangle = pnlContent.ClientRectangle
    rect.X = rect.X + 1
    rect.Y = rect.Y + 1
    rect.Width -= 2
    rect.Height -= 2

    Dim path As Drawing2D.GraphicsPath = RoundRectangle(rect, CornerRadius, Me.CornerRounding)

    'Draw the background
    Using br As Brush = New SolidBrush(Color.White)
        e.Graphics.FillPath(br, path)
    End Using

    'Draw the border
    Using br As Brush = New SolidBrush(BorderColour)
        rect.Inflate(-1, -1)
        e.Graphics.DrawPath(New Pen(br, 1), path)
    End Using
End Sub

Private Sub pnlFooter_Paint(sender As Object, e As PaintEventArgs) Handles pnlFooter.Paint
    Dim rect As Rectangle = pnlFooter.ClientRectangle
    rect.X = rect.X + 1
    rect.Y = rect.Y + 1
    rect.Width -= 2
    rect.Height -= 2

    Dim rounding As Corners = Corners.BottomLeft Or Corners.BottomRight
    Dim path As Drawing2D.GraphicsPath = RoundRectangle(rect, CornerRadius, rounding)

    'Draw the background
    Using br As Brush = New SolidBrush(FooterBackColour)
        e.Graphics.FillPath(br, path)
    End Using

    'Draw the border
    Using br As Brush = New SolidBrush(BorderColour)
        e.Graphics.DrawPath(New Pen(br, 1), path)
    End Using

    'Draw the text
    Dim textRect As Rectangle = rect
    textRect.X += m_FooterAdjustment
    textRect.Y += 1

    Using string_format As New StringFormat()
        string_format.Alignment = StringAlignment.Near
        string_format.LineAlignment = StringAlignment.Center
        e.Graphics.DrawString(FooterText, New Font("Segoe UI", 11, FontStyle.Regular, GraphicsUnit.Pixel), New SolidBrush(FooterForeColour), textRect, string_format)
    End Using
End Sub

对此的任何帮助将不胜感激。谢谢你。

什么是动画面板容器打开和关闭的最佳方式（添加控件）

0 个答案: