ItemsControl 数据绑定的两种方式

 更新时间:2021年03月03日 16:06:21   作者:Hello——寻梦者!  
这篇文章主要介绍了ItemsControl 数据绑定的两种方式,帮助大家更好的理解和学习使用c#,感兴趣的朋友可以了解下

     最近在学习ItemsControl这个控件的时候,查看了MSDN上面的一个例子,并且自己做了一些修改,这里主要使用了两种方式来进行相应的数据绑定,一种是使用DataContext,另外一种是直接将一个类绑定到前台,其实这两种方式原理差不多都是将数据模型的对象添加到一个ObservableCollection集合中,然后再绑定到前台,下面分别介绍两种绑定方式:

第一种

是将数据存储在一个ObservableCollection集合中,然后作为ItemsControl的DataContext对象,下面分别贴出相关的代码: 

<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}"这句必须添加,否则后台的数据是无法添加到前台的,这个需要注意,这里贴出后台的代码 

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;这个是将刚才的集合绑定到ItemsControl控件上,这里需要我们的注意。

第二种

  另外一种方式的数据绑定就是将一个类绑定到这个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>

这里我们通过资源来引用一个类,让后使用  ItemsSource="{Binding Source={StaticResource myDataSource}}"将这个类绑定到ItemsSource控件上面,这里贴出相关的代码,我们定义了一个MyData的类,将该类作为数据源绑定到前台上,这个类的代码如下

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"
    }
    );
  
  }
  
 }
}

  这里面很重要的一部就是让这个类继承自 ObservableCollection<DataSource>,然后来添加相应的数据源,我们在使用继承的时候需要注意这些技巧。

  其实这两种情况都是将一个数据集合绑定到前台,只不过是一些绑定的方式有所不同,实际的原理都是一样的!

以上就是ItemsControl 数据绑定的两种方式的详细内容,更多关于ItemsControl 数据绑定的资料请关注脚本之家其它相关文章!

相关文章

  • 如何用WindowsForm给窗口添加一些简单的动画效果

    如何用WindowsForm给窗口添加一些简单的动画效果

    这篇文章主要介绍了如何用WindowsForm给窗口添加一些简单的动画效果,文中讲解非常细致,代码帮助大家更好的理解和学习,感兴趣的朋友可以了解下
    2020-07-07
  • Unity Shader实现3D翻页效果

    Unity Shader实现3D翻页效果

    这篇文章主要为大家详细介绍了Unity Shader实现3D翻页效果,Plane实现翻页效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-07-07
  • C#程序(含多个Dll)合并成一个Exe的简单方法

    C#程序(含多个Dll)合并成一个Exe的简单方法

    这篇文章主要为大家详细介绍了C#程序(含多个Dll)合并成一个Exe的简单方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-12-12
  • C#获取计算机硬件与操作系统的相关信息

    C#获取计算机硬件与操作系统的相关信息

    这篇文章介绍了C#获取计算机硬件与操作系统相关信息的方法,文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-04-04
  • C#窗体控件DataGridView常用设置

    C#窗体控件DataGridView常用设置

    这篇文章主要为大家详细介绍了C#窗体控件DataGridView常用10项设置,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-08-08
  • C# XML字符串包含特殊字符的处理转换方法小结

    C# XML字符串包含特殊字符的处理转换方法小结

    今天用C#输出XML文件时,发现报错,经过反复检查调试,发现是因为某处内容含有某些特殊字符,这些特殊字符是在XML里不被允许的
    2020-07-07
  • WPF中的ValidationRule实现参数绑定解决方案

    WPF中的ValidationRule实现参数绑定解决方案

    在WPF中,默认情况下,DataContext是通过可视化树来传递的,父元素的DataContext会自动传递给其子元素,以便子元素可以访问父元素的数据对象,这篇文章主要介绍了WPF中的ValidationRule实现参数绑定解决方案,需要的朋友可以参考下
    2023-08-08
  • C# 获取XML文件内容的多种方式总结

    C# 获取XML文件内容的多种方式总结

    这篇文章主要介绍了C# 获取XML文件内容的多种方式总结,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-01-01
  • Unity调用手机摄像机识别二维码

    Unity调用手机摄像机识别二维码

    这篇文章主要为大家详细介绍了Unity调用手机摄像机识别二维码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-07-07
  • C#实现OFD格式与PDF格式的互转

    C#实现OFD格式与PDF格式的互转

    OFD格式的文档是一种我国独有的国家标准版式的文档。本文将通过C#程序介绍如何实现由OFD与PDF的互相转换,感兴趣的小伙伴可以了解一下
    2022-02-02

最新评论