有关Silverlight TreeView组件的研究[3]

三、数据绑定与模板样式
说明:通过学习本文内容,您将了解到怎样动态地进行关于TreeView组件的数据绑定以及TreeViewItem组件的模板样式更改。本文给出基本的使用方法。

 

:在Silverlight项目文件夹下建立Icon文件夹,向里面添加3个16*16的png格式的图像。关于动态数据绑定这里只给出了基本的使用方法,在实际开发中可以使用WebService、XML等进行数据绑定。

效果图

 


Feature.cs(
业务模型)代码

using System.Collections.ObjectModel;

using System.ComponentModel;

using System.Windows.Markup;

 

namespace SilverlightClient

{

    [ContentProperty("Subcomponents")] //声明可在XAML文件中显示的内容属性

    public class Feature : INotifyPropertyChanged //继承接口INotifyPropertyChanged用于双向数据绑定

    {

        //Feature对象的属性

        public string FeatureName { get; set; }

        public string Description { get; set; }

        public string Icon { get; set; }//用以添加TreeViewItem项的图标

        //声明全局变量

        public Collection<Feature> Subcomponents { get; private set; }

        private bool? _shouldInstall;

 

        //是否有子组件

        public bool HasSubcomponents

        {

            get

            {

                return Subcomponents.Count > 0;

            }

        }

       

        //是否允许Feature进行安置

        public bool? ShouldInstall

        {

            get

            {

                return _shouldInstall;

            }

            set

            {

                if (value != _shouldInstall)

                {

                    _shouldInstall = value;

                    OnPropertyChanged("ShouldInstall");

                }

            }

        }

 

        //构造函数

        public Feature()

        {

            Subcomponents = new Collection<Feature>();

            ShouldInstall = true;

        }

 

        //事件委托

        public event PropertyChangedEventHandler PropertyChanged;

 

        //实现接口INotifyPropertyChanged定义函数

        private void OnPropertyChanged(string propertyName)

        {

            PropertyChangedEventHandler handler = PropertyChanged;

            if (null != handler)

            {

                handler.Invoke(this, new PropertyChangedEventArgs(propertyName));

            }

        }

    }

}

MainPage.xaml文件代码

<UserControl

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

xmlns:toolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit"

xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"

xmlns:common="clr-namespace:System.Windows;assembly=System.Windows.Controls"

    xmlns:samplesCommon="clr-namespace:SilverlightClient"

    mc:Ignorable="d" x:Class="SilverlightClient.MainPage"

    Width="640" Height="480">

 <Grid x:Name="LayoutRoot" Background="White" Width="640" Height="480">

        <StackPanel>

            <StackPanel.Resources>

                <!-- TreeViewItem风格设定 -->

                <Style x:Key="PurpleItemStyle" TargetType="controls:TreeViewItem">

                    <Setter Property="Foreground" Value="Purple" />

                    <Setter Property="FontWeight" Value="Bold" />

                </Style>

                <!-- 代表一个Feature项的模板 -->

                <common:HierarchicalDataTemplate x:Key="NodeTemplate" ItemsSource="{Binding Subcomponents}" ItemContainerStyle="{StaticResource PurpleItemStyle}">

                    <StackPanel Orientation="Horizontal" ToolTipService.ToolTip="{Binding Description}">

                        <Image Source="{Binding Icon}" /><!-- 图标绑定 -->

                        <ContentPresenter Content=" " />

                        <ContentPresenter Content="{Binding FeatureName}" />

                    </StackPanel>

                </common:HierarchicalDataTemplate>

            </StackPanel.Resources>

            <Grid>

                <Grid.ColumnDefinitions>

                    <ColumnDefinition Width="*" />

                    <ColumnDefinition Width="2*" />

                </Grid.ColumnDefinitions>

                <controls:TreeView x:Name="tvFeature"

                ItemTemplate="{StaticResource NodeTemplate}"

                Grid.Column="0"               

                FontSize="14">

                    <!-- 用来一次展开TreeView所有结点 -->

                    <controls:TreeView.ItemContainerStyle>

                        <Style TargetType="controls:TreeViewItem">

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

                        </Style>

                    </controls:TreeView.ItemContainerStyle>

                </controls:TreeView>

            </Grid>

        </StackPanel>

    </Grid>

</UserControl>

MainPage.xaml.cs文件代码

using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

 

namespace SilverlightClient

{

    public partial class MainPage : UserControl

    {

        public MainPage()

        {

            InitializeComponent();

            this.Loaded += new RoutedEventHandler(MainPage_Loaded);

        }

 

        void MainPage_Loaded(object sender, RoutedEventArgs e)

        {

            Feature ft = new Feature();

           

            Feature ftRoot = new Feature();

            ftRoot.FeatureName = "公司部门";

            ftRoot.Description = "公司各部门的结构";

            ftRoot.Icon = "Icon/l1.png";

 

              Feature ftChild1 = new Feature();

              ftChild1.FeatureName = "建筑部";

              ftChild1.Description = "负责公司的工程项目";

              ftChild1.Icon = "Icon/l2.png";

 

                Feature ftChild1_1 = new Feature();

                ftChild1_1.FeatureName = "设计科";

                ftChild1_1.Description = "负责项目的设计";

                ftChild1_1.Icon = "Icon/l3.png";

 

                Feature ftChild1_2 = new Feature();

                ftChild1_2.FeatureName = "工程科";

                ftChild1_2.Description = "负责项目的具体实施";

                ftChild1_2.Icon = "Icon/l3.png";

 

              ftChild1.Subcomponents.Add(ftChild1_1);

              ftChild1.Subcomponents.Add(ftChild1_2);

 

              Feature ftChild2 = new Feature();

              ftChild2.FeatureName = "管理部";

              ftChild2.Description = "负责管理公司的财务与人事";

              ftChild2.Icon = "Icon/l2.png";

 

                Feature ftChild2_1 = new Feature();

                ftChild2_1.FeatureName = "财务科";

                ftChild2_1.Description = "负责公司的对内对外的财务事宜";

                ftChild2_1.Icon = "Icon/l3.png";

 

                Feature ftChild2_2 = new Feature();

                ftChild2_2.FeatureName = "总务人事科";

                ftChild2_2.Description = "负责公司日常事务及员工招聘";

                ftChild2_2.Icon = "Icon/l3.png";

 

              ftChild2.Subcomponents.Add(ftChild2_1);

              ftChild2.Subcomponents.Add(ftChild2_2);

 

            ftRoot.Subcomponents.Add(ftChild1);

            ftRoot.Subcomponents.Add(ftChild2);

 

            ft.Subcomponents.Add(ftRoot);

 

            tvFeature.ItemsSource = ft.Subcomponents;

        }

}

原文地址:https://www.cnblogs.com/bingyun84/p/1556039.html