Silverlight 2.0 元素資料繫結 (element data binding)

在 WPF 中，我們可以直接做兩個控制項之間的屬性資料繫結，例如:

<Slider x:Name="slider1"
Minimum="0" Maximum="100" SmallChange="1" LargeChange="10"
/>

<TextBox VerticalAlignment="Top" Canvas.Top="50"
Width="{Binding Path=Value, ElementName=slider1}"
Height="40"
/>

這樣就可以讓 TextBox 的寬度隨著 slider 而改變。##ReadMore##

但是在 Silverlight 中不支援 ElementName 的設定，所以就沒辦法直接這樣做資料繫結，不過我們可以做一個靜態資源，然後將 slider 和 textbox 都繫結到該靜態資源中，來達到一樣的效果。

首先要先建立一個類別並實作 INotifyPropertyChanged 介面:

public class ElementBinding : INotifyPropertyChanged
{
double val;

public double Value
{
get { return val; }
set { val = value; OnPropertyChanged("Value"); }
}

public event PropertyChangedEventHandler PropertyChanged;

protected virtual void OnPropertyChanged(string propName)
{
if (PropertyChanged != null)
PropertyChanged(this, new PropertyChangedEventArgs(propName));
}
}

然後在 XAML 檔的 UserControl 元素中加入屬性:

xmlns:u="clr-namespace:PropertyBinding;assembly=PropertyBinding"

再加上 Resource 定義:

<UserControl.Resources>
<u:ElementBinding x:Key="abc" Value="100" />
</UserControl.Resources>

Binding 設定:

<Slider x:Name="theSlider"
Minimum="0" Maximum="100" SmallChange="1" LargeChange="10"
Value="{Binding Value, Mode=TwoWay, Source={StaticResource abc}}"
/>

<TextBox VerticalAlignment="Top" Canvas.Top="50"
Width="{Binding Value, Mode=TwoWay, Source={StaticResource abc}}"
Height="40"
/>

這樣就可以了。