WPF列表按大小降序排列

Question

我需要向最终用户显示一份建议列表。希望列表中的第1项最易于阅读，第2项稍小，第3项甚至更小。

• 索引为0的项目必须很大，所有文本都是黑色的
• 索引为1的项目必须略小，所有文本基本上是黑色的，但其中夹杂着一些灰色
• 索引为2或更高的项目必须很小，所有文本都带有灰色

示例

我正在使用WPF，但尚未找到实现此目标的方法。

目前我的代码如下：

<ListView ItemsSource="{Binding MyList}" Height="auto" ScrollViewer.VerticalScrollBarVisibility="Disabled" Background="Transparent">
<ListView.ItemTemplate>
    <DataTemplate>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="75"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <Label Grid.Column="0" Content="{Binding SomeText}"/>
            <Label Grid.Column="1" Content="{Binding MoreText}"/>
        </Grid>
    </DataTemplate>
</ListView.ItemTemplate>

这只生成一个平面列表，其中每个元素大小相同。

我一直在研究AlternationCount + ItemsControl.AlternationIndex，但那些会交替出现，这不是我想要的，我想要一个特殊的第1行和第2行，其余行都相同。

编辑解决方案 感谢@Adrian Faciu提供的解决方案。

它看起来像这样：

<ItemsControl ItemsSource="{Binding MyList}" AlternationCount="1000" ScrollViewer.VerticalScrollBarVisibility="Disabled" Background="Transparent">
<ItemsControl.Resources>
    <Style TargetType="{x:Type Label}">
        <Setter Property="Foreground" Value="Red"></Setter>
        <Style.Triggers>
            <DataTrigger Binding="{Binding Path=(ItemsControl.AlternationIndex), RelativeSource={RelativeSource TemplatedParent}}" Value="0">
                <Setter Property="Foreground" Value="Green"></Setter>
                <Setter Property="FontSize" Value="20" />
            </DataTrigger>
            <DataTrigger Binding="{Binding Path=(ItemsControl.AlternationIndex), RelativeSource={RelativeSource TemplatedParent}}" Value="1">
                <Setter Property="Foreground" Value="Yellow"></Setter>
                <Setter Property="FontSize" Value="15" />
            </DataTrigger>
        </Style.Triggers>
    </Style>
</ItemsControl.Resources>
<ItemsControl.ItemTemplate>
    <DataTemplate>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="75"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <Label Grid.Column="0" Content="{Binding MyText}"/>
            <Label Grid.Column="1" Content="{Binding AnotherText}"/>
        </Grid>
    </DataTemplate>
</ItemsControl.ItemTemplate>

- Mr. Java Wolf

Answer 1

您正在正确的轨道上。您可以将AlternationCount绑定到您的集合长度，然后为默认项创建样式，以及为第一行更改样式：

<Style x:Key="differentItemsStyle" TargetType="{x:Type Label}">
    <Setter Property="Foreground" Value="Red"></Setter>
    <Style.Triggers>
        <DataTrigger Binding="{Binding Path=(ItemsControl.AlternationIndex), RelativeSource={RelativeSource TemplatedParent}}" Value="0">
            <Setter Property="Foreground" Value="Green"></Setter>
        </DataTrigger>
        <DataTrigger Binding="{Binding Path=(ItemsControl.AlternationIndex), RelativeSource={RelativeSource TemplatedParent}}" Value="1">
            <Setter Property="Foreground" Value="Yellow"></Setter>
        </DataTrigger>
    </Style.Triggers>
</Style>

在您的示例中，Option C、D、E 会有一个默认样式，您可以根据需要覆盖 Option A 和 Option B 的样式。

编辑 为了使 ListBox 正常工作，需要更改绑定：

<DataTrigger Binding="{Binding Path=(ItemsControl.AlternationIndex), RelativeSource={RelativeSource AncestorType=ListBoxItem}}" Value="1">
     <Setter Property="Foreground" Value="Yellow"></Setter>
</DataTrigger>

请参阅 这个答案 了解更多信息。

- Adrian Fâciu

---

我无法让它工作。它们全部都是绿色的（就像它们全部都是AlternationIndex = 0）。我已将Listview设置为AlternationCount="1000"。 - Mr. JWolf

看起来AlternationIndex和ListView有问题。请参见此处：https://dev59.com/Q3jZa4cB1Zd3GeqPbDSx - Adrian Fâciu

使用链接，并使用 ItemsController 替代 listview 起作用了！：） - Mr. JWolf

Answer 2

我认为你可以给你的类添加一个属性，并将其与标签的字体大小绑定。

Xaml：

  <ListView ItemsSource="{Binding MyList}" Height="auto" ScrollViewer.VerticalScrollBarVisibility="Disabled" Background="Transparent">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="75"/>
                        </Grid.ColumnDefinitions>
                        <Label Grid.Column="0" FontSize="{Binding FontSize}" Foreground="{Binding Foreground}" Content="{Binding Name}"/>
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

视图模型：

  MyList = new List<ListItems>();
        MyList.Add(new ListItems() { Name = "Option A", FontSize = 20, Foreground = Brushes.Black });
        MyList.Add(new ListItems() { Name = "Option B", FontSize = 15, Foreground = Brushes.Black });
        MyList.Add(new ListItems() { Name = "Option C", FontSize = 8, Foreground = Brushes.Gray });
        MyList.Add(new ListItems() { Name = "Option D", FontSize = 8, Foreground = Brushes.Gray });
        MyList.Add(new ListItems() { Name = "Option E", FontSize = 8, Foreground = Brushes.Gray });

- Justin CI