Binding的源與路徑 - KeenLeung－IT工程師數位筆記本

文章出處

1.把控件作為Binding的源

例子：拖動Slider，輸入框中的值也會跟著改變，或在輸入框中輸入數值，滑動條也會自動移動

<Window x:Class="把控件作為Binding源.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <StackPanel>
            <TextBox x:Name="textBox1" Text="{Binding Path=Value,ElementName=slider1,Mode=Default,UpdateSourceTrigger=PropertyChanged}" Margin="5" BorderBrush="Black"></TextBox>
            <Slider x:Name="slider1" Maximum="100" Minimum="0" Margin="5"></Slider>
        </StackPanel>
    </Grid>
</Window>

View Code

2.控制Binding的方向

設置屬性：Mode

3.更新時操作

設置屬性：UpdateSourceTrigger

4.Path路徑

1)前臺與后臺的代碼比較：

前臺：

<Window x:Class="Path路徑.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="279.8" Width="525" Loaded="Window_Loaded">
    <Grid>
        <StackPanel>
            <TextBox x:Name="textBox1" Text="{Binding Path=Value,ElementName=slider1,Mode=Default,UpdateSourceTrigger=PropertyChanged}" BorderBrush="Black" Margin="4"></TextBox>
            <TextBox x:Name="textbox2" BorderBrush="Black" Margin="4" Text="1"></TextBox>
            <Slider x:Name="slider1" Maximum="100" Minimum="0"></Slider>
            
            <TextBox x:Name="textBox3" Margin="5" BorderBrush="Red"></TextBox>
            <TextBox x:Name="textBox4" Text="{Binding Path=Text.Length,ElementName=textBox3,Mode=OneWay}" Margin="5" BorderBrush="Red"></TextBox>
            <TextBox x:Name="textBox6" Margin="5" BorderBrush="Red"></TextBox>

            <TextBox x:Name="textBox7" Margin="5" BorderBrush="Blue"></TextBox>
            <TextBox x:Name="textBox8" Text="{Binding Path=Text[3],ElementName=textBox7,Mode=OneWay}" Margin="5" BorderBrush="Blue"></TextBox>
            <TextBox x:Name="textBox9" Margin="5" BorderBrush="Blue"></TextBox>
        </StackPanel>
    </Grid>
</Window>

View Code

后臺：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace Path路徑
{
    /// <summary>
    /// MainWindow.xaml 的交互邏輯
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            Binding binding = new Binding() { Path = new PropertyPath("Value"), Source = this.slider1 };
            this.textbox2.SetBinding(TextBox.TextProperty, binding);

            this.textBox6.SetBinding(TextBox.TextProperty, new Binding("Text.Length") { Source = this.textBox3, Mode = BindingMode.OneWay });

            this.textBox9.SetBinding(TextBox.TextProperty, new Binding("Text[3]") { Source = this.textBox7, Mode = BindingMode.OneWay });
        }
    }
}

View Code

截圖：

2)斜線語法

第一個例子：

XAML:

<Window x:Class="Path路徑.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window1" Height="124.176" Width="300" Loaded="Window_Loaded">
    <Grid>
        <StackPanel>
            <TextBox x:Name="textBox1" Margin="5" BorderBrush="Blue"></TextBox>
            <TextBox x:Name="textBox2" Margin="5" BorderBrush="Blue"></TextBox>
            <TextBox x:Name="textBox3" Margin="5" BorderBrush="Blue"></TextBox>
        </StackPanel>
    </Grid>
</Window>

View Code

C#:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;

namespace Path路徑
{
    /// <summary>
    /// 當使用一個集合或者DataView作為Binding的源時,如果想把它的默認元素當作Path使用，需要以下的語法
    /// </summary>
    public partial class Window1 : Window
    {
        public Window1()
        {
            InitializeComponent();
        }

        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            List<string> stringList = new List<string>() { "Tomi", "Tim", "Blogog" };
            this.textBox1.SetBinding(TextBox.TextProperty, new Binding("/") { Source = stringList });
            this.textBox2.SetBinding(TextBox.TextProperty, new Binding("/Length") { Source = stringList, Mode = BindingMode.OneWay });
            this.textBox3.SetBinding(TextBox.TextProperty, new Binding("/[2]") { Source = stringList, Mode = BindingMode.OneWay });
        }
    }
}

View Code

截圖：

第二個例子：

XAML:

<Window x:Class="Path路徑.Window2"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window2" Height="121.978" Width="300" Loaded="Window_Loaded">
    <Grid>
        <StackPanel>
            <TextBox x:Name="textBox1" Margin="5" BorderBrush="Blue"></TextBox>
            <TextBox x:Name="textBox2" Margin="5" BorderBrush="Blue"></TextBox>
            <TextBox x:Name="textBox3" Margin="5" BorderBrush="Blue"></TextBox>
        </StackPanel>
    </Grid>
</Window>

View Code

C#:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;

namespace Path路徑
{
    /// <summary>
    /// 如果集合元素的屬性仍然是一個集合時，使用多斜線語法
    /// </summary>
    public partial class Window2 : Window
    {
        public Window2()
        {
            InitializeComponent();
        }

        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            List<Country> countryList = new List<Country>(){
                new Country(){
                    Name = "中國",
                    ProvinceList = new List<Province>(){
                        new Province(){
                            Name = "四川",
                            CityList = new List<City>(){
                                new City(){
                                    Name = "成都"
                                }
                            }
                        }
                    }
                }
            };

            this.textBox1.SetBinding(TextBox.TextProperty, new Binding("/Name") { Source = countryList });
            this.textBox2.SetBinding(TextBox.TextProperty, new Binding("/ProvinceList/Name") { Source = countryList });
            this.textBox3.SetBinding(TextBox.TextProperty, new Binding("ProvinceList/CityList/Name") { Source = countryList });
        }
    }
}