WPF中复选框左侧的文字?

Iva*_*ric 54 .net wpf checkbox user-interface

将复选框内容(文本)放在复选框本身左侧的最简单方法是什么?

nmc*_*ean 87

最大化"简单"和"正确性"的解决方案是创建一个RightToLeft包含LeftToRight内容的复选框:

<CheckBox FlowDirection="RightToLeft">
    <TextBlock FlowDirection="LeftToRight" Text="CheckBox Content:" />
</CheckBox>
Run Code Online (Sandbox Code Playgroud)

或者如果你喜欢一种风格:

<Style TargetType="CheckBox">
    <Setter Property="FlowDirection" Value="RightToLeft" />
    <Setter Property="ContentTemplate">
        <Setter.Value>
            <DataTemplate>
                <ContentControl FlowDirection="LeftToRight" Content="{Binding}" />
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>
Run Code Online (Sandbox Code Playgroud)

  • 无论出于何种原因,这也会翻转复选标记符号(*note:*.NET 4.5),这使得此解决方案无效.最好的办法是编辑原始样式的副本并自定义模板来处理这个问题. (20认同)

Iva*_*ric 30

在代码中:

System.Windows.Controls.CheckBox checkBox = new System.Windows.Controls.CheckBox();
checkBox.Content = ":CheckBox Enabled";
checkBox.FlowDirection = System.Windows.FlowDirection.RightToLeft;
Run Code Online (Sandbox Code Playgroud)

在XAML中:

<CheckBox FlowDirection="RightToLeft" Content=":CheckBox Enabled" />
Run Code Online (Sandbox Code Playgroud)

编辑

用户punker76帮我注意到,冒号":"必须是地方文的正确显示,在年底("复选框启用"),可能是一个影响流动方向引起了文本元素上.很好的抓住.

  • 这有一个问题:你的刻度线水平翻转,至少在实现为笔划数组时.发生这种情况是因为构成CheckBox的所有组件都继承了FlowDirection属性.这里解释了解决方案:[link](http://stackoverflow.com/questions/20911471/wpf-button-icon-gets-mirrored-why/20912496#20912496) (4认同)

pun*_*r76 17

另一种方法是制作新的自定义样式

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:Microsoft_Windows_Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <SolidColorBrush Color="#F4F4F4"
                   x:Key="CheckBoxFillNormal" />
  <SolidColorBrush Color="#8E8F8F"
                   x:Key="CheckBoxStroke" />
  <Style x:Key="EmptyCheckBoxFocusVisual">
    <Setter Property="Control.Template">
      <Setter.Value>
        <ControlTemplate>
          <Rectangle Margin="1"
                     SnapsToDevicePixels="true"
                     Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"
                     StrokeDashArray="1 2"
                     StrokeThickness="1" />
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>
  <Style x:Key="CheckRadioFocusVisual">
    <Setter Property="Control.Template">
      <Setter.Value>
        <ControlTemplate>
          <Rectangle Margin="14,0,0,0"
                     SnapsToDevicePixels="true"
                     Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"
                     StrokeDashArray="1 2"
                     StrokeThickness="1" />
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>
  <Style TargetType="{x:Type CheckBox}"
         x:Key="ContentLeftCheckBoxStyle">
    <Setter Property="Foreground"
            Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
    <Setter Property="Background"
            Value="{StaticResource CheckBoxFillNormal}" />
    <Setter Property="BorderBrush"
            Value="{StaticResource CheckBoxStroke}" />
    <Setter Property="BorderThickness"
            Value="1" />
    <Setter Property="FocusVisualStyle"
            Value="{StaticResource EmptyCheckBoxFocusVisual}" />
    <Setter Property="VerticalContentAlignment"
            Value="Center" />
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type CheckBox}">
          <StackPanel Orientation="Horizontal">
            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                              Margin="{TemplateBinding Padding}"
                              RecognizesAccessKey="True"
                              SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
            <BulletDecorator Background="Transparent"
                             SnapsToDevicePixels="true"
                             VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
              <BulletDecorator.Bullet>
                <Microsoft_Windows_Themes:BulletChrome Background="{TemplateBinding Background}"
                                                       BorderBrush="{TemplateBinding BorderBrush}"
                                                       IsChecked="{TemplateBinding IsChecked}"
                                                       RenderMouseOver="{TemplateBinding IsMouseOver}"
                                                       RenderPressed="{TemplateBinding IsPressed}" />
              </BulletDecorator.Bullet>
            </BulletDecorator>
          </StackPanel>
          <ControlTemplate.Triggers>
            <Trigger Property="HasContent"
                     Value="true">
              <Setter Property="FocusVisualStyle"
                      Value="{StaticResource CheckRadioFocusVisual}" />
              <Setter Property="Padding"
                      Value="0,0,4,0" />
            </Trigger>
            <Trigger Property="IsEnabled"
                     Value="false">
              <Setter Property="Foreground"
                      Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
            </Trigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>
</ResourceDictionary>
Run Code Online (Sandbox Code Playgroud)

用法:

<CheckBox Style="{StaticResource ContentLeftCheckBoxStyle}" Content="CheckBox:" />
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述

希望有所帮助!

  • 这个答案应该真的标记为正确.它做了所有正确的事情,并且没有翻转的复选标记和反向文本的问题.主张使用FlowDirection的答案对于字符顺序和非对称检查标记不一致. (12认同)
  • 我想我们都知道这个答案,我们知道这是解决这个问题的正确方法,但"最简单"的方法就是改变流向.:) (3认同)

小智 15

另一种解决方法是,在定义全新的CheckBox样式时,为了避免上面讨论的流向和大量代码的细微问题,只需使用包含Label(带有所需的CheckBox内容字符串)和CheckBox的WrapPanel(没有)内容字符串).

<WrapPanel>
    <Label Content="Checkbox content"/>
    <CheckBox VerticalAlignment="Center" Margin="5,0,0,0"/>
</WrapPanel>
Run Code Online (Sandbox Code Playgroud)

  • 这既简单又容易,但是您失去了单击文本以选中某些其他解决方案为您提供的复选框的能力。 (2认同)

小智 13

我花了两个小时,但我找到了最好的决定

<Style x:Key="TextAlignLeft" TargetType="CheckBox">
    <Style.Resources>
        <Style TargetType="Path">
            <Setter Property="FlowDirection" Value="LeftToRight" />
        </Style>
        <Style TargetType="TextBlock">
            <Setter Property="FlowDirection" Value="LeftToRight" />
        </Style>
    </Style.Resources>

    <Setter Property="FlowDirection" Value="RightToLeft" />
</Style>
Run Code Online (Sandbox Code Playgroud)


Aks*_*tha 9

我知道已经有一段时间了,我迟到了.但经过几个复杂的答案并在互联网上搜索了很多,我终于找到了最简单的方法来实现这一点,而不会扭曲这里的勾号.

<CheckBox Content="Checked" FlowDirection="RightToLeft">
    <CheckBox.Resources>
        <Style TargetType="{x:Type Path}">
            <Setter Property="FlowDirection" Value="LeftToRight" />
        </Style>
    </CheckBox.Resources>
</CheckBox>
Run Code Online (Sandbox Code Playgroud)

结果:

在此输入图像描述


Joh*_*ohn 5

最简单的方法是使用堆栈面板:

            <StackPanel Orientation="Horizontal">
                <TextBlock Text="Some Text"/>
                <CheckBox  />
            </StackPanel>
Run Code Online (Sandbox Code Playgroud)

  • 我想如果您不介意在单击文本时失去选中/取消选中的能力,那么这是可以的 (3认同)
  • 事件处理程序可以处理这个问题 (3认同)