WP7 Element Binding samples

published on: 2/16/2011 | Views: N/A | Tags: Binding

by WindowsPhoneGeek

In this post I am going to talk about Elemen Binding in Silverlight for Windows Phone 7.

What is Element Binding?

Silverlight for Windows Phone 7 data binding enables you to create bindings that allow you to create a linkage between XAML elements. This is called Element Binding.

Basically you use element binding when you want to bind to another element’s property. It’s really useful when you want to connect two objects so that when one object changes the other changes as well. To use element binding, you can specify the ElementName as part of the binding syntax :

                                                           Text="{Binding TargetValue, ElementName = TargetElementName}"

                                                           or

                                                           Text="{Binding ElementName = TargetElementName, Path = TargetValue}"

Where Text is a sample dependency property.

When you set ElementName property, the specified value must refer to an element in one of the following locations:

• The current XAML namescope.

• The XAML namescope of the templated parent if the binding target is in a data template or control template.

Because of this restriction, you cannot use the ElementName property to bind to elements that are not created by using XAML. To bind to elements created programmatically, use the Source property instead.

Source , RelativeSource, and ElementName are mutually exclusive in a binding. If you have set one of these attributes, then setting either of the other two in a binding (through XAML or through code) will cause an exception.

Examples

Example1: Binding to TextBox Text property.

<TextBox x:Name="textBox"/>
<TextBlock Text="{Binding Text, ElementName=textBox}"/>

Example2: Binding to Slider Value property

<Slider Minimum="20" Maximum="100" x:Name="slider"/>
<TextBlock Text="{Binding Value, ElementName=slider}"/>

 Example3: Binding to a custom  DependencyProperty of the current page.

<Button Content="Change DP Value" Click="Button_Click"/>
<Rectangle Height="200" Width="100" Fill="{Binding Test, ElementName=myPage}"/>

public static readonly DependencyProperty TestProperty = DependencyProperty.RegisterAttached(
  "Test",
  typeof(SolidColorBrush),
  typeof(MainPage),
 new PropertyMetadata(new SolidColorBrush(Colors.Red)));

    public SolidColorBrush Test
    {
        get { return (SolidColorBrush)GetValue(TestProperty); }
        set { SetValue(TestProperty, value); }
    }
 
    public MainPage()
    {
        InitializeComponent();
    }

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        this.Test = new SolidColorBrush(Colors.Green);
    }
}

You can find the source code here.

I hope that the tip was helpful.

You can also follow us on Twitter @winphonegeek

Comments

Add comment to 'WP7 Element Binding samples'

Title Your Name

Comment