SunnyUI uiSplitContainer应用

在 SunnyUI 中，UISplitContainer 控件用于创建可调整大小的容器，可以水平或垂直分割。要使 UISplitContainer 在垂直分割模式下向下折叠，您需要调整 UISplitContainer 的属性来实现这一效果。

1. 设置 UISplitContainer 的属性

要让 UISplitContainer 在垂直分割模式下向下折叠，您需要设置 UISplitContainer 的 IsSplitterFixed 属性为 false，并且通过调整 UISplitContainer 的 SplitterDistance 属性来改变分割的位置。此外，您可能还需要设置 UISplitContainer 的 Orientation 属性为 Vertical。

2. 示例代码

下面是一个示例代码，演示如何在垂直模式下使用 UISplitContainer 并向下折叠：

Csharp

深色版本

1using System;
2using System.Drawing;
3using System.Windows.Forms;
4using Sunny.UI;
5
6namespace SunnyUISplitContainerExample
7{
8    public partial class Form1 : Form
9    {
10        private UISplitContainer splitContainer;
11
12        public Form1()
13        {
14            InitializeComponent();
15
16            // 创建 UISplitContainer 控件
17            splitContainer = new UISplitContainer();
18            splitContainer.Dock = DockStyle.Fill;
19            splitContainer.Orientation = Orientation.Vertical;
20            splitContainer.IsSplitterFixed = false;
21            splitContainer.SplitterDistance = 200; // 初始分割位置
22            splitContainer.SplitterWidth = 5; // 分割条宽度
23
24            // 创建两个面板作为容器
25            UIPanel panelTop = new UIPanel();
26            panelTop.Dock = DockStyle.Fill;
27            panelTop.Text = "Top Panel";
28            panelTop.BackColor = Color.LightBlue;
29
30            UIPanel panelBottom = new UIPanel();
31            panelBottom.Dock = DockStyle.Fill;
32            panelBottom.Text = "Bottom Panel";
33            panelBottom.BackColor = Color.LightGreen;
34
35            // 将面板添加到 UISplitContainer
36            splitContainer.Panel1.Controls.Add(panelTop);
37            splitContainer.Panel2.Controls.Add(panelBottom);
38
39            // 将 UISplitContainer 添加到窗体
40            this.Controls.Add(splitContainer);
41        }
42
43        private void Form1_Load(object sender, EventArgs e)
44        {
45            // 在窗体加载时调整 SplitterDistance 以向下折叠
46            splitContainer.SplitterDistance = splitContainer.Height - 50; // 设置为接近底部的位置
47        }
48    }
49}

3. 解释

• 初始化 UISplitContainer：

  • 设置 Dock 属性为 Fill 以填充整个窗体。
  • 设置 Orientation 为 Vertical 以垂直分割。
  • 设置 IsSplitterFixed 为 false 以允许调整分割位置。
  • 设置 SplitterDistance 为初始分割位置。
  • 设置 SplitterWidth 为分割条的宽度。

• 创建面板：

  • 创建两个 UIPanel 控件作为容器。
  • 设置面板的 Dock 属性为 Fill 以填充各自的区域。
  • 设置面板的背景颜色以区分上下两个部分。

• 加载事件：

  • 在窗体加载时，通过调整 SplitterDistance 来向下折叠。

4. 注意事项

• 确保您的项目已经安装了 SunnyUI，并且在项目中引用了 SunnyUI 命名空间。
• 您可以根据需要调整 SplitterDistance 的值来控制折叠的程度。
• 如果您想要在运行时动态地调整 SplitterDistance，可以在事件处理程序中更新这个属性。