Question

我有一个使用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>

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

Answer 1

尝试在ListBox上将ScrollViewer.HorizontalScrollBarVisibility属性设置为"Disabled"。这迫使物品容器具有固定的宽度;否则，它们可以有任何水平尺寸，并且不能合理地计算水平对齐。

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

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

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

Answer 2

我遇到了同样的问题。您是否尝试直接在样式中的ListBoxItem上设置“HorizontalAlignment”？（不是HorizontalContentAlignment）

Answer 3

您是否尝试在ListBox本身上将HorizontalContentAlignment设置为“Stretch”？我相信这是必要的，以使每个ListBoxItem填充ListBox的宽度。

Answer 4

设置ListBoxItem样式的高度 - 而不是复选框 - 做我认为你想要的。

Answer 5

复选框左上角对齐。为了快速和肮脏，我已经将复选框上的边距更新为行高度为20的4,3,0,0。可能需要根据行高度调整，如果你想要左边的缓冲区。如果您没有时间编写自己的模板或使用其他控件/容器，margin属性可以让您摆脱奇怪的格式。

如何在ListBoxItem中居中WPF CheckBox

5 个答案: