zoukankan      html  css  js  c++  java
  • 使用WPF绑定层次结构数据

          本文讲述WPF中单层次数据和多层次数据的绑定方法,主要阐述数据绑定的显示层面,其中涉及了ListBox和Treeview控件。并说明它们之间的差异。

      在实际项目应用中会存在多种类型的层次结构数据,WPF提供了良好的数据绑定机制。其中运用最频繁的就是ListBox和TreeView控件。

          一、ListBox和TreeView控件的区别

      1.ListBox显示单层次数据集合,TreeView可以显示单层次和多层次数据集合;

      2.通过ListBox在UI层面可以展示良好的数据显示效果,对数据集合可以进行排序、分组、过滤操作;

      3.TreeView显示为一个多层次的数据集合为树形结构,通过Templete和Style属性同样可以为其定义良好的数据显示效果;

      二、ListBox控件示例

      1.ListBox绑定数据进行分组:

      使用ListBox.GridStyle标签,定义HeaderTemplate属性用来定义组头的外观:

      

    代码
    1 <ListBox ItemSource="{Binding Path=Data}">
    2  <ListBox.GridStyle>
    3 <GroupStyle.HeaderTemplate>
    4 <DataTemplate>
    5 <Stackpanel>
    6 <Image Source="xxx.jpg"/>
    7 <Label Content="C:"/>
    8 <Stackpanel>
    9 </DataTemplate>
    10 </GroupStyle.HeaderTemplate>
    11  </ListBox.GridStyle>
    12 ......
    13  </ListBox>

      这样就可以创建出类似WINDOWS 文件管理器的效果:

        

         2.Listbox一些使用经验:

      /1 如果要实现类似WINDOWS的漂亮的界面效果并进行分组,需要自定义GroupStyle的样式,否则WPF会使用内建的GroupStyle,也可以引用GroupStyle.Default静态属性。

         /2 ListBox只能定义一层数据结构,在ListBox中的Item里再次使用ListBox,后ListBox里的ItemSource不会继承上一层ListBox的Item源中的数据集合,如有如下数据集合:

          

    public List<Groups> groups = new List<Groups>();
    groups.Add(
    new Group);
    ........
    public class Group {
    public int Id { get; set; }
    public string Name { get; set; }
    private List<Box> boxes = new List<Box>();

    public List<Box> Boxes {
    get { return boxes; }
    }
    }

       Listbox的ItemSource Binding List<Groups>的数据集合,其Item中的ListBox Binding List<Box>,则Item中的ListBox是无法获取List<Box>这个数据集合的;

      三、TreeView控件示例

      1.有如上数据集合,使用TreeView绑定多层数据集合:

      

    代码
    1 <TreeView x:Name="maintree" FocusVisualStyle="{x:Null}" ItemsSource="{Binding Groups}">
    2 <TreeView.ItemContainerStyle>
    3 <Style TargetType="{x:Type TreeViewItem}">
    4 <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}" />
    5 <Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}" />
    6 <Setter Property="FontWeight" Value="Normal" />
    7 <Style.Triggers>
    8 <Trigger Property="IsSelected" Value="True">
    9 <Setter Property="FontWeight" Value="Bold"/>
    10 </Trigger>
    11 </Style.Triggers>
    12 </Style>
    13 </TreeView.ItemContainerStyle>
    14 <TreeView.Resources>
    15 <HierarchicalDataTemplate DataType="{x:Type m:GroupVO}" ItemsSource="{Binding Boxes}">
    16 <StackPanel Orientation="Horizontal">
    17 <Label Content="{Binding Path=FriendlyName}"></Label>
    18 <CheckBox VerticalAlignment="Center" IsChecked="{Binding Path=IsSelected}"></CheckBox>
    19 </StackPanel>
    20 </HierarchicalDataTemplate>
    21
    22 <DataTemplate DataType="{x:Type m:BoxVO}">
    23 <Grid Margin="0,5,5,10" MouseDown="maintree_MouseDown" Loaded="Grid_Loaded">
    24 <Grid.RowDefinitions>
    25 <RowDefinition></RowDefinition>
    26 </Grid.RowDefinitions>
    27 <Grid.ColumnDefinitions>
    28 <ColumnDefinition Width="*"></ColumnDefinition>
    29 <ColumnDefinition Width="6*"></ColumnDefinition>
    30 </Grid.ColumnDefinitions>
    31 <Image Source="/Resources/Images/shgbit.png" Width="50" VerticalAlignment="Top" Grid.Column="0" Grid.Row="0"></Image>
    32 <Label Grid.RowSpan="2" Grid.Row="0" Grid.Column="0" Margin="5,5,0,0" Content="{Binding Path=FriendlyName}"></Label>
    33 </DataTemplate>
    34 </TreeView.Resources>
    35 </TreeView>

      HierarchicalDataTemplate属性为层级数据模板,它继承数据集合的层级结构,要表示树的层级依赖关系必须使用HierarchicalDataTemplate。

      属性绑定数据使用TwoWay是为双向属性,当源数据或目标被改变是更新另一方的数据。在层次树表示中的典型应用就是:用CheckBox进行子节点的选中和未选中的状态传递。

      转载时,请注明本文来源:www.cnblogs.com/tmywu

       

      作者: 淘米部落

      联系邮箱:tommywu23@gmail.com 

  • 相关阅读:
    bzoj4705: 棋盘游戏
    bzoj4709 [jsoi2011]柠檬
    51nod 1411 矩阵取数问题 V3
    51nod1258 序列求和V4
    51nod 1348 乘积之和
    PostgreSQL Replication之第九章 与pgpool一起工作(3)
    PostgreSQL Replication之第九章 与pgpool一起工作(2)
    PostgreSQL Replication之第九章 与pgpool一起工作(1)
    PostgreSQL Replication之第八章 与pgbouncer一起工作(5)
    PostgreSQL Replication之第八章 与pgbouncer一起工作(4)
  • 原文地址:https://www.cnblogs.com/tmywu/p/1763270.html
Copyright © 2011-2022 走看看