C# Avalonia 06 - Controls- GroupBox

关于如何把自定义控件加入到默认命名空间，请看之前的例子（https://www.cnblogs.com/dalgleish/p/18978564），之后不再强调，如果看不懂，那请从第一个例子开始学习。

C# Avalonia，没有内置GroupBox，但我们可以通过Style样式实现（xaml），此处用C#代码直接实现。留了一个坑，当Header为空时，边框是无法闭合的，提示，headerBorder可以通过绑定IsVisibleProperty来实现。作为小作业吧。

GroupBox类代码，加入到ControlExtensions.cs了。

    public class GroupBox : HeaderedContentControl
    {
        static GroupBox()
        {
            // 重写默认模板
            TemplateProperty.OverrideDefaultValue<GroupBox>(CreateControlTemplate());
        }

        // 创建控件模板
        private static IControlTemplate CreateControlTemplate()
        {
            return new FuncControlTemplate<GroupBox>((control, scope) =>
            {
                // 创建一个 Grid，包含两行两列
                var grid = new Grid
                {
                    RowDefinitions = new RowDefinitions("Auto,*"),    // 标题行 + 内容行
                    ColumnDefinitions = new ColumnDefinitions("Auto,*")
                };

                // 包裹标题的边框
                var headerBorder = new Border
                {
                    ZIndex = 1,
                    Background = Brushes.White,                   // 标题背景色
                    Padding = new Thickness(5, 0, 5, 0),
                    Margin = new Thickness(5, 0, 0, 0),
                    Child = new TextBlock
                    {
                        [!TextBlock.TextProperty] = control[!HeaderedContentControl.HeaderProperty], // TemplateBinding绑定 Header 属性
                        FontWeight = FontWeight.Bold
                    }
                };
                
                // 内容的边框容器
                var contentBorder = new Border
                {
                    ZIndex = 0,
                    Padding = new Thickness(0, 5, 0, 0),
                    Margin = new Thickness(0, 10, 0, 0),
                    CornerRadius = new CornerRadius(4),           // 圆角边框
                    BorderBrush = Brushes.Gray,                   // 边框颜色
                    BorderThickness = new Thickness(1),
                    Child = new ContentPresenter
                    {
                        Name = "PART_ContentPresenter",               // 命名为 PART_ContentPresenter，供模板识别
                        Padding = new Thickness(8),
                        [!ContentPresenter.ContentProperty] = control[!ContentControl.ContentProperty]
                    }
                };

                // 设置行列跨度
                Grid.SetRowSpan(contentBorder, 2);
                Grid.SetColumnSpan(contentBorder, 2);

                // 添加控件到 Grid 中（顺序重要）
                grid.Children.Add(contentBorder);
                grid.Children.Add(headerBorder);  

                return grid;
            });
        }
    }

RadioButtonGroups.axaml代码

<Window xmlns="https://github.com/avaloniaui"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        Height="300" Width="300"
        x:Class="AvaloniaUI.RadioButtonGroups"
        Title="RadioButtonGroups">
    <!--https://docs.avaloniaui.net/docs/tutorials/groupbox-->
    <StackPanel>
        <GroupBox Margin="5" Header="Header 1">
            <StackPanel Spacing="5">
                <RadioButton>Group 1</RadioButton>
                <RadioButton>Group 1</RadioButton>
                <RadioButton>Group 1</RadioButton>
                <RadioButton Margin="0,5,0,0" GroupName="Group2">Group 2</RadioButton>
            </StackPanel>
        </GroupBox>

        <GroupBox Margin="5" Header="Header 2">
            <StackPanel Spacing="5">
                <RadioButton>Group 3</RadioButton>
                <RadioButton>Group 3</RadioButton>
                <RadioButton>Group 3</RadioButton>
                <RadioButton Margin="0,5,0,0" GroupName="Group2">Group 2</RadioButton>
            </StackPanel>
        </GroupBox>
    </StackPanel>
</Window>

RadioButtonGroups.axaml.cs代码

using Avalonia;
using Avalonia.Controls;
using Avalonia.Markup.Xaml;

namespace AvaloniaUI;

public partial class RadioButtonGroups : Window
{
    public RadioButtonGroups()
    {
        InitializeComponent();
        
    }
}

运行效果