Как я могу выровнять CheckBox с его содержимым? - PullRequest
Новая
       31

Как я могу выровнять CheckBox с его содержимым?

36 голосов
/ 29 августа 2011

Внешний вид WPF CheckBox смещает часть чека с частью метки (содержимого).Проверка остается немного выше содержимого, как показано здесь:

enter image description here

XAML выглядит следующим образом: 

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

CheckBox находится внутри ячейки Grid. Существует ли простой способ сделать так, чтобы содержимое и элементы проверки XAML CheckBox выравнивались по вертикали? Я пробовал различные комбинации свойств, но безуспешно.Я видел подобный вопрос здесь , но ответ слишком сложен.

Заранее спасибо.

РЕДАКТИРОВАТЬ: проблема была вызвана Window FontSize, которыйЯ установил 14 .Чтобы воссоздать проблему, установите CheckBox FontSize в 14 (или больше).Работники фабрики на расстоянии видят мою программу, поэтому я позволяю пользователю увеличивать или уменьшать размер окна.

Ответы [ 7 ]

49 голосов
/ 24 сентября 2013

Я знаю, что уже слишком поздно, но здесь есть лучшее решение без установки полей.Поля должны быть установлены по-разному для различных высот TextBlock или Checkbox. 

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

Обновление:

Стоит проверить комментарий @ nmarler ниже.

22 голосов
/ 29 августа 2011

Редактировать - Новый ответ: (предыдущий не годился)

Не самый лучший способ, которым я верю, но могу сделать работу: 

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

Использование отрицательного поля для увеличения содержимого, результат: enter image description here

15 голосов
/ 29 августа 2011

Стиль по умолчанию для CheckBox не похож на этот в WPF. Он идеально совместим как в XP, так и в Windows 7. Можете ли вы дать лучшее описание того, как воспроизвести эту проблему?

Две вещи, о которых я могу подумать, чтобы получить смещение, которое вы видите, это либо изменение Padding, либо VerticalContentAlignment. Значение CheckBox по умолчанию для VerticalContentAlignment равно Top, а CheckBox с Content имеет Padding, установленное на "4,0,0,0". Попытайтесь изменить эти два и посмотрите, будет ли это иметь какое-либо значение.

Вот сравнение

enter image description here

Из следующего 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>
4 голосов
/ 04 октября 2018

Для этого есть простое решение без необходимости создания текстового блока для содержимого и без написания дополнительного кода, который вам не нужен. Просто используйте «VerticalContentAlignment». Пример: 

<CheckBox Content="Sample of Text" VerticalContentAlignment="Center"/>
2 голосов
/ 07 сентября 2013

Поместите пустой CheckBox и содержимое как отдельные элементы управления в StackPanel с горизонтальной ориентацией.Это работает с любым размером шрифта. 

<StackPanel Orientation="Horizontal">
    <CheckBox VerticalAlignment="Center" />
    <TextBlock VerticalAlignment="Center" Text="Option X" />
</StackPanel />
1 голос
/ 28 июня 2016

Применение отрицательного верхнего отступа отлично подходит для моего макета: 

<CheckBox Content="Poorly aligned CheckBox" Padding="4,-3,0,0" Margin="9"/>
0 голосов
/ 29 августа 2011

Мои флажки выровнены нормально, так что мне интересно, что отличается от вашего.Единственное очевидное отличие состоит в том, что вы используете более крупный шрифт, чем у меня, что напоминает мне следующий вопрос:

Стиль флажка WPF с TextWrapping

Ваша проблема можетбудь то, если содержимое представляет собой текстовый блок, флажок выравнивается по верхнему краю, что может выглядеть странно при увеличении размера шрифта.Так что я думаю, попробуйте использовать AccessText в качестве содержимого CheckBox вместо: 

<CheckBox Margin="9"><AccessText>Better aligned CheckBox?</AccessText></CheckBox>
...