WPF美化ItemsControl1:不同颜色间隔

首先我们有的是一个绑定好数据的ItemsControl

XML 复制代码
<ItemsControl ItemsSource="{Binding Starts}">
</ItemsControl>

运行后呢是朴素的将数据竖着排列

如果想要数据之间有间距,可以使用数据模板,将数据放到TextBlock中显示,这样就可以设置间距了

XML 复制代码
<ItemsControl ItemsSource="{Binding Starts}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Padding="5" Text="{Binding}"></TextBlock>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

如果还想要让数据隔一行显示不同背景就可以使用触发器来进行设置

XML 复制代码
<ItemsControl ItemsSource="{Binding Starts}" AlternationCount="2">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Border x:Name="border" Padding="5">
                <TextBlock Text="{Binding}"></TextBlock>
            </Border>

            <DataTemplate.Triggers>
                <Trigger Property="ItemsControl.AlternationIndex" Value="1">
                    <Setter TargetName="border" Property="Background" Value="lightgray"></Setter>
                </Trigger>
            </DataTemplate.Triggers>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

--- 重点是设置2个就是一个间隔

对于这个间隔的触发器是有很多种写法的:WPF触发器的多种写法-CSDN博客

相关推荐
军训猫猫头9 小时前
5.浏览本地文件获取路径与文件名称 C#例子 WPF例子
开发语言·c#·wpf
步、步、为营17 小时前
.NET + WPF框架开发聊天、网盘、信息发布、视频播放功能
.net·wpf·音视频
code bean1 天前
【WPF实战】MVVM中如何从数据模型反查自定义控件实例(ImageView + Halcon)
wpf
lph19721 天前
ValueConverter转换器WPF
wpf
Sally璐璐1 天前
Memcache核心技术解析与实战应用
运维·wpf·memcached
悟能不能悟2 天前
Dubbo跨越分布式事务的最终一致性陷阱
分布式·wpf·dubbo
I'mSQL2 天前
C#与FX5U进行Socket通信
运维·服务器·自动化·wpf
观无3 天前
关于wpf的自适应
wpf
时光追逐者3 天前
一款开源免费、通用的 WPF 主题控件包
开源·c#·.net·wpf
甜甜不吃芥末4 天前
Windows 应用程序的 UI 框架:WPF、WinUI 3 和 UWP的差异区别
windows·ui·wpf