Silverlight TreeView 動態綁定Xml 文件

隨着應用程序的不斷升級，客戶的需求不斷增多，程序員不得不對自己的應用程序做出相應的修改，如果修改的內容較多，那麼就必須找出一種簡便方法，下面就爲大家介紹一下在SilverLight 中左邊導航欄TreeView 如何動態綁定 Xml 文件中的數據

1、準備工作，首先建立一個TreeViewData.xml文件，代碼如下：

 

<?xml version="1.0" encoding="utf-8" ?>
<root>
  <node name="系統管理">
    <node name="添加用戶"/>
    <node name="用戶管理"/>
    <node name="修改密碼"/>
    <node name="系統參數"/>
  </node>
  <node name="操作管理">
    <node name="違法數據錄入"/>
    <node name="違法信息套打" />
    <node name="業務辦理" />
  </node>
</root>

2、建立一個TreeViewLoadXmlTest.xaml文件並在其中添加如下代碼：

 

<navigation:Page x:Class="MySilverLight.TreeViewLoadXmlTest"
           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:common="clr-namespace:System.Windows;assembly=System.Windows.Controls"
                 xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"
           mc:Ignorable="d"
           xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
           d:DesignWidth="640" d:DesignHeight="480"
           Title="TreeViewLoadXmlTest Page">
    <Grid x:Name="LayoutRoot">
        <StackPanel Background="#ffc">
            <StackPanel.Resources>
                <common:HierarchicalDataTemplate
                    x:Key="childTemplate"
                    ItemsSource="{Binding Path=Children}">
                    <StackPanel>
                        <TextBlock Text="{Binding Path=Title}"
                                 FontStyle="Italic"/>
                    </StackPanel>
                </common:HierarchicalDataTemplate>
                <common:HierarchicalDataTemplate
                    x:Key="treeTemplate"
                    ItemsSource="{Binding Path=Children}"
                    ItemTemplate="{StaticResource childTemplate}">
                    <TextBlock Text="{Binding Path=Title}"
                               FontWeight="Bold"/>
                </common:HierarchicalDataTemplate>
            </StackPanel.Resources>
            <!--
                ItemsSource - 數據源
                ItemTemplate - 指定層級顯示數據的模板
            -->
            <controls:TreeView x:Name="treeView" Margin="5"
                ItemsSource="{Binding}"
                ItemTemplate="{StaticResource treeTemplate}"
                SelectedItemChanged="treeView_SelectedItemChanged">
            </controls:TreeView>
        </StackPanel>
    </Grid>
</navigation:Page>

值得注意的是，在寫代碼之前，需要在頭部加上這樣兩句話：

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

否則，在後面會提示common 和controls出錯

 

3、接下來需要準備一個TreeViewModel.cs類，代碼如下：

 

namespace MySilverLight
{
    public class TreeViewModel
    {
        public string Title { get; set; }
        public Uri Address { get; set; }
        public List<TreeViewModel> Children { get; set; }
    }
}

在此需要引入using System.Collections.Generic;

 

4、打開後臺代碼文件TreeViewLoadXmlTest.xaml.cs ,代碼如下：

 

namespace MySilverLight
{
    public partial class TreeViewLoadXmlTest : Page
    {
        public TreeViewLoadXmlTest()
        {
            InitializeComponent();
            this.Loaded += new RoutedEventHandler(TreeView_Loaded);
        }

        // 當用戶導航到此頁面時執行。
        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
        }
        void TreeView_Loaded(object sender, RoutedEventArgs e)
        {
            XElement root = XElement.Load("TreeViewData.xml");

            // 構造帶層級關係的數據源（遞歸方式）
            var result = LoadData(root);

            treeView.DataContext = result;
        }
        private List<TreeViewModel> LoadData(XElement root)
        {
            if (root == null)
                return null;

            var items = from n in root.Elements("node")
                        select new TreeViewModel
                        {
                            Title = (string)n.Attribute("name"),
                            Children = LoadData(n)
                        };

            return items.ToList();
        }
        private void treeView_SelectedItemChanged(object sender, RoutedPropertyChangedEventArgs<object> e)
        {
            MessageBox.Show(((TreeViewModel)e.NewValue).Title);
        }
    }
}

這裏同樣值得注意的是，需要引用命名空間，System.Xml.Linq;否則XElement會提示找不到；

直到這裏，我們的工作基本上算是完成了，效果如下：