Styling a ListView with a Horizontal ItemsPanel and a Header

Styling a ListView with a Horizontal ItemsPanel and a Header

原文 http://eblog.cloudplush.com/2012/05/23/styling-a-listview-with-a-horizontal-itemspanel-and-a-header/

I had to create a specific ListView for my WPF project. A Horizontal alignment of items, with a header column, containing a templated item with a templated checkbox. The final effect looks like this:

Styling a ListView with a Horizontal ItemsPanel and a Header

If we decompose the panel, here are the elements:
Black box: ListView with Template containing a Grid with 2 columns
Red box: The Header column in the ListView template on Grid.Column=”0″
Yellow box: The ListView item panel (ItemsPresenter) located on Grid.Column=”1″ containing an templates ItemsPanelTemplate which is a StackPanel with an Orientation=”Horizontal”.
Green box: The ListView’s ItemTemplate which is a StackPanel with an Orientation=”Vertical” containing a TextBlock with a RotateTransform LayoutTransform and a Templated Checkbox which uses an Ellipse as it’s main shape.

Styling a ListView with a Horizontal ItemsPanel and a Header

<ListView ItemsSource="{Binding OpUnitList}" Grid.Row="1" Name="FilterListBox">
 <ListView.ItemsPanel>
   <ItemsPanelTemplate>
     <StackPanel Orientation="Horizontal" IsItemsHost="True">
     </StackPanel>
   </ItemsPanelTemplate>
 </ListView.ItemsPanel>
 <ListView.ItemTemplate>
   <DataTemplate>
     <StackPanel Orientation="Vertical">
       <TextBlock Text="{Binding OpUnitName}" Width="60" Margin="2">
         <TextBlock.LayoutTransform>
           <RotateTransform Angle="-90"/>
         </TextBlock.LayoutTransform>
       </TextBlock>
       <CheckBox IsChecked="{Binding FilterValue}" Name="RgDot" IsThreeState="True" Style="{StaticResource EllipseCheckBoxStyle}"/>
     </StackPanel>
   </DataTemplate>
 </ListView.ItemTemplate>
 <ListView.Template>
   <ControlTemplate>
     <Grid HorizontalAlignment="Left"> 
       <Grid.ColumnDefinitions>
         <ColumnDefinition Width="Auto"></ColumnDefinition>
         <ColumnDefinition Width="*"></ColumnDefinition>
       </Grid.ColumnDefinitions>
       <StackPanel Orientation="Vertical" Grid.Column="0">
         <TextBlock Margin="2" Height="60">OpUnit Name</TextBlock>
         <TextBlock Margin="2">Filter</TextBlock>
       </StackPanel>
       <ItemsPresenter Grid.Column="1"></ItemsPresenter>
     </Grid>
   </ControlTemplate>
 </ListView.Template>
</ListView>

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/101581.html原文链接:https://javaforall.net

(0)
上一篇 2021年6月7日 下午5:00
下一篇 2021年6月7日 下午6:00


相关推荐

  • Kafka集群搭建详细步骤

    Kafka集群搭建详细步骤Kafka集群搭建1、Kafka的安装需要java环境,centos7自带java1.6版本,可以不用重新安装,直接使用自带的jdk即可;如果觉得jdk版本太旧,也可以自己重新安装;2、准备好kafka安装包,官网下载地址:http://kafka.apache.org/downloads.html3、下

    2022年4月26日
    57
  • Linux命令之mount命令

    Linux命令之mount命令Unix 系统中可访问的所有文件都排列在一棵大树中 即文件层次结构 根在 这些文件可以分布在多个设备上 mount 命令用于将某些设备上的文件系统附加到大文件树 相反 umount 命令将再次将其分离 mount 是 Linux 下常用命令 它可以将分区挂接到 Linux 的一个文件夹下 从而将分区和该目录联系起来 因此我们只要访问这个文件夹 就相当于访问该分区了

    2026年3月17日
    3
  • Java8使用Stream流实现List列表的查询、统计、排序、分组

    Java8使用Stream流实现List列表的查询、统计、排序、分组Java8提供了Stream(流)处理集合的关键抽象概念,它可以对集合进行的操作,可以执行非常复杂的查找、过滤和映射数据等操作。StreamAPI借助于同样新出现的Lambda表达式,极大的提高编程效率和程序可读性。下面是使用Stream的常用方法的综合实例。(1)创建User.java(用户信息实体类)。importjava.math.BigDecimal;/***…

    2022年10月5日
    4
  • ILSVRC-ImageNet历年竞赛冠军

    ILSVRC-ImageNet历年竞赛冠军ImageNet 是一个超过 15million 的图像数据集 大约有 22 000 类 是由李飞飞团队从 2007 年开始 耗费大量人力 通过各种方式 网络抓取 人工标注 亚马逊众包平台 收集制作而成 它作为论文在 CVPR 2009 发布 当时人们还很怀疑通过更多数据就能改进算法的看法 深度学习发展起来有几个关键的因素 一个就是庞大的数据 比如说 ImageNet 一个是 GPU 的出现 还有更优的深度模型 更好的优化算法 可以说数据和 GPU 推动了这些的产生 这些产生继续推动深度学习的发展 ILSVRC 是一个

    2026年3月26日
    2
  • 全新安装Mac OSX 开发者环境 同时使用homebrew搭建 (LNMP开发环境)

    全新安装Mac OSX 开发者环境 同时使用homebrew搭建 (LNMP开发环境)

    2021年5月11日
    220
  • Xinetd介绍

    Xinetd介绍转自 http blog chinaunix net uid 21411227 id 1826885 html1 什么是 xinetdxinetd 即 extendedinte xinetd 是新一代的网络守护进程服务程序 又叫超级 Internet 服务器 经常用来管理多种轻量级 Internet 服务 xinetd 提供类似于 inetd tcp wrapper 的功能

    2026年3月18日
    2

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号