Telerik控件 TreeListView

修改其中样式

1、添加TreeListView控件

        <telerik:RadTreeView x:Name="ObjecTreeView" Padding="0,5,0.5,5" Grid.Row="1" BorderThickness="0" ScrollViewer.HorizontalScrollBarVisibility="Disabled"

telerik:StyleManager.Theme="Windows8" SelectionMode="Single" Background="White" SelectionChanged="ObjecTreeView_OnSelectionChanged"

SelectedValuePath="DisplayName" AutoScrollToSelectedItem="True" IsExpandOnSingleClickEnabled="True" FocusVisualStyle="{x:Null}" >

            <telerik:RadTreeView.ItemTemplateSelector>

                <styleSelector:ObjectTreeTemplateSelector ItemTemplate="{StaticResource ObjectItemTemplate}"

TreeItemTemplate="{StaticResource ObjectTreeTemplate}"></styleSelector:ObjectTreeTemplateSelector>

            </telerik:RadTreeView.ItemTemplateSelector>

        </telerik:RadTreeView>

通过模板选择器，选择相应的模板

2、模板

1）级联模板

    <!--对象树母模板-->

    <HierarchicalDataTemplate x:Key="ObjectTreeTemplate"

ItemsSource="{Binding ObjectTypeModels}"

ItemTemplate="{StaticResource ObjectItemTemplate}" ItemContainerStyle="{StaticResource RadTreeViewItemStyle1}">

        <StackPanel Orientation="Horizontal">

            <Image Source="..\..\Images\操作图标\内容\文件夹.png" VerticalAlignment="Center" Height="14" Margin="0,0,5,0"/>

            <CheckBox x:Name="MotherCheckBox" Visibility="{Binding CheckBoxVisibility,Mode=TwoWay}"

IsChecked="{Binding IsChecked,Mode=TwoWay}" Click="ButtonBase_OnClick"></CheckBox>

            <TextBlock Text="{Binding DisplayName,Mode=TwoWay}" Margin="5,0,0,0" />

        </StackPanel>

    </HierarchicalDataTemplate>

2）子模板

    <!--对象树子模板-->

    <DataTemplate x:Key="ObjectItemTemplate">

        <ContentControl Content="{Binding}">

            <ContentControl.Style>

                <Style TargetType="ContentControl">

                    <Setter Property="ContentTemplate" Value="{StaticResource ObjectItemTemplateNoSelect}"></Setter>

                    <Style.Triggers>

                        <DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type telerik:RadTreeViewItem}}, Path=IsSelected}" Value="true">

                            <Setter Property="ContentTemplate" Value="{StaticResource ObjectItemTemplateSelected}"></Setter>

                        </DataTrigger>

                    </Style.Triggers>

                </Style>

            </ContentControl.Style>

        </ContentControl>

    </DataTemplate>

选中样式

    <!--对象树选中状态子模板-->

    <DataTemplate x:Key="ObjectItemTemplateSelected">

        <StackPanel Orientation="Horizontal">

            <Image Source="..\..\Images\操作图标\内容\文件_Click.png" VerticalAlignment="Center" Height="14" Margin="0,0,5,0"/>

            <CheckBox x:Name="ChildCheckBox" Visibility="{Binding CheckBoxVisibility,Mode=TwoWay}" IsChecked="{Binding IsChecked,Mode=TwoWay}"></CheckBox>

            <TextBlock Text="{Binding DisplayName,Mode=TwoWay}" Foreground="#FFB83838" FontWeight="Black" Margin="5,0,0,0"/>

        </StackPanel>

    </DataTemplate>

未选中样式

    <!--对象树未选中状态子模板-->

    <DataTemplate x:Key="ObjectItemTemplateNoSelect">

        <StackPanel Orientation="Horizontal">

            <Image Source="..\..\Images\操作图标\内容\文件.png" VerticalAlignment="Center" Height="14" Margin="0,0,5,0"/>

            <CheckBox x:Name="ChildCheckBox" Visibility="{Binding CheckBoxVisibility,Mode=TwoWay}" IsChecked="{Binding IsChecked,Mode=TwoWay}"></CheckBox>

            <TextBlock Text="{Binding DisplayName,Mode=TwoWay}" Margin="5,0,0,0" />

        </StackPanel>

    </DataTemplate>

2、TreeListView的样式，设置子项的容器、焦点样式等。

    <!--模板的样式-->

    <Style x:Key="RadTreeViewItemStyle1" TargetType="{x:Type telerik:RadTreeViewItem}">

        <Setter Property="FocusVisualStyle">

            <Setter.Value>

                <Style>

                    <Setter Property="Control.Template">

                        <Setter.Value>

                            <ControlTemplate>

                                <Rectangle Margin="0" Stroke="Transparent" StrokeThickness="0"/>

                            </ControlTemplate>

                        </Setter.Value>

                    </Setter>

                </Style>

            </Setter.Value>

        </Setter>

        <Setter Property="HorizontalContentAlignment" Value="Left"/>

        <Setter Property="VerticalContentAlignment" Value="Center"/>

        <Setter Property="BorderThickness" Value="1"/>

        <Setter Property="Padding" Value="1,0,5,0"/>

        <Setter Property="IsDropAllowed" Value="True"/>

        <Setter Property="IsEnabled" Value="True"/>

        <Setter Property="MinHeight" Value="24"/>

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate TargetType="{x:Type telerik:RadTreeViewItem}">

                    <Grid x:Name="RootElement">

                        <Grid.RowDefinitions>

                            <RowDefinition Height="Auto"/>

                            <RowDefinition/>

                        </Grid.RowDefinitions>

                        <Grid x:Name="HeaderRow" Background="Transparent" MinHeight="{TemplateBinding MinHeight}">

                            <Grid.ColumnDefinitions>

                                <ColumnDefinition Width="Auto"/>

                                <ColumnDefinition Width="Auto"/>

                                <ColumnDefinition Width="Auto"/>

                                <ColumnDefinition Width="Auto"/>

                                <ColumnDefinition Width="Auto"/>

                                <ColumnDefinition Width="*"/>

                            </Grid.ColumnDefinitions>

                            <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Grid.ColumnSpan="6" Grid.Column="2" CornerRadius="2"/>

                            <Border x:Name="MouseOverVisual" BorderThickness="0" Grid.ColumnSpan="6" Grid.Column="2" CornerRadius="1" Opacity="0">

                                <Border BorderBrush="White" BorderThickness="0" CornerRadius="0" Background="Transparent">

                                </Border>

                            </Border>

                            <Border x:Name="SelectionUnfocusedVisual" BorderThickness="0" Grid.ColumnSpan="6" Grid.Column="2" CornerRadius="1" Visibility="Collapsed">

                                <Border BorderBrush="Transparent" BorderThickness="0" CornerRadius="0" Background="LightGray">

                                </Border>

                            </Border>

                            <Border x:Name="SelectionVisual" BorderThickness="0" Grid.ColumnSpan="6" Grid.Column="2" CornerRadius="1" Visibility="Collapsed">

                                <Border BorderBrush="Transparent" BorderThickness="0" CornerRadius="0" Background="LightGray">

                                </Border>

                            </Border>

                            <StackPanel x:Name="IndentContainer" Orientation="Horizontal">

                                <Rectangle x:Name="IndentFirstVerticalLine" Stroke="#FFCCCCCC" Visibility="Collapsed" VerticalAlignment="Top" Width="1"/>

                            </StackPanel>

                            <Grid x:Name="ListRootContainer" Grid.Column="1" HorizontalAlignment="Center" MinWidth="20">

                                <Rectangle x:Name="HorizontalLine" HorizontalAlignment="Right" Height="1" Stroke="#FFCCCCCC" VerticalAlignment="Center"/>

                                <Rectangle x:Name="VerticalLine" HorizontalAlignment="Center" Stroke="#FFCCCCCC" VerticalAlignment="Top" Width="1"/>

                                <ToggleButton x:Name="Expander" Background="{TemplateBinding Background}" IsTabStop="False"/>

                                <Grid x:Name="LoadingVisual" HorizontalAlignment="Center" RenderTransformOrigin="0.5,0.5" Visibility="Collapsed" VerticalAlignment="Center">

                                    <Grid.RenderTransform>

                                        <TransformGroup>

                                            <RotateTransform Angle="0" CenterY="0.5" CenterX="0.5"/>

                                        </TransformGroup>

                                    </Grid.RenderTransform>

                                    <Path Data="M1,0A1,1,90,1,1,0,-1" Height="10" StrokeStartLineCap="Round" Stretch="Fill" Stroke="{TemplateBinding Foreground}" StrokeThickness="1" Width="10"/>

                                    <Path Data="M0,-1.1L0.1,-1 0,-0.9" Fill="{TemplateBinding Foreground}" HorizontalAlignment="Left" Height="4" Margin="5,-1.5,0,0" Stretch="Fill" StrokeThickness="1" VerticalAlignment="Top" Width="4"/>

                                </Grid>

                            </Grid>

                            <CheckBox x:Name="CheckBoxElement" Grid.Column="2" IsTabStop="False" Margin="5,0,0,0" Visibility="Collapsed" VerticalAlignment="Center">

                                <telerik:StyleManager.Theme>

                                    <telerik:Office_BlackTheme/>

                                </telerik:StyleManager.Theme>

                            </CheckBox>

                            <RadioButton x:Name="RadioButtonElement" Grid.Column="2" IsTabStop="False" Margin="5,0,0,0" Visibility="Collapsed" VerticalAlignment="Center">

                                <telerik:StyleManager.Theme>

                                    <telerik:Office_BlackTheme/>

                                </telerik:StyleManager.Theme>

                            </RadioButton>

                            <Image x:Name="Image" Grid.Column="3" HorizontalAlignment="Center" MaxWidth="16" MaxHeight="16" Margin="2" VerticalAlignment="Center"/>

                            <Rectangle x:Name="FocusVisual" Grid.ColumnSpan="6" Grid.Column="2" IsHitTestVisible="False" RadiusY="3" RadiusX="3" Stroke="Black" StrokeThickness="0" StrokeDashArray="1 2" Visibility="Collapsed"/>

                            <Grid Grid.ColumnSpan="2" Grid.Column="4">

                                <ContentPresenter x:Name="Header" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

                                <ContentPresenter x:Name="EditHeaderElement" ContentTemplate="{TemplateBinding HeaderEditTemplate}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" Visibility="Collapsed" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

                            </Grid>

                        </Grid>

                        <ItemsPresenter x:Name="ItemsHost" Grid.Row="1" Visibility="Collapsed"/>

                    </Grid>

                    <ControlTemplate.Triggers>

                        <Trigger Property="IsInEditMode" Value="True">

                            <Setter Property="Visibility" TargetName="Header" Value="Collapsed"/>

                            <Setter Property="Visibility" TargetName="EditHeaderElement" Value="Visible"/>

                        </Trigger>

                        <Trigger Property="IsSelected" Value="True">

                            <Setter Property="Visibility" TargetName="SelectionVisual" Value="Visible"/>

                        </Trigger>

                        <Trigger Property="IsFocused" Value="True">

                            <Setter Property="Visibility" TargetName="FocusVisual" Value="Visible"/>

                        </Trigger>

                        <MultiTrigger>

                            <MultiTrigger.Conditions>

                                <Condition Property="IsSelected" Value="True"/>

                                <Condition Property="IsSelectionActive" Value="False"/>

                            </MultiTrigger.Conditions>

                            <Setter Property="Opacity" TargetName="SelectionVisual" Value="0"/>

                            <Setter Property="Visibility" TargetName="SelectionUnfocusedVisual" Value="Visible"/>

                        </MultiTrigger>

                        <Trigger Property="IsEnabled" Value="False">

                            <Setter Property="Opacity" TargetName="Header" Value="0.5"/>

                        </Trigger>

                        <Trigger Property="IsExpanded" Value="True">

                            <Setter Property="Visibility" TargetName="ItemsHost" Value="Visible"/>

                        </Trigger>

                        <Trigger Property="IsLoadingOnDemand" Value="True">

                            <Trigger.EnterActions>

                                <BeginStoryboard x:Name="LoadingVisualTransform">

                                    <Storyboard>

                                        <DoubleAnimation Duration="0:0:1" From="0" RepeatBehavior="Forever" To="359" Storyboard.TargetProperty="Angle" Storyboard.TargetName="LoadingVisualAngleTransform"/>

                                    </Storyboard>

                                </BeginStoryboard>

                            </Trigger.EnterActions>

                            <Trigger.ExitActions>

                                <StopStoryboard BeginStoryboardName="LoadingVisualTransform"/>

                            </Trigger.ExitActions>

                            <Setter Property="Visibility" TargetName="LoadingVisual" Value="Visible"/>

                            <Setter Property="Visibility" TargetName="Expander" Value="Collapsed"/>

                        </Trigger>

                        <Trigger Property="IsDragOver" Value="True">

                            <Setter Property="Opacity" TargetName="MouseOverVisual" Value="1"/>

                        </Trigger>

                        <Trigger Property="IsMouseOver" SourceName="HeaderRow" Value="True">

                            <Setter Property="Opacity" TargetName="MouseOverVisual" Value="1"/>

                        </Trigger>

                    </ControlTemplate.Triggers>

                </ControlTemplate>

            </Setter.Value>

        </Setter>

        <Setter Property="ItemsPanel">

            <Setter.Value>

                <ItemsPanelTemplate>

                    <telerik:TreeViewPanel IsItemsHost="True" IsVisualCacheEnabled="False" VerticalAlignment="Bottom"/>

                </ItemsPanelTemplate>

            </Setter.Value>

        </Setter>

    </Style>

WPF Telerik TreeListView样式设计的更多相关文章

  1. WPF自定义控件与样式(15)-终结篇 & 系列文章索引 & 源码共享

    系列文章目录  WPF自定义控件与样式(1)-矢量字体图标(iconfont) WPF自定义控件与样式(2)-自定义按钮FButton WPF自定义控件与样式(3)-TextBox & Ric ...

  2. WPF自定义控件与样式(12)-缩略图ThumbnailImage /gif动画图/图片列表

    一．前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要针对WPF项目 ...

  3. WPF自定义控件与样式(15)-终结篇

    原文:WPF自定义控件与样式(15)-终结篇 系列文章目录  WPF自定义控件与样式(1)-矢量字体图标(iconfont) WPF自定义控件与样式(2)-自定义按钮FButton WPF自定义控件与 ...

  4. 【转】WPF自定义控件与样式(12)-缩略图ThumbnailImage /gif动画图/图片列表

    一．前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要针对WPF项目 ...

  5. [No000012F]WPF(7/7) - 样式，触发器和动画

    WPF Tutorial : Beginning [^] WPF Tutorial : Layout-Panels-Containers & Layout Transformation [^] ...

  6. WPF自定义控件与样式(3)-TextBox & RichTextBox & PasswordBox样式、水印、Label标签、功能扩展

    一．前言.预览 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要是对文本 ...

  7. WPF自定义控件与样式(1)-矢量字体图标(iconfont)

    一．图标字体 图标字体在网页开发上运用非常广泛,具体可以网络搜索了解,网页上的运用有很多例子,如Bootstrap.但在C/S程序中使用还不多,字体图标其实就是把矢量图形打包到字体文件里,就像使用一般 ...

  8. WPF自定义控件与样式(2)-自定义按钮FButton

    一．前言.效果图 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 还是先看看效果 ...

  9. WPF自定义控件与样式(4)-CheckBox/RadioButton自定义样式

    一．前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: Che ...

随机推荐

  1. Struts2 源码分析——Action代理类的工作

    章节简言 上一章笔者讲到关于如何加载配置文件里面的package元素节点信息.相信读者到这里心里面对struts2在启动的时候加载相关的信息有了一定的了解和认识.而本章将讲到关于struts2启动成功 ...

  2. MySQL PXC构建一个新节点只需IST传输的方法

    需求场景:原有的pxc环境数据量已经比较大,新买的服务器要加入此集群中,如何让其用IST的方式传输,而不是SST. PXC传输数据有两种方式: IST: Incremental State Trans ...

  3. 创建ASP.NET Core MVC应用程序(2)-利用MySQL Connector NET连接到MySQL

    创建ASP.NET Core MVC应用程序(2)-利用MySQL Connector NET连接到MySQL 用惯.NET的研发人员都习惯性地使用SQLServer作为数据库.然而.NET Core ...

  4. 关系数据库SQL之可编程性函数（用户自定义函数）

    前言 在关系型数据库中除了前面几篇基本的数据库和数据表操作之外,还提供了可编程性的函数.存储过程.事务.触发器及游标. 本文介绍的是函数. 函数分为两种: 系统函数 用户自定义函数 准备工作 这里以银 ...

  5. 【转】App开放接口api安全性—Token签名sign的设计与实现

    前言 在app开放接口api的设计中,避免不了的就是安全性问题,因为大多数接口涉及到用户的个人信息以及一些敏感的数据,所以对这些接口需要进行身份的认证,那么这就需要用户提供一些信息,比如用户名密码等, ...

  6. .NET基础架构方法—DataTableToExcel通用方法

    p { display: block; margin: 3px 0 0 0; } --> .NET架构基础方法—DataTableToExcel通用方法(NPOI) 今天封装DataTaleTo ...

  7. 背水一战 Windows 10 (34) - 控件（进度类）: RangeBase, Slider, ProgressBar, ProgressRing

    [源码下载] 背水一战 Windows 10 (34) - 控件(进度类): RangeBase, Slider, ProgressBar, ProgressRing 作者:webabcd 介绍背水一 ...

  8. Android Studio ：enable vt-x in your bios security，已经打开还是报错的解决方法

    quote: For Windows 10: First of all, install the intelhaxm-android.exe located in the folder SDK\ext ...

  9. es6 中增强的对象字面量

    http://www.cnblogs.com/Wayou/p/es6_new_features.html 对象字面量被增强了,写法更加简洁与灵活,同时在定义对象的时候能够做的事情更多了.具体表现在: ...

  10. No.009：Palindrome Number

    问题: Determine whether an integer is a palindrome. Do this without extra space. 官方难度: Easy 翻译: 不使用额外空 ...