本例演示如何将数据模型的实例绑定到界面控件。
XAML代码如下:
<Page x:Class="WpfApp.Page1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:WpfApp"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800"
Title="Page1-Binding to Product Object">
<Grid Background="LightGreen">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<!-- Row 1-->
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<TextBlock Margin="7">Product ID:</TextBlock>
<TextBox Name="txtID" Margin="5" Grid.Column="1">356</TextBox>
<Button x:Name="cmdGetProduct" Click="cmdGetProduct_Click" Margin="5" Padding="2" Grid.Column="2">Get Product</Button>
</Grid>
<!-- Row 2-->
<Border Grid.Row="1" Padding="7" Margin="7" Background="LightSteelBlue">
<Grid Name="gridProductDetails">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<TextBlock Margin="7">Model Number:</TextBlock>
<TextBox Margin="5" Grid.Column="1" Text="{Binding Path=ModelNumber}"></TextBox>
<TextBlock Margin="7" Grid.Row="1">Model Name:</TextBlock>
<TextBox Margin="5" Grid.Row="1" Grid.Column="1" Text="{Binding Path=ModelName}"></TextBox>
<TextBlock Margin="7" Grid.Row="2">Unit Cost:</TextBlock>
<TextBox Margin="5" Grid.Row="2" Grid.Column="1" Text="{Binding Path=UnitCost}"></TextBox>
<TextBlock Margin="7,7,7,0" Grid.Row="3">Description:</TextBlock>
<TextBox Margin="7" Grid.Row="4" Grid.Column="0" Grid.ColumnSpan="2"
VerticalScrollBarVisibility="Visible" TextWrapping="Wrap" Text="{Binding Path=Description}"></TextBox>
</Grid>
</Border>
</Grid>
</Page>
后台代码:
/// <summary>
/// Page1.xaml 的交互逻辑
/// </summary>
public partial class Page1 : Page
{
public Page1()
{
InitializeComponent();
}
private void cmdGetProduct_Click(object sender, RoutedEventArgs e)
{
int ID;
if (Int32.TryParse(txtID.Text, out ID))
{
try
{
//绑定到数据源
gridProductDetails.DataContext = App.StoreDb.GetProduct(ID);
}
catch (Exception)
{
MessageBox.Show("Error contacting database.");
}
}
else
{
MessageBox.Show("Invalid ID.");
}
}
}
分析:
实现主要方式是从数据查询数据,返回一个数据模型对象,将对象绑定到Grid,也即使代码:
gridProductDetails.DataContext = App.StoreDb.GetProduct(ID);
Grid内的文本控件都可以绑定到模型对象的属性字段,如:
<TextBox Margin="5" Grid.Column="1" Text="{Binding Path=ModelNumber}"></TextBox>
将文本绑定到模型的ModelNumber属性字段,当输入不同ID,获取的不同的对象时,这些绑定文本跟随动态变化。
效果如下:
不同ID查询的对象不同,绑定的属性值也就不同。