控件 Border 在另一个元素周围绘制边框、背景或两者。 用于 Border 围绕内容创建视觉框架或添加 UI 元素之间的间距。
| Title | Description |
|---|---|
| 对 BorderThickness 值进行动画处理 | 演示如何对边框的粗细进行动画处理，以创建动态视觉效果。 |
| 在画布内容周围环绕边框 | 演示如何使用边框控件来框架画布内容。 |
样式和模板
控件 Border 继承自 Decorator 控件，并通过其边框和背景属性提供视觉样式功能。
Content 属性
此控件的内容属性为 Child. 此属性允许将单个子元素放置在边框内。
部件
此控件不定义任何模板部件。
视觉状态
此控件不使用视觉状态。
重要概念
了解 BORDER 在 WPF 布局系统中的工作原理有助于创建有效的视觉设计。
边框作为修饰符
控件 Border 是一个 Decorator，这意味着它只能包含一个子元素。 如果需要将多个元素放在边框内，请将它们包装在面板上，例如 StackPanel 或 Grid。
边框属性
边框提供了多个用于视觉自定义的关键属性：
- BorderBrush - 设置边框线的颜色或图案。
- BorderThickness - 定义边框在每一侧的厚度。
- Background - 用颜色或图案填充边框内的区域。
- CornerRadius - 为更柔和的外观创建圆角。
- Padding - 在边框及其子内容之间添加空间。
布局注意事项
边框通过测量和排列其单个子元素来参与 WPF 布局系统。 边框的粗细和填充会影响最终大小计算，因此在设计布局时请考虑这些值。
例子
以下示例演示了常见的边框使用方案。
基本边框用法
以下 XAML 在 TextBox 周围创建一个简单的边框：
<Border BorderBrush="Black" BorderThickness="2" CornerRadius="5" Padding="5">
<TextBox Text="Enter text here" />
</Border>
使用画笔进行造型
可以使用渐变和其他画笔创建更复杂的边框效果：
<Border BorderThickness="3" CornerRadius="10" Padding="10">
<Border.BorderBrush>
<LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
<GradientStop Color="Blue" Offset="0" />
<GradientStop Color="LightBlue" Offset="1" />
</LinearGradientBrush>
</Border.BorderBrush>
<Border.Background>
<SolidColorBrush Color="LightGray" />
</Border.Background>
<TextBlock Text="Styled content" />
</Border>
包含多个元素
由于 Border 只能包含一个子元素，因此使用面板对多个元素进行分组：
<Border BorderBrush="Gray" BorderThickness="1" CornerRadius="3" Padding="8">
<StackPanel>
<TextBlock Text="Title" FontWeight="Bold" />
<TextBlock Text="Description text goes here." />
<Button Content="Action" />
</StackPanel>
</Border>
