您好,登錄后才能下訂單哦!
本篇內(nèi)容主要講解“數(shù)據(jù)綁定ItemsControl ”,感興趣的朋友不妨來看看。本文介紹的方法操作簡(jiǎn)單快捷,實(shí)用性強(qiáng)。下面就讓小編來帶大家學(xué)習(xí)“數(shù)據(jù)綁定ItemsControl ”吧!
最近在學(xué)習(xí)ItemsControl這個(gè)控件的時(shí)候,查看了MSDN上面的一個(gè)例子,并且自己做了一些修改,這里主要使用了兩種方式來進(jìn)行相應(yīng)的數(shù)據(jù)綁定,一種是使用DataContext,另外一種是直接將一個(gè)類綁定到前臺(tái),其實(shí)這兩種方式原理差不多都是將數(shù)據(jù)模型的對(duì)象添加到一個(gè)ObservableCollection集合中,然后再綁定到前臺(tái),下面分別介紹兩種綁定方式:
是將數(shù)據(jù)存儲(chǔ)在一個(gè)ObservableCollection集合中,然后作為ItemsControl的DataContext對(duì)象,下面分別貼出相關(guān)的代碼:
<Window x:Class="TestGrid.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:TestGrid" Title="MainWindow" Height="350" Width="525"> <Grid> <ItemsControl Margin="10" x:Name="myItemsControl" ItemsSource="{Binding}"> <ItemsControl.Template> <ControlTemplate TargetType="ItemsControl"> <Border BorderBrush="Aqua" BorderThickness="1" CornerRadius="15"> <ItemsPresenter/> </Border> </ControlTemplate> </ItemsControl.Template> <ItemsControl.ItemsPanel> <ItemsPanelTemplate> <WrapPanel/> </ItemsPanelTemplate> </ItemsControl.ItemsPanel> <ItemsControl.ItemTemplate> <DataTemplate DataType="{ x:Type local:DataSource}"> <DataTemplate.Resources> <Style TargetType="TextBlock"> <Setter Property="FontSize" Value="18"/> <Setter Property="HorizontalAlignment" Value="Center"/> </Style> </DataTemplate.Resources> <Grid> <Rectangle Fill="Green"/> <Ellipse Fill="Red"/> <StackPanel> <TextBlock Margin="3,3,3,0" Text="{Binding Path=Priority,Mode=TwoWay}"/> <TextBlock Margin="3,0,3,7" Text="{Binding Path=TaskName,Mode=TwoWay}"/> </StackPanel> </Grid> </DataTemplate> </ItemsControl.ItemTemplate> <ItemsControl.ItemContainerStyle> <Style> <Setter Property="Control.Width" Value="100"/> <Setter Property="Control.Margin" Value="5"/> <Style.Triggers> <Trigger Property="Control.IsMouseOver" Value="True"> <Setter Property="Control.ToolTip" Value="{Binding RelativeSource={x:Static RelativeSource.Self}, Path=Content.Description}"/> </Trigger> </Style.Triggers> </Style> </ItemsControl.ItemContainerStyle> </ItemsControl> </Grid> </Window>
這里需要注意的地方是 ItemsSource="{Binding}"這句必須添加,否則后臺(tái)的數(shù)據(jù)是無法添加到前臺(tái)的,這個(gè)需要注意,這里貼出后臺(tái)的代碼
using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Imaging; using System.Windows.Navigation; using System.Windows.Shapes; namespace TestGrid { /// <summary> /// MainWindow.xaml 的交互邏輯 /// </summary> public partial class MainWindow : Window { private ObservableCollection<DataSource> item = null; public MainWindow() { InitializeComponent(); item = new ObservableCollection<DataSource>(); item.Add( new DataSource() { Priority = "1", TaskName = "hello" } ); item.Add( new DataSource() { Priority = "2", TaskName = "whats" } ); item.Add( new DataSource() { Priority = "3", TaskName = "your" } ); item.Add( new DataSource() { Priority = "4", TaskName = "name" } ); item.Add( new DataSource() { Priority = "5", TaskName = "can" } ); item.Add( new DataSource() { Priority = "6", TaskName = "you" } ); this.myItemsControl.DataContext = item; } } }
using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Imaging; using System.Windows.Navigation; using System.Windows.Shapes; namespace TestGrid { /// <summary> /// MainWindow.xaml 的交互邏輯 /// </summary> public partial class MainWindow : Window { private ObservableCollection<DataSource> item = null; public MainWindow() { InitializeComponent(); item = new ObservableCollection<DataSource>(); item.Add( new DataSource() { Priority = "1", TaskName = "hello" } ); item.Add( new DataSource() { Priority = "2", TaskName = "whats" } ); item.Add( new DataSource() { Priority = "3", TaskName = "your" } ); item.Add( new DataSource() { Priority = "4", TaskName = "name" } ); item.Add( new DataSource() { Priority = "5", TaskName = "can" } ); item.Add( new DataSource() { Priority = "6", TaskName = "you" } ); this.myItemsControl.DataContext = item; } } }
這里最重要的一句就是 this.myItemsControl.DataContext = item;這個(gè)是將剛才的集合綁定到ItemsControl控件上,這里需要我們的注意。
另外一種方式的數(shù)據(jù)綁定就是將一個(gè)類綁定到這個(gè)ItemsControl控件上,具體的方式如下:
<Window x:Class="TestGrid.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:TestGrid" Title="MainWindow" Height="350" Width="525"> <Window.Resources> <local:MyData x:Key="myDataSource"/> </Window.Resources> <Grid> <ItemsControl Margin="10" x:Name="myItemsControl" ItemsSource="{Binding Source={StaticResource myDataSource}}"> <ItemsControl.Template> <ControlTemplate TargetType="ItemsControl"> <Border BorderBrush="Aqua" BorderThickness="1" CornerRadius="15"> <ItemsPresenter/> </Border> </ControlTemplate> </ItemsControl.Template> <ItemsControl.ItemsPanel> <ItemsPanelTemplate> <WrapPanel/> </ItemsPanelTemplate> </ItemsControl.ItemsPanel> <ItemsControl.ItemTemplate> <DataTemplate DataType="{ x:Type local:DataSource}"> <DataTemplate.Resources> <Style TargetType="TextBlock"> <Setter Property="FontSize" Value="18"/> <Setter Property="HorizontalAlignment" Value="Center"/> </Style> </DataTemplate.Resources> <Grid> <Rectangle Fill="Green"/> <Ellipse Fill="Red"/> <StackPanel> <TextBlock Margin="3,3,3,0" Text="{Binding Path=Priority,Mode=TwoWay}"/> <TextBlock Margin="3,0,3,7" Text="{Binding Path=TaskName,Mode=TwoWay}"/> </StackPanel> </Grid> </DataTemplate> </ItemsControl.ItemTemplate> <ItemsControl.ItemContainerStyle> <Style> <Setter Property="Control.Width" Value="100"/> <Setter Property="Control.Margin" Value="5"/> <Style.Triggers> <Trigger Property="Control.IsMouseOver" Value="True"> <Setter Property="Control.ToolTip" Value="{Binding RelativeSource={x:Static RelativeSource.Self}, Path=Content.Description}"/> </Trigger> </Style.Triggers> </Style> </ItemsControl.ItemContainerStyle> </ItemsControl> </Grid> </Window>
這里我們通過資源來引用一個(gè)類,讓后使用 ItemsSource="{Binding Source={StaticResource myDataSource}}"將這個(gè)類綁定到ItemsSource控件上面,這里貼出相關(guān)的代碼,我們定義了一個(gè)MyData的類,將該類作為數(shù)據(jù)源綁定到前臺(tái)上,這個(gè)類的代碼如下
using System; using System.Collections.Generic; using System.Collections.ObjectModel; using System.Linq; using System.Text; using System.Threading.Tasks; namespace TestGrid { public class MyData:ObservableCollection<DataSource> { public MyData() { Add (new DataSource() { Priority = "1", TaskName = "My" } ); Add(new DataSource() { Priority = "2", TaskName = "Name" } ); Add(new DataSource() { Priority = "3", TaskName = "Is" } ); Add(new DataSource() { Priority = "4", TaskName = "Ye" } ); Add(new DataSource() { Priority = "5", TaskName = "Bo" } ); } } }
這里面很重要的一部就是讓這個(gè)類繼承自 ObservableCollection<DataSource>,然后來添加相應(yīng)的數(shù)據(jù)源,我們?cè)谑褂美^承的時(shí)候需要注意這些技巧。
其實(shí)這兩種情況都是將一個(gè)數(shù)據(jù)集合綁定到前臺(tái),只不過是一些綁定的方式有所不同,實(shí)際的原理都是一樣的!
到此,相信大家對(duì)“數(shù)據(jù)綁定ItemsControl ”有了更深的了解,不妨來實(shí)際操作一番吧!這里是億速云網(wǎng)站,更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢,關(guān)注我們,繼續(xù)學(xué)習(xí)!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。