WPF之数据元素绑定

WPF之数据元素绑定

元素绑定，可以去掉传统的事件驱动的方式去改变值

一 传统事件驱动的方式去改变值

        <StackPanel Orientation="Vertical" Margin="10">
            <Slider x:Name="slider" Minimum="9" Maximum="64" Value="16" TickPlacement="BottomRight" Margin="10" ValueChanged="slider_ValueChanged"/>
            <TextBlock x:Name="tbInfo" Text="xxxxx" FontSize="16" Margin="10"/>
        </StackPanel>

     private void slider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
     {
         double value = slider.Value;
         if (tbInfo!=null)
         {
             tbInfo.FontSize = value;

         }
     }

二 数据元素绑定

确定好谁是目标，谁是源
谁是目标，谁创建Binding
ElementName和Path确定源

<Window x:Class="WpfApp3.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp3"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <StackPanel Orientation="Vertical" Margin="10">
            <Slider x:Name="slider" Minimum="1" Maximum="64" Value="12" TickPlacement="BottomRight" Margin="10" ValueChanged="slider_ValueChanged"/>
            <TextBlock x:Name="tbInfo" Text="xxxxx" FontSize="{Binding ElementName=slider ,Path=Value}" Margin="10"/>
        </StackPanel>

    </Grid>
</Window>

绑定模式

触发更新方式

        <StackPanel Orientation="Vertical" Margin="10">
            <Slider x:Name="slider" Minimum="1" Maximum="64" Value="12" TickPlacement="BottomRight" Margin="10"/>
            <TextBlock x:Name="tbInfo" Text="xxxxx" FontSize="{Binding ElementName=slider ,Path=Value}" Margin="10"/>
            <TextBox Margin="20" Height="20" Text="{Binding ElementName=tbInfo,Path=FontSize,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>
        </StackPanel>

绑定非元素对象，静态资源等

<Window x:Class="WpfApp3.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp3"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Window.Resources>
        <FontFamily x:Key="CustomFont">Calibri</FontFamily>
    </Window.Resources>
    <Grid>
        <StackPanel Orientation="Vertical" Margin="10">
            <Slider x:Name="slider" Minimum="1" Maximum="64" Value="12" TickPlacement="BottomRight" Margin="10"/>
            <TextBlock x:Name="tbInfo" Text="xxxxx" FontSize="{Binding ElementName=slider ,Path=Value}" Margin="10"/>
            <TextBox Margin="20" Height="20" Text="{Binding ElementName=tbInfo,Path=FontSize,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>
            <TextBlock Margin="10" Text="{Binding Source={x:Static SystemFonts.IconFontFamily},Path=Source}"/>
        </StackPanel>

    </Grid>
</Window>

相对资源

我们进行Bingding时，如果明确知道数据源的Name，就能用Source或者ElementName进行绑定，但是有时候我们需要绑定的数据源可能没有明确的Name，此时我们就需要利用Bingding的RelativeSource进行绑定，这种办法的意思是指当前元素和绑定源的位置关系。

AncestorType 获取或设置要查找的上级节点的类型

<Window x:Class="WpfApp3.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp3"
        mc:Ignorable="d"
        Title="MainWindow999" Height="450" Width="800">
    <Window.Resources>
        <FontFamily x:Key="CustomFont">Major</FontFamily>
    </Window.Resources>
    <Grid>
        <StackPanel Orientation="Vertical" Margin="10">
            <Slider x:Name="slider" Minimum="1" Maximum="64" Value="12" TickPlacement="BottomRight" Margin="10"/>
            <TextBlock x:Name="tbInfo" Text="xxxxx" FontSize="{Binding ElementName=slider ,Path=Value}" Margin="10"/>
            <TextBox Margin="20" Height="20" Text="{Binding ElementName=tbInfo,Path=FontSize,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>
            <!--静态对象-->
            <TextBlock Margin="10" Text="{Binding Source={x:Static SystemFonts.IconFontFamily},Path=Source}"/>
            <!--静态资源-->
            <TextBlock Margin="10" Text="{Binding Source={StaticResource CustomFont},Path=Source}"/>
            <!--相对资源FindAncestor往上找 -->
            <TextBlock Margin="10" Text="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type Window}},Path=Title}"/>
            <!--绑定自己-->
            <TextBlock Margin="10" Text="{Binding RelativeSource={RelativeSource Mode=Self},Path=FontSize}"/>

        </StackPanel>

    </Grid>
</Window>

DataContext

<Window x:Class="WpfApp3.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp3"
        mc:Ignorable="d"
        Title="MainWindow999" Height="450" Width="800">
    <Window.Resources>
        <FontFamily x:Key="CustomFont">Major</FontFamily>
    </Window.Resources>
    <Grid>
        <StackPanel Orientation="Vertical" Margin="10" DataContext="{x:Static  SystemFonts.IconFontFamily}">
            <Slider x:Name="slider" Minimum="1" Maximum="64" Value="12" TickPlacement="BottomRight" Margin="10"/>
            <TextBlock x:Name="tbInfo" Text="xxxxx" FontSize="{Binding ElementName=slider ,Path=Value}" Margin="10"/>
            <TextBox Margin="20" Height="20" Text="{Binding ElementName=tbInfo,Path=FontSize,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>
            <!--静态对象-->
            <TextBlock Margin="10" Text="{Binding Source={x:Static SystemFonts.IconFontFamily},Path=Source}"/>
            <!--静态资源-->
            <TextBlock Margin="10" Text="{Binding Source={StaticResource CustomFont},Path=Source}"/>
            <!--相对资源FindAncestor往上找 -->
            <TextBlock Margin="10" Text="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type Window}},Path=Title}"/>
            <!--绑定自己-->
            <TextBlock Margin="10" Text="{Binding RelativeSource={RelativeSource Mode=Self},Path=FontSize}"/>
            <!--DataContext-->
            <TextBlock Margin="10" Text="{Binding Source={x:Static SystemFonts.IconFontFamily},Path=Source}"/>
            <TextBlock Margin="10" Text="{Binding Source={x:Static SystemFonts.IconFontFamily},Path=FamilyNames}"/>
            <TextBlock Margin="10" Text="{Binding Source={x:Static SystemFonts.IconFontFamily},Path=LineSpacing}"/>

            <TextBlock Margin="10" Text="{Binding Path=Source}"/>
            <TextBlock Margin="10" Text="{Binding Path=FamilyNames}"/>
            <TextBlock Margin="10" Text="{Binding Path=LineSpacing}"/>

        </StackPanel>

    </Grid>
</Window>

---

绑定到非元素对象

绑定系统静态资源

<TextBlock Margin="10" Text="{Binding Source=x:static SystemFonts,IconFontFamily},Path=Source}"

CommandParameter="{Binding RelativeSource={RelativeSource FindAncestor,AncestorType={x:Type Window}}}"

FindAncestor AncestorType={x:Type Window}寻找到Window类型的类

查找类型
Self ：自己
FindAncestor：父元素
PreviousData ：表达式绑定到数据绑定列表中的前一个数据项。在列表项中会使用这种式
TemplateParent：表达式绑定到应用模板的元素。只有当绑定位于控件模板或数据模板内部时，这种模式才能工作

绑定相对资源

<Button Style="{StaticResource WindowHeaderBtnStyle}" Height="30" Width="44" Content="&#xe699;"
       Name="btn_Max" Click="btn_Max_Click"
       CommandParameter="{Binding RelativeSource={RelativeSource FindAncestor,AncestorType={x:Type Window}}}"
       Visibility="{Binding RelativeSource={RelativeSource AncestorType=UserControl},Path=MaxVis}" />