# GroupBox 使用文档
本文档介绍 AtomUI GroupBox 控件的各种使用方式,示例代码摘自 Gallery 演示程序。
> 📖 Gallery 源码位置:`controlgallery/AtomUIGallery/ShowCases/Views/DataDisplay/GroupBoxShowCase.axaml`
---
## 前置准备
在 AXAML 中使用 GroupBox,需要引入以下命名空间:
```xml
xmlns:atom="https://atomui.net"
xmlns:antdicons="https://atomui.net/icons/antdesign"
```
在 C# 代码中引入:
```csharp
using AtomUI.Desktop.Controls; // GroupBox 控件、GroupBoxTitlePosition 枚举
```
---
## 1. 基本用法
最基本的 GroupBox 用法——设置标题并放入内容:
```xml
Content of group box
```
GroupBox 继承自 `ContentControl`,可以容纳任意单个子控件。通常放置一个布局面板(`StackPanel`、`Grid`、`DockPanel` 等)来组织多个子控件。
---
## 2. 标题位置
通过 `HeaderTitlePosition` 属性控制标题在顶部边框上的水平位置,支持 `Left`(默认)、`Center`、`Right` 三种。
```xml
Content of group box
Content of group box
Content of group box
```
**使用场景指引**:
- **Left**:最常见的位置,适用于大多数表单分组场景
- **Center**:适用于对称布局或需要强调分组标题的场景
- **Right**:适用于特殊的设计需求或 RTL(从右到左)布局
---
## 3. 标题字体样式
GroupBox 提供 `HeaderFontStyle`、`HeaderFontWeight`、`HeaderTitleColor` 三个属性来精细控制标题的字体外观:
```xml
Content of group box
Content of group box
Content of group box
Content of group box
```
---
## 4. 标题图标
通过 `HeaderIcon` 属性在标题文本左侧添加图标。图标使用 Ant Design 图标集提供:
```xml
Content of group box
```
图标可以与标题位置、字体样式自由组合:
```xml
Option 1
Option 2
```
---
## 5. 嵌套内容
GroupBox 作为 `ContentControl`,可以容纳任意复杂的子控件树:
### 嵌套表单控件
```xml
姓名:
邮箱:
备注:
```
### 嵌套其他 GroupBox
```xml
分辨率:1920 × 1080
状态:已连接
```
---
## 6. C# 代码操作
### 动态创建 GroupBox
```csharp
using AtomUI.Desktop.Controls;
using Avalonia.Controls;
using Avalonia.Media;
var groupBox = new GroupBox
{
HeaderTitle = "动态创建的分组",
HeaderTitlePosition = GroupBoxTitlePosition.Center,
HeaderFontWeight = FontWeight.Bold,
Content = new TextBlock { Text = "这是动态创建的内容" }
};
parentPanel.Children.Add(groupBox);
```
### 动态修改属性
```csharp
// 修改标题位置
groupBox.HeaderTitlePosition = GroupBoxTitlePosition.Right;
// 修改标题颜色
groupBox.HeaderTitleColor = new SolidColorBrush(Colors.Coral);
// 修改标题文本
groupBox.HeaderTitle = "新标题";
// 修改字体样式
groupBox.HeaderFontStyle = FontStyle.Italic;
groupBox.HeaderFontWeight = FontWeight.SemiBold;
```
### 数据绑定
```xml
```
---
## 常见组合模式
### 表单分组
```xml
```
### 配置面板
```xml
```
### 禁用状态
```xml
这些设置当前不可修改
```