如何在ListBoxItem中居中WPF CheckBox

2023年3月18日 368次阅读

我有一个使用ItemContainerStyle的ListBox.我已经尝试了我能想到的一切,让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>

CheckBoxes得到这种风格：

<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>

非常感谢所有试图帮助我解决这个问题的人！

最佳答案 尝试在ListBox上将ScrollViewer.Horizo​​ntalScrollBarVisibility属性设置为“Disabled”.这迫使物品容器具有固定的宽度;否则,它们可以具有任何水平尺寸,并且不能合理地计算水平对齐.

根据Donnelle的回答,垂直对齐应该是修改ListBoxItem样式的问题.

编辑：在您的代码片段中,CheckBox位于一个位于边框内的DockPanel内的网格内.您想要准确居中哪个元素？你确定其余的都没有干涉吗？以下是我的建议和Horizo​​ntalContentAlignment =“Center”的查找方式,以及数据模板中的复选框：

还有一个编辑：我完全按照您粘贴的片段中的方式复制/粘贴网格/停靠面板/边框,结果完全相同 – 项目水平居中.

点赞