Silverlight RadTreeView 控制元件使用介紹

1、RadTreeView是Telerik公司提供的控制元件，與之對應的也有SL平臺下的控制元件，使用方法跟Silverlight ToolKit中的TreeView中使用的HierarchicalDataTemplate類似，可以實現多級遞迴。

2、新增名稱空間引用

xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"

3、新增資源引用

<UserControl.Resources>

<telerik2:HierarchicalDataTemplate x:Key="V_Region" ItemTemplate="{StaticResource V_Site}"
           ItemsSource="{Binding V_Sites}">
            <TextBlock Text="{Binding R_Name}" />
        </telerik2:HierarchicalDataTemplate>

</UserControl.Resources>

3、控制元件新增

<telerik:RadTreeView x:Name="RadTreeView1"
                                       SelectionMode="Extended" IsLineEnabled="True" IsExpandOnSingleClickEnabled="True"
                        ItemsOptionListType="None" IsOptionElementsEnabled="True"
                        IsRootLinesEnabled="True" IsTriStateMode="True" Selected="RadTreeView1_Selected" FontSize="14.667" Foreground="#FF0A539D" FontFamily="Microsoft YaHei" Canvas.ZIndex="1"
                                       ItemsSource="{Binding SiteTypesDataSource}"
                                       ItemTemplate="{StaticResource V_Region}" Grid.Row="2" Margin="33,6,25,5" />

4、幾個類 Item_Collection_DistinctBy_VID.cs、V_Site.cs、V_Region.cs，分別如下：

public class Item_Collection_DistinctBy_VID : IEqualityComparer<Video>
{
        public bool Equals(Video p1, Video p2)
        {
            if (p1 == null)
                return p2 == null;
            return p1.REGIONNM == p2.REGIONNM;
        }

        public int GetHashCode(Video p)
        {
            if (p == null)
                return 0;
            return p.REGIONNM.GetHashCode();
        }
}

public class V_Site
{
        public V_Site(string name, string code, double lgtd, double lttd)
        {
            this.S_Name = name;
            this.S_Code = code;
            this.S_LGTD = lgtd;
            this.S_LTTD = lttd;
        }
        public string S_Code { get; set; } //站點編碼
        public string S_Name { get; set; } //站點名稱
        public double S_LGTD { get; set; } //經度
        public double S_LTTD { get; set; } //緯度
}

public class V_Region
{
        public V_Region(string name, string code)
        {
            this.R_Name = name;
            this.R_Code = code;
            this.V_Sites = new ObservableCollection<V_Site>();
        }

        public string R_Name { get; set; } //地區名稱
        public string R_Code { get; set; } //地區編碼
        public ObservableCollection<V_Site> V_Sites { get; set; } //站點型別
}

5、資料繫結

#region 樹狀繫結事件，使用LINQ來處理一次性獲取的資料，然後繫結到RadTreeView中

public ObservableCollection<V_Region> SiteTypesDataSource { get; set; }

V_Region l;

        /// <summary>
        /// 根據站點型別和地區型別，獲取站點資訊
        /// </summary>
        /// <param name="type"></param>
        /// <param name="region"></param>
        private void InitializeDataSource()
        {
            this.SiteTypesDataSource = new ObservableCollection<V_Region>();
            getMapDataSoapClient client = new getMapDataSoapClient();
            client.getAllSPSitesCompleted += new EventHandler<getAllSPSitesCompletedEventArgs>(client_getAllSPSitesCompleted);
            client.getAllSPSitesAsync();
        }

        void client_getAllSPSitesCompleted(object sender, getAllSPSitesCompletedEventArgs e)
        {
            ObservableCollection<Video> lists = e.Result;
            var tempSTTP = lists.Distinct(new Item_Collection_DistinctBy_VID()).ToList(); //不同的地區
            foreach (Video sttp in tempSTTP)
            {
                this.SiteTypesDataSource.Add(l = new V_Region(sttp.REGIONNM, sttp.VIDEOID));
                List<Video> rets = (from li in lists
                                    where li.REGIONNM == sttp.REGIONNM
                                    select li
                                  ).ToList<Video>();
                foreach (Video item in rets)
                {
                    l.V_Sites.Add(new V_Site(item.SITENM, item.VIDEOID, item.LGTD, item.LTTD));
                }
            }
            this.RadTreeView1.ItemsSource = SiteTypesDataSource;
            this.RadTreeView1.ExpandAll();
        }

#endregion

6、點選TreeView節點，進行站點定位聚焦

      //選中時動態繫結
        private void RadTreeView1_Selected(object sender, Telerik.Windows.RadRoutedEventArgs e)
        {
            RadTreeView source = sender as RadTreeView;
            try
            {
                if (source.SelectedItem is MapClient.TreeClass.V_Region)
                {
                    //地區
                    return;
                }
                if (source.SelectedItem is V_Site)
                {
                    //站點
                    V_Site s = source.SelectedItem as V_Site;
                    Graphic g = new Graphic()
                    {
                        Geometry = mercator.FromGeographic(new MapPoint(double.Parse(s.S_LGTD.ToString()), double.Parse(s.S_LTTD.ToString()))),
                        Symbol = LayoutRoot.Resources["DefaultMarkerSymbol"] as Symbol
                    };

ESRI.ArcGIS.Client.Geometry.Envelope selectedFeatureExtent = mercator.ToGeographic(g.Geometry).Extent; //選中點的位置
double expandPercentage = 2;

                    //加數值後，聚焦（這裡需要注意，進行地理座標和墨卡託座標的轉換 2013-01-29 張大偉）
                    double widthExpand = (selectedFeatureExtent.Width + 5) * (expandPercentage / 100);
                    double heightExpand = (selectedFeatureExtent.Height + 5) * (expandPercentage / 100);
                    ESRI.ArcGIS.Client.Geometry.Envelope displayExtent = new Envelope(WKIDConvert.lonlat2mercator(new MapPoint(selectedFeatureExtent.XMin - (widthExpand / 2), selectedFeatureExtent.YMin - (heightExpand / 2))), WKIDConvert.lonlat2mercator(new MapPoint(selectedFeatureExtent.XMax + (widthExpand / 2), selectedFeatureExtent.YMax + (heightExpand / 2))))
                    {
                        SpatialReference = new SpatialReference(102100)
                    };
                    try
                    {
                        //聚焦
                        myMap.ZoomTo(displayExtent);
                        ShowFocus(g);
                    }
                    catch (Exception)
                    {
                    }
                }
            }
            catch (Exception ex)
            {
                return;
            }
        }

7、效果如下圖：

Silverlight RadTreeView 控制元件使用介紹

相關文章