WPF元素的绑定

一、两个元素的简单绑

    WPF元素的绑定，是指将两个控件绑在一起，比如利用滑动条Slider，改变刻度时，相应的标签元素中的字体的大小就会增加。

    

    这种元素的绑定，要知道谁是目标元素，谁是源元素。比如用滑动条的刻度大小去绑定标签元素中的字体的大小。这里面滑动条的刻度就是源元素，标签字体大小就是目标元素。

    

    在标签元素中字体大小的属性中就可以去直接绑定，绑定语句是：

       FontSize="{Binding ElementName=slider1,Path=Value}

    解释：Binding ElementName需要绑定的元素的名称，Path需要绑定元素的属性

 

完整的代码

<Window x:Class="BandingWPF.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window1" Height="560" Width="522.5">
    <Grid>
        <StackPanel HorizontalAlignment="Left" Height="388" Margin="53,31,0,0" VerticalAlignment="Top" Width="373" >
            <Slider Name="slider1" HorizontalAlignment="Left" Margin="10" VerticalAlignment="Top" Height="24" Width="353" Maximum="40" Value="10" TickPlacement="TopLeft" TickFrequency="1" />
            <TextBlock Width="Auto" Name="textBlock1" HorizontalAlignment="Left" Margin="10" TextWrapping="Wrap" Text="TextBlock11" VerticalAlignment="Top"  FontSize="{Binding ElementName=slider1,Path=Value}" />
        </StackPanel>

    </Grid>
</Window>

效果

二、多个元素的绑定

    接着上面的例子，再添加一个文本框元素；当滑动块滑动的时候不仅仅改变标签元素的字体大小，还会在文本框元素中显示字体的具体大小；当直接在文本框元素中输入字体大小的时，标签框的字体大小也会发生相应变化。

    

    上面的简单例子中实现的仅仅是源元素改变目标元素，而这个例子增加了目标元素改变源元素，目标元素就是文本框的内容，而源元素就是标签的字体大小。如果是目标元素改变源元素，需要再绑定语句中增加一个属性“UpdateSourceTrigger=PropertyChanged”；

 完整代码

<Window x:Class="BandingWPF.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window1" Height="587.5" Width="440">
    <Grid >
        <StackPanel HorizontalAlignment="Left" Height="388" Margin="10" VerticalAlignment="Top" Width="Auto" >
            <Slider Name="slider1" HorizontalAlignment="Left" Margin="10" VerticalAlignment="Top" Height="24" Width="353" Maximum="40" Value="10" TickPlacement="TopLeft" TickFrequency="1" />
            <TextBlock Width="Auto" Name="textBlock1" HorizontalAlignment="Left" Margin="10" TextWrapping="Wrap" Text="TextBlock11" VerticalAlignment="Top"  FontSize="{Binding ElementName=slider1,Path=Value}" />
            <TextBox Height="23"  TextWrapping="Wrap" Text="{Binding ElementName=textBlock1,Path=FontSize,UpdateSourceTrigger=PropertyChanged}" />
        </StackPanel>

    </Grid>
</Window>

总结

    WPF元素的绑定，算是一个小应用，其实还可以拓展到通过选择颜色去修改字体的颜色等等。