Question

我的WPF中的ListBox有问题。首先，我有一个带有自定义ItemTemplate的水平ListBox。现在，我想拉伸项目，以便项目适合ListBox的整个宽度。我尝试过将HorizontalContentAlignment设置为Stretch，但这仍然无效。

这是我的 ItemTemplate ：

<DataTemplate x:Key="ListViewStepTemplate">
    <Grid VerticalAlignment="Stretch">
        <TextBlock Text="{Binding Path=Title}" 
                   FontSize="15"
                   HorizontalAlignment="Center" 
                   VerticalAlignment="Center" />

        <Image Height="16" 
               Width="16"
               HorizontalAlignment="Right"
               VerticalAlignment="Bottom"
               Source="/images/Content/check_16x16.png"
               Visibility="{Binding Path=IsDone, Converter={StaticResource BooleantoVisibilityConverter}, UpdateSourceTrigger=PropertyChanged}" />
    </Grid>
</DataTemplate>

这是我的 ListBox ：

<ListBox DockPanel.Dock="Top" 
         ItemsSource="{Binding AllItemsList}" 
         SelectedItem="{Binding CurrentItem}" 
         ItemTemplate="{StaticResource ListViewStepTemplate}" 
         Height="60" 
         HorizontalContentAlignment="Stretch">

    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal" />
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>

    <ListBox.ItemContainerStyle>
        <Style TargetType="{x:Type ListBoxItem}">
            <Setter Property="IsEnabled" Value="{Binding IsEnabled, UpdateSourceTrigger=PropertyChanged}" />
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            <Setter Property="Padding" Value="30 0" />
        </Style>
    </ListBox.ItemContainerStyle>
</ListBox>

如果有4个项目，则每个项目的宽度应为25％。如果有5个项目，则每个项目的宽度应为20％，依此类推。

有可能做我想做的事吗？我现在尝试了很多东西，但它确实无法运作。

Answer 1

而不是使用StackPanel使用UniformGrid

提供一种在网格中排列内容的方法，其中网格中的所有单元格具有相同的大小。

并将列数绑定到列表中的项目数，并禁用水平滚动功能。

<ListBox 
   ...
   ItemsSource="{Binding AllItemsList}" 
   ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
   ScrollViewer.VerticalScrollBarVisibility="Disabled" >
   <ListBox.ItemsPanel>
      <ItemsPanelTemplate>
         <UniformGrid Rows="1" Columns="{Binding AllItemsList.Count}"/>
      </ItemsPanelTemplate>
   </ListBox.ItemsPanel>
   <ListBox.ItemContainerStyle>
      <Style TargetType="{x:Type ListBoxItem}">
         <!-- style -->
      </Style>
   </ListBox.ItemContainerStyle>
</ListBox>

Answer 2

请勿使用StackPanel，而是使用UniformGrid。

<ItemsPanelTemplate>
    <UniformGrid Rows="1" Columns="{Binding DataContext.Count, RelativeSource={RelativeSource Self}}"/>
</ItemsPanelTemplate>

水平ListBox项目拉伸

2 个答案: