WPF效果第一百八十五篇之又玩TreeView

最近又有新的开发任务了,然后我提前瞄了一眼需要实现的效果;发现其中一个和我去年玩耍的有点类似;正好好久也没玩了,那就趁着这个机会再次学习一下;闲话也不多扯了,上效果:

2、来看看我的实现方式:

3、①是一个分组的数据模板

<HierarchicalDataTemplate x:Key="GroupDataTemplate" DataType="{x:Type Nodes:TreeModel}"
                              ItemsSource="{Binding Children,Mode=TwoWay}">
    <WrapPanel Margin="8,0,0,0">
        <Path Data="{Binding NodeType,Converter={StaticResource NodeTypeEnumToPathConverter}}"
                  Stretch="Uniform" Fill="White" x:Name="IcoPath"
                  Width="{Binding NodeType,Converter={StaticResource NodeTypeEnumToPathSizeConverter}}"
                  Height="{Binding NodeType,Converter={StaticResource NodeTypeEnumToPathSizeConverter}}"/>
        <Grid>
            <TextBlock x:Name="ShowTbk" Margin="4,0,0,0" Text="{Binding Name,Mode=TwoWay}" Foreground="White"
                               FontSize="16"/>
        </Grid>
    </WrapPanel>
    <HierarchicalDataTemplate.Triggers>
        <MultiDataTrigger>
            <MultiDataTrigger.Conditions>
                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type TreeViewItem}}}"
                                   Value="True"/>
            </MultiDataTrigger.Conditions>
            <Setter TargetName="IcoPath" Property="Fill" Value="#1DF340" />
            <Setter TargetName="ShowTbk" Property="Foreground" Value="#1DF340" />
        </MultiDataTrigger>
    </HierarchicalDataTemplate.Triggers>
</HierarchicalDataTemplate>

4、②和③是另一个数据模板

<HierarchicalDataTemplate x:Key="ExpanderNodeDataTemplate" DataType="{x:Type Nodes:TreeModel}"
                              ItemsSource="{Binding Children,Mode=TwoWay}">
    <Expander Header="{Binding Name}" Style="{DynamicResource ExpanderStyle1}">
        <WrapPanel Margin="30,8,0,0" Orientation="Vertical">
            <TextBlock Text="{Binding Processors.Type,Mode=TwoWay}" Foreground="White" FontSize="14"/>
            <TextBlock Margin="0,4,0,0" Text="{Binding Processors.IP,Mode=TwoWay}" Foreground="White" FontSize="14"/>
            <TextBlock Margin="0,4,0,0" Text="{Binding Processors.ID,Mode=TwoWay}" Foreground="White" FontSize="14"/>
        </WrapPanel>
    </Expander>
</HierarchicalDataTemplate>

5、Expander模板自己玩吧,数据模板选择器:

public class TreeViewItemTemplateSelector: DataTemplateSelector
 {
     public override DataTemplate SelectTemplate(object item, DependencyObject container)
     {
         var fe = container as FrameworkElement;
         var treeModel = item as TreeModel;
         DataTemplate dt = null;
         if(treeModel != null && fe != null)
         {
             var nodeType = treeModel.NodeType;
             //组
             if(nodeType == NodeTypeEnum.Group)
             {
                 dt = fe.FindResource("GroupDataTemplate") as DataTemplate;
             }
             //节点
             else
             {
                 dt = fe.FindResource("ExpanderNodeDataTemplate") as DataTemplate;
             }
         }
         return dt;
     }
 }

6、前台ItemTemplateSelector：

<Setter Property="ItemTemplateSelector"  Value="{StaticResource TreeViewItemTemplateSelector}"/>

最终简单的效果先这样吧;以后有时间的话,可以再去摸索一下更复杂的效果;编程不息、Bug不止、无Bug、无生活;改bug的冷静、编码的激情、完成后的喜悦、挖坑的激动 、填坑的兴奋;这也许就是屌丝程序员的乐趣吧;今天就到这里吧;希望自己有动力一步一步坚持下去;生命不息,代码不止;大家抽空可以看看今天分享的效果,有好的意见和想法,可以在留言板随意留言;我看到后会第一时间回复大家,多谢大家的一直默默的关注和支持!如果觉得不错,那就伸出您的小手点个赞并关注一下,多谢您的支持！