WPF(五)元素绑定
数据绑定是一种关系,WPF从一个源对象提取一些信息,并使用这些信息设置目标对象的属性。
1.将元素绑定到一起
例如:滑块的拖动,改变TextBlock字体的大小,如果不采用元素绑定,需要为Silder控件添加ValueChanged事件。下面的示例是简单的元素绑定。
<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}"> </TextBlock> <Button Content="Set to Small" HorizontalAlignment="Left" Margin="36,149,0,0" VerticalAlignment="Top" Width="97"/> <Button Content="Set to Normal" HorizontalAlignment="Left" Margin="146,149,0,0" VerticalAlignment="Top" Width="105"/> <Button Content="Set to Large" HorizontalAlignment="Left" Margin="264,149,0,0" VerticalAlignment="Top" Width="85"/> </Grid>
2.多绑定:
<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" Text="{Binding ElementName=txtContent,Path=Text}" Foreground="{Binding ElementName=lstColors,Path=SelectedItem.Tag}" ></TextBlock> </Grid>
双向绑定:
<Grid> <Grid.RowDefinitions> <RowDefinition Height="Auto"></RowDefinition> <RowDefinition Height="*"></RowDefinition> <RowDefinition Height="Auto"></RowDefinition> <RowDefinition /> </Grid.RowDefinitions> <Slider Name="sliderFontSize" Margin="3" Minimum="1" Maximum="40" Value="10" TickFrequency="1" IsSnapToTickEnabled="True" TickPlacement="TopLeft"></Slider> <TextBlock Grid.Row="1" Text="Simple Text" Margin="10" Name="lblSampleText" FontSize="{Binding ElementName=sliderFontSize,Path=Value,Mode=TwoWay}" ></TextBlock> <StackPanel Orientation="Horizontal" Margin="5" Grid.Row="2"> <TextBlock VerticalAlignment="Center" xml:space="preserve">Exact Size:</TextBlock> <TextBox Text="{Binding ElementName=lblSampleText, Path=FontSize, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}" Width="100"></TextBox> </StackPanel> </Grid>