Как центрировать WPF CheckBox в ListBoxItem

Question

У меня есть ListBox, который использует ItemContainerStyle. Я перепробовал все, что мог, чтобы элемент управления CheckBox центрировался по вертикали и горизонтали. Есть идеи?

<ListBox
  IsSynchronizedWithCurrentItem="True" 
  Height="Auto" Width="Auto" DockPanel.Dock="Top"
  ItemContainerStyle="{StaticResource lbcStyle}" />

<Style TargetType="ListBoxItem" x:Key="lbcStyle">
    <Style.Triggers>
        <Trigger Property="IsSelected" Value="True">
          <Setter Property="ContentTemplate" Value="{StaticResource editable}"/>
        </Trigger>
    </Style.Triggers>
    <Setter Property="ContentTemplate" Value="{StaticResource nonEditable}"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/> '//i have tried stretch here also
    <Setter Property="VerticalContentAlignment" Value="Stretch"/>
</Style>

Флажки получают этот стиль:

<Style x:Key="editorCheckBox" TargetType="{x:Type CheckBox}">
    <Setter Property="MinWidth" Value="67" />
    <Setter Property="Height" Value="25" />
    <Setter Property="Margin" Value="5,0,5,0" />
    <Setter Property="VerticalAlignment" Value="Center" />
    <Setter Property="HorizontalAlignment" Value="Center" />
</Style>

Вот редактируемые / не редактируемые:

<DataTemplate x:Key="editable">
              <Border x:Name="brdEditable" Width="Auto" HorizontalAlignment="Stretch">
                <DockPanel x:Name="dpdEditable" LastChildFill="True" Width="Auto" Height="Auto">
                  <Grid x:Name="grdEditable" Width="Auto" Height="Auto">
                    <Grid.ColumnDefinitions>
                      <ColumnDefinition Width="25" />
                      <ColumnDefinition Width="25" />
                      <ColumnDefinition Width="100" />
                      <ColumnDefinition Width="100" />
                      <ColumnDefinition Width="80" />
                      <ColumnDefinition Width="110" />
                      <ColumnDefinition Width="110" />
                      <ColumnDefinition Width="60" />
                      <ColumnDefinition Width="90" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                      <RowDefinition></RowDefinition>
                      <RowDefinition></RowDefinition>
                    </Grid.RowDefinitions>
                    '...
                    <CheckBox x:Name="chkActive" Grid.Column="7" Height="25" Style="{StaticResource editorCheckBox}" ToolTip="Is Construction Active?" IsEnabled="true" Validation.ErrorTemplate="{StaticResource validationTemplate}">
                      <CheckBox.IsChecked>
                        <Binding Path="Active">
                          <Binding.ValidationRules>
                            <DataErrorValidationRule></DataErrorValidationRule>
                            <ExceptionValidationRule></ExceptionValidationRule>
                          </Binding.ValidationRules>
                        </Binding>
                      </CheckBox.IsChecked>
                    </CheckBox>
                    '...
                    <ContentControl Name="ExpanderContent" Visibility="Collapsed" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="14"></ContentControl>
              </Grid>
            </DockPanel>
          </Border>
        </DataTemplate>



 <DataTemplate x:Key="nonEditable">
      <Border x:Name="brdNonEditable" Width="Auto" HorizontalAlignment="Stretch">
        <DockPanel Width="Auto" Height="25">
          <Grid Width="Auto" Height="25">
            <Grid.ColumnDefinitions>
              <ColumnDefinition Width="25" />
              <ColumnDefinition Width="25" />
              <ColumnDefinition Width="100" />
              <ColumnDefinition Width="100" />
              <ColumnDefinition Width="80" />
              <ColumnDefinition Width="110" />
              <ColumnDefinition Width="110" />
              <ColumnDefinition Width="60" />
              <ColumnDefinition Width="90" />
            </Grid.ColumnDefinitions>
            <CheckBox x:Name="chkActive" Grid.Column="7" Height="25" Style="{StaticResource editorCheckBox}" ToolTip="Is Construction Active?" IsEnabled="false" Validation.ErrorTemplate="{StaticResource validationTemplate}">
              <CheckBox.IsChecked>
                <Binding Path="Active">
                  <Binding.ValidationRules>
                    <DataErrorValidationRule></DataErrorValidationRule>
                    <ExceptionValidationRule></ExceptionValidationRule>
                  </Binding.ValidationRules>
                </Binding>
              </CheckBox.IsChecked>
            </CheckBox>
            <Label Content="calCompDate" Style="{StaticResource editorLabelList}" Grid.Column="8" ToolTip="{Binding Path= CompDate}" />
          </Grid>
        </DockPanel>
      </Border>
    </DataTemplate>

И большое спасибо всем, кто пытался помочь мне решить эту проблему!

Answer 1

Попробуйте установить для свойства ScrollViewer.HorizontalScrollBarVisibility значение "Disabled" в ListBox. Это заставляет контейнеры предметов иметь фиксированную ширину; в противном случае они могут иметь любой горизонтальный размер, и горизонтальное выравнивание не может быть разумно рассчитано.

Вертикальное выравнивание должно быть вопросом изменения стиля ListBoxItem, согласно ответу Доннелле.

Редактировать: в ваших фрагментах кода CheckBox находится внутри Grid, которая находится внутри DockPanel, которая находится внутри Border. Какой элемент вы пытаетесь центрировать точно? Вы уверены, что остальные не мешают? Вот как это выглядит для меня с моим предложением и HorizontalContentAlignment = "Center" и только флажком в шаблоне данных:

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

Answer 2

Флажок выровнен по левому верхнему углу. Для быстрого и грязного я обновил поле на флажке до 4,3,0,0 при высоте строки 20. Может потребоваться корректировка в зависимости от вашей высоты строки и от того, нужен ли вам буфер слева. Атрибут margin может вывести вас из странного формата, если у вас нет времени написать собственный шаблон или использовать другие элементы управления / контейнеры.

Answer 3

Вы пытались установить HorizontalContentAlignment в значение «Растянуть» в самом ListBox? Я считаю, что это необходимо, чтобы каждый ListBoxItem заполнял ширину ListBox.

Answer 4

Установка высоты в стиле ListBoxItem - вместо флажка - делает то, что, я думаю, вам нужно.

Answer 5

У меня была такая же проблема. Вы пытались установить «Горизонтальное выравнивание» непосредственно в ListBoxItem в стиле? (не HorizontalContentAlignment)