WPF 元素绑定
1.什么是数据绑定
数据绑定是一种关系,WPF程序从源对象中提取一些信息,并根据这些信息设置目标对象的属性,目标属性作为依赖项属性。源对象可以是任何内容,可以是另一个wpf内容,甚至是自行创建的纯数据对象。
2.简单的单绑定
将一个元素绑定到另一个元素,第一个例子,是将将一个Slider控件和TextBlock控件绑定。ElementName表示源对象的名字,Path表示源元素的属性。需要使用花括号括起来。
<Grid> <Slider Name="sliderFontSize" Margin="3" Minimum="1" Maximum="40" Value="10" TickFrequency="1" TickPlacement="TopLeft"> </Slider> <TextBlock Margin="10,39,10,62" Text="Simple Text" Name="lblSampleText" FontSize="{Binding ElementName=sliderFontSize,Path=Value}"<!--Binding关键字将slider和textblock绑定--> </TextBlock> </Grid>
3.绑定模式
在单绑定的基础上添加3个按钮,对应特定的预设值,点击按钮,是字体变为设定的预设值大小。
<Grid> <Slider Name="sliderFontSize" Margin="3" Minimum="1" Maximum="40" Value="10" TickFrequency="1" TickPlacement="TopLeft"> </Slider> <TextBlock Margin="10,39,10,177" Text="Simple Text" Name="lblSampleText" FontSize="{Binding ElementName=sliderFontSize,Path=Value}"> </TextBlock> <Button x:Name="small" Content="Set to Small" HorizontalAlignment="Left" Margin="93,182,0,0" VerticalAlignment="Top" Width="97" Click="small_Click"/> <Button x:Name="normal" Content="Set to Normal" HorizontalAlignment="Left" Margin="203,182,0,0" VerticalAlignment="Top" Width="105" Click="normal_Click"/> <Button x:Name="large" Content="Set to Large" HorizontalAlignment="Left" Margin="321,182,0,0" VerticalAlignment="Top" Width="85" Click="large_Click"/> </Grid>
点Set to small会触发click事件,执行以下代码。将sliderfontsize的值设定为10,对应的textblock也会有相应的文字大小。
private void small_Click(object sender, RoutedEventArgs e) { sliderFontSize.Value = 10; lblSampleText.FontSize= 10;//错误 }
注:不能设置textblock中lblSampleText的值,这样只会改变文本框中的大小,并不能影响绑定过的slider的值。
双向绑定(TwoWay):在这个例子中,也存在一种方式,强制在2个方向传递数值,从目标到源,从源到目标。方法是设置Binding的Mode属性
FontSize="{Binding ElementName=sliderFontSize,Path=Value,Mode=TwoWay}"
绑定模式共5种,见下表:
名称 | 说明 |
OneWay | 源变化,目标变化 |
TwoWay | 源和目标互相影响 |
OneTime | 最初根据源属性值设置目标,其后所有操作不改变目标属性 |
OneWayToSource | 与OneWay相反,目标变化更新源 |
Default | 即可双向(用户可设定如Textbox.text属性)又可以单向 |
也可使用代码创建绑定:
Binding binding = new Binding(); binding.Source = SliderFontSize; binding.Path = new PropertyPath("value"); binding.Mode = BindingMode.TwoWay;
lbSampleTextb.SetBinding(Textblock.FontSize,binding);
4.多绑定
可以是将多个源共同作用到一个目标对象上,也可以是一个源,影响多个目标对象。此处例子为,多个源作用到一个textblock对象上,影响textblock文本的显示内容、大小
颜色3个属性。
<Grid Margin="5"> <Grid.RowDefinitions> <RowDefinition Height="Auto"></RowDefinition> <RowDefinition Height="Auto"></RowDefinition> <RowDefinition Height="Auto"></RowDefinition> <RowDefinition Height="Auto"></RowDefinition> <RowDefinition></RowDefinition> </Grid.RowDefinitions> <Slider Name="sliderFontSize" Margin="3" Minimum="1" Maximum="40" Value="10"></Slider> <TextBox Name="txtContent" Margin="3" Grid.Row="2">Sample Content</TextBox> <ListBox Margin="3" Grid.Row="3" Name="lstColors"> <ListBoxItem Tag="Blue">Blue</ListBoxItem> <ListBoxItem Tag="DarkBlue">Dark Blue</ListBoxItem> <ListBoxItem Tag="LightBlue">Light Blue</ListBoxItem> </ListBox> <TextBlock Margin="3" Name="lblSampleText" FontSize="{Binding ElementName=sliderFontSize,Path=Value}" Grid.Row="4"<!--d大小属性和滑块绑定--> Text="{Binding ElementName=txtContent,Path=Text}"<!--内容和textbox绑定--> Foreground="{Binding ElementName=lstColors,Path=SelectedItem.Tag}"<!--颜色和listbox绑定,在listbox中选择颜色> ></TextBlock> </Grid>
还可以通过改变绑定模式,将Binding.Mode改为TwoWay,双向绑定具有极大的灵活性,使目标对象反过来影响源对象的属性。