如何将CheckBox与其内容对齐?

问题描述 投票:35回答:7

WPF CheckBox的外观使检查部分与标签(内容)部分不对齐。支票略高于内容,如下所示:

XAML看起来像这样:

<CheckBox Content="Poorly aligned CheckBox" Margin="9"/>

CheckBox位于Grid单元格内。是否有一种简单的方法来制作内容并检查XAML CheckBox的部分垂直对齐?我尝试了各种属性组合而没有运气。我看到a similar question here,但答案太复杂了。

提前致谢。

编辑:问题是由我设置为14的Window FontSize引起的。要重新创建问题,请将CheckBox FontSize设置为14(或更多)。我的程序是由工厂工人远程查看的,因此我允许用户增加或减少Window FontSize。

wpf silverlight xaml checkbox alignment
7个回答
22
投票

编辑 - 新答案:(以前不好)

不是我相信的最好的方式,但可以做的工作:

<CheckBox>
    <TextBlock Text="Poorly aligned CheckBox" Margin="0,-2,0,0"/>
</CheckBox>

使用负边距推送内容,结果:


48
投票

我知道为时已晚,但这是一个更好的解决方案,没有设置利润。对于TextBlockCheckbox的不同高度,边距应设置不同。

<CheckBox VerticalAlignment="Center" VerticalContentAlignment="Center">
    <TextBlock Text="Well aligned Checkbox" VerticalAlignment="Center" />
</CheckBox>

更新:

值得查看下面的@nmarler评论。


15
投票

CheckBox的默认样式在WPF中看起来不像。它在XP和Windows 7中完美对齐。您能否更好地描述如何重现此问题?

我能想到的两件事来获得你所看到的偏移是改变PaddingVerticalContentAlignmentCheckBox的默认VerticalContentAlignment值是Top,而CheckBoxContentPadding设置为"4,0,0,0"。尝试改变这两个,看看它是否有任何区别。

这是一个比较

来自以下Xaml

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <CheckBox Grid.Row="0"
              Content="Poorly aligned CheckBox" Margin="9" />
    <CheckBox Grid.Row="1"
              Content="Padding=4,4,0,0" Margin="9" Padding="4,4,0,0"/>
    <CheckBox Grid.Row="2"
              Content="Vertical Center" Margin="9"
              VerticalContentAlignment="Center"/>
    <CheckBox Grid.Row="3"
              Content="Vertical Top" Margin="9"
              VerticalContentAlignment="Top"/>
</Grid>

3
投票

有一个简单的解决方案,无需为内容制作文本框。只需使用:

<CheckBox Content="Sample of Text" VerticalContentAlignment="Center"/>

2
投票

将一个空的CheckBox和内容作为单独的控件放在具有水平方向的StackPanel中。这适用于任何字体大小。

<StackPanel Orientation="Horizontal">
    <CheckBox VerticalAlignment="Center" />
    <TextBlock VerticalAlignment="Center" Text="Option X" />
</StackPanel />

1
投票

应用负顶部填充适用于我的布局:

<CheckBox Content="Poorly aligned CheckBox" Padding="4,-3,0,0" Margin="9"/>

0
投票

我的复选框很好,所以我想知道你的复选框有什么不同。唯一明显的区别是你使用的字体比我大,这让我想起了以下问题:

WPF CheckBox style with the TextWrapping

您的问题可能是,如果内容是文本块,则复选框是顶部对齐的,当字体大小增加时,这可能看起来很奇怪。所以我的猜测是,尝试使用AccessText作为CheckBox的内容:

<CheckBox Margin="9"><AccessText>Better aligned CheckBox?</AccessText></CheckBox>
© www.soinside.com 2019 - 2024. All rights reserved.