在 C# WPF 窗口中带有一条线和一个标签的水平分隔符答案

【问题标题】：Horizontal separator with a line and a label in C# WPF window在 C# WPF 窗口中带有一条线和一个标签的水平分隔符
【发布时间】：2018-07-19 12:25:50
【问题描述】：

在 C# WPF 窗口中，我可以使用什么控件来创建带有文本标签的分隔符，例如：

注意：我知道<separator/>（如对所谓的duplicate question 的回答），但我找不到如何为其添加文本标签。

【问题讨论】：

标签： c# wpf

【解决方案1】：

您可以简单地使用带有标签的边框作为子元素：

<Border>
    <Label Content="SomeText" />
</Border>

正确设置边框样式属性，可以得到一个不错的自定义分隔符。

我个人认为这个简单的任务不需要额外的控件或样式和其他东西。

【讨论】：

【解决方案2】：

<separator/> 不支持文本。因此，一些选项是，使用网格来分隔文本和分隔符，如下所示：

<Grid Height="15">
     <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
     </Grid.ColumnDefinitions>
     <TextBlock
        Grid.Column="0"
        HorizontalAlignment="Center"
        VerticalAlignment="Center"
        Margin="5 0"
        Text="Your text"/>
     <Separator
        Grid.Column="1"
        VerticalAlignment="Center"/>
  </Grid>

或者，编写自己的组件：

<Style TargetType="{x:Type local:TextSeparator}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:TextSeparator}">
                <Grid Height="{TemplateBinding Height}">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <TextBlock Grid.Column="0" 
                        VerticalAlignment="Center" Margin="5 0" 
                        Text="{TemplateBinding Header}"/>
                    <Separator Grid.Column="1" VerticalAlignment="Center"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

您的控制：

public class TextSeparator : Control
{
    public static DependencyProperty HeaderProperty =
        DependencyProperty.Register("Header",
        typeof(string), typeof(TextSeparator));

    public string Header
    {
        get { return (string)GetValue(HeaderProperty); }
        set { SetValue(HeaderProperty, value); }
    }
}

并使用它：

<local:TextSeparator Height="15" Header="Your Text"/>

【讨论】：

【解决方案3】：

我会使用一个组合框，然后将其设置为仅显示顶部边框

<GroupBox Header="Margins" BorderThickness="0,1,0,0">

【讨论】：

【解决方案4】：

试试这个，

    <DockPanel Height="25">
        <Label DockPanel.Dock="Left" Content="SomeText"/>
        <Separator/>
    </DockPanel>

【讨论】：

你知道为什么这似乎适用于DockPanel，但不适用于StackPanel（特别是水平StackPanel）？
@Sudsy1002 如果您未定义项目停靠位置，则无法在 DockPanel 中拉伸 StackPanel 中的项目 Dock 位置，它将被拉伸到整个 DockPanel。