首页 > 代码库 > 绑定: 通过 Binding 绑定对象, 通过 x:Bind 绑定对象, 通过 Binding 绑定集合, 通过 x:Bind 绑定集合
绑定: 通过 Binding 绑定对象, 通过 x:Bind 绑定对象, 通过 Binding 绑定集合, 通过 x:Bind 绑定集合
背水一战 Windows 10 之 绑定
- 通过 Binding 绑定对象
- 通过 x:Bind 绑定对象
- 通过 Binding 绑定集合
- 通过 x:Bind 绑定集合
示例
1、演示如何通过 Binding 绑定对象
Bind/BindingModel.xaml
<Page x:Class="Windows10.Bind.BindingModel" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:Windows10.Bind" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <Grid Name="root" Background="Transparent"> <StackPanel Margin="10 0 10 10"> <TextBlock Name="lblMsg" Margin="5" /> <TextBox Text="{Binding Name, Mode=TwoWay}" Margin="5" /> <TextBox Text="{Binding Age, Mode=TwoWay}" Margin="5" /> <ToggleSwitch IsOn="{Binding IsMale, Mode=TwoWay}" OffContent="女" OnContent="男" Header="性别" Margin="5" /> </StackPanel> </Grid></Page>Bind/BindingModel.xaml.cs
/* * 演示如何通过 Binding 绑定对象 * * * 如果需要数据源在属性值发生变化时对外通知，则需要实现 INotifyPropertyChanged 接口（为了简化实现，建议继承 Common/BindableBase.cs 这个类） * PropertyChanged - 对象的属性的值发生变化时触发的事件 */using System;using System.ComponentModel;using Windows.System.Threading;using Windows.UI.Core;using Windows.UI.Xaml.Controls;using Windows10.Common;namespace Windows10.Bind{ public sealed partial class BindingModel : Page { private Employee _employee; public BindingModel() { this.InitializeComponent(); this.Loaded += BindingModel_Loaded; } void BindingModel_Loaded(object sender, Windows.UI.Xaml.RoutedEventArgs e) { // 创建一个需要绑定的实体对象（注：Employee 实现了 INotifyPropertyChanged 接口） _employee = new Employee(); _employee.Name = "webabcd"; _employee.Age = 33; _employee.IsMale = true; // Employee 对象的属性的值发生变化时触发的事件（源自 INotifyPropertyChanged 接口） _employee.PropertyChanged += _employee_PropertyChanged; // 指定数据上下文（绑定的数据源） root.DataContext = _employee; // 每 5 秒更新一次数据 ThreadPoolTimer.CreatePeriodicTimer ( (timer) => { var ignored = Dispatcher.RunAsync ( CoreDispatcherPriority.Normal, () => { Random random = new Random(); _employee.Age = random.Next(10, 100); _employee.IsMale = random.Next() % 2 == 0 ? true : false; } ); }, TimeSpan.FromMilliseconds(5000) ); } // 每次属性的值发生变化时，显示变化后的结果 void _employee_PropertyChanged(object sender, PropertyChangedEventArgs e) { lblMsg.Text = "属性：“" + e.PropertyName + "”的值发生了变化"; lblMsg.Text += Environment.NewLine; lblMsg.Text += string.Format("当前的值为：Name-{0}, Age-{1}, IsMale-{2}", _employee.Name, _employee.Age, _employee.IsMale); } }}
2、演示如何通过 x:Bind 绑定对象
Bind/BindModel.xaml
<Page x:Class="Windows10.Bind.BindModel" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:Windows10.Bind" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <Grid Background="Transparent"> <StackPanel Margin="10 0 10 10"> <TextBlock Name="lblMsg" Margin="5" /> <TextBox Text="{x:Bind CurrentEmployee.Name, Mode=TwoWay}" Margin="5" /> <TextBox Text="{x:Bind CurrentEmployee.Age, Mode=TwoWay}" Margin="5" /> <ToggleSwitch IsOn="{x:Bind CurrentEmployee.IsMale, Mode=TwoWay}" OffContent="女" OnContent="男" Header="性别" Margin="5" /> </StackPanel> </Grid></Page>Bind/BindModel.xaml.cs
/* * 演示 x:Bind 绑定的相关知识点 * * * 如果需要数据源在属性值发生变化时对外通知，则需要实现 INotifyPropertyChanged 接口（为了简化实现，建议继承 Common/BindableBase.cs 这个类） * PropertyChanged - 对象的属性的值发生变化时触发的事件 */using System;using System.Collections.ObjectModel;using Windows.UI.Xaml;using Windows.UI.Xaml.Controls;using Windows10.Common;namespace Windows10.Bind{ // x:Bind 的数据上下文就是它所属的 Page 或 UserControl public sealed partial class BindDemo : Page { public BindDemo() { this.InitializeComponent(); } // 事件绑定到方法，无参数 private void EventBindNoArgs() { CurrentEmployee.Name = "wanglei" + new Random().Next(1000, 10000).ToString(); } // 事件绑定到方法，参数与对应的事件的参数相同 private void EventBindRegularArgs(object sender, RoutedEventArgs e) { CurrentEmployee.Name = "wanglei" + new Random().Next(1000, 10000).ToString(); } // 事件绑定到方法，参数与对应的事件的参数相同，但是其中的事件参数为 object 类型 private void EventBindBaseArgs(object sender, object e) { CurrentEmployee.Name = "wanglei" + new Random().Next(1000, 10000).ToString(); } public Employee CurrentEmployee { get; set; } = new Employee() { Name = "wanglei", Age = 36, IsMale = true }; public ObservableCollection<Employee> AllEmployees { get; set; } = TestData.GetEmployees(5); }}
3、示如何通过 Binding 绑定集合
Bind/BindingCollection.xaml
<Page x:Class="Windows10.Bind.BindingCollection" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:Windows10.Bind" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <Grid Background="Transparent"> <StackPanel Orientation="Vertical" VerticalAlignment="Top" Margin="10 0 10 10"> <Button Name="btnDelete" Content="删除第 1 条数据" Click="btnDelete_Click" Margin="5" /> <Button Name="btnUpdate" Content="更新前 2 条数据" Click="btnUpdate_Click" Margin="5" /> <ListView x:Name="listView" Margin="5"> <ListView.ItemTemplate> <DataTemplate> <Border Background="Blue" Width="200" CornerRadius="3" HorizontalAlignment="Left"> <TextBlock Text="{Binding Name}" /> </Border> </DataTemplate> </ListView.ItemTemplate> </ListView> </StackPanel> </Grid></Page>Bind/BindingCollection.xaml.cs
/* * 演示如何通过 Binding 绑定集合 * * * 如果需要集合数据源在数据添加，删除，更新时对外通知，则需要实现 INotifyCollectionChanged 接口 * CollectionChanged - 集合数据在发生添加，删除，更新时触发的事件 */using System;using System.Collections.ObjectModel;using System.Collections.Specialized;using System.Linq;using Windows.UI.Xaml;using Windows.UI.Xaml.Controls;using Windows10.Common;namespace Windows10.Bind{ public sealed partial class BindingCollection : Page { // ObservableCollection<T> 实现了 INotifyCollectionChanged 接口 private ObservableCollection<Employee> _employees; public BindingCollection() { this.InitializeComponent(); this.Loaded += BindingCollection_Loaded; } void BindingCollection_Loaded(object sender, RoutedEventArgs e) { _employees = new ObservableCollection<Employee>(TestData.GetEmployees()); // 集合数据在发生添加，删除，更新时触发的事件（源自 INotifyCollectionChanged 接口） _employees.CollectionChanged += _employees_CollectionChanged; // 指定 ListView 的数据源 listView.ItemsSource = _employees; } void _employees_CollectionChanged(object sender, NotifyCollectionChangedEventArgs e) { /* * e.Action - 引发此事件的操作类型（NotifyCollectionChangedAction 枚举） * Add, Remove, Replace, Move, Reset * e.OldItems - Remove, Replace, Move 操作时影响的数据列表 * e.OldStartingIndex - Remove, Replace, Move 操作发生处的索引 * e.NewItems - 更改中所涉及的新的数据列表 * e.NewStartingIndex - 更改中所涉及的新的数据列表的发生处的索引 */ } private void btnDelete_Click(object sender, RoutedEventArgs e) { // 此处的通知来自 INotifyCollectionChanged 接口 _employees.RemoveAt(0); } private void btnUpdate_Click(object sender, RoutedEventArgs e) { Random random = new Random(); // 此处的通知来自实现了 INotifyPropertyChanged 接口的 Employee _employees.First().Name = random.Next(1000, 10000).ToString(); // 此处的通知来自 INotifyCollectionChanged 接口 _employees[1] = new Employee() { Name = random.Next(1000, 10000).ToString() }; } }}
4、演示如何通过 x:Bind 绑定集合
Bind/BindCollection.xaml
<Page x:Class="Windows10.Bind.BindCollection" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:Windows10.Bind" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:common="using:Windows10.Common" mc:Ignorable="d"> <Grid Background="Transparent"> <StackPanel Orientation="Vertical" VerticalAlignment="Top" Margin="10 0 10 10"> <Button Name="btnDelete" Content="删除第 1 条数据" Click="btnDelete_Click" Margin="5" /> <Button Name="btnUpdate" Content="更新前 2 条数据" Click="btnUpdate_Click" Margin="5" /> <ListView x:Name="listView" ItemsSource="{x:Bind Employees}" Margin="5"> <ListView.ItemTemplate> <DataTemplate x:DataType="common:Employee"> <Border Background="Blue" Width="200" CornerRadius="3" HorizontalAlignment="Left"> <TextBlock Text="{x:Bind Name, Mode=OneWay}" /> </Border> </DataTemplate> </ListView.ItemTemplate> </ListView> </StackPanel> </Grid></Page>Bind/BindCollection.xaml.cs
/* * 演示如何通过 x:Bind 绑定集合 * * * 如果需要集合数据源在数据添加，删除，更新时对外通知，则需要实现 INotifyCollectionChanged 接口 * CollectionChanged - 集合数据在发生添加，删除，更新时触发的事件 */using System;using System.Collections.ObjectModel;using System.Collections.Specialized;using System.Linq;using Windows.UI.Xaml;using Windows.UI.Xaml.Controls;using Windows10.Common;namespace Windows10.Bind{ public sealed partial class BindCollection : Page { // 数据源 // ObservableCollection<T> 实现了 INotifyCollectionChanged 接口 public ObservableCollection<Employee> Employees { get; set; } = new ObservableCollection<Employee>(TestData.GetEmployees()); public BindCollection() { this.InitializeComponent(); this.Loaded += BindCollection_Loaded; } void BindCollection_Loaded(object sender, RoutedEventArgs e) { // 集合数据在发生添加，删除，更新时触发的事件（源自 INotifyCollectionChanged 接口） Employees.CollectionChanged += Employees_CollectionChanged; } void Employees_CollectionChanged(object sender, NotifyCollectionChangedEventArgs e) { /* * e.Action - 引发此事件的操作类型（NotifyCollectionChangedAction 枚举） * Add, Remove, Replace, Move, Reset * e.OldItems - Remove, Replace, Move 操作时影响的数据列表 * e.OldStartingIndex - Remove, Replace, Move 操作发生处的索引 * e.NewItems - 更改中所涉及的新的数据列表 * e.NewStartingIndex - 更改中所涉及的新的数据列表的发生处的索引 */ } private void btnDelete_Click(object sender, RoutedEventArgs e) { // 此处的通知来自 INotifyCollectionChanged 接口 Employees.RemoveAt(0); } private void btnUpdate_Click(object sender, RoutedEventArgs e) { Random random = new Random(); // 此处的通知来自实现了 INotifyPropertyChanged 接口的 Employee Employees.First().Name = random.Next(1000, 10000).ToString(); // 此处的通知来自 INotifyCollectionChanged 接口 Employees[1] = new Employee() { Name = random.Next(1000, 10000).ToString() }; } }}绑定: 通过 Binding 绑定对象, 通过 x:Bind 绑定对象, 通过 Binding 绑定集合, 通过 x:Bind 绑定集合
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。