Element to Element Binding in Silverlight

Silverlight allows binding of UI element properties. This is one of very useful feature provided by silverlight. This is not a big topic to cover but you guys can use this post as a reference because you may forget the syntax very often.

In this example I have two slider controls which will change the width and height of a image  control.

 

<Slider x:Name="SliderWidth" 
                MaxWidth="400" MaxHeight="300" 
                Grid.Row="0" Maximum="400" Value="100" />
        <Slider x:Name="SliderHeight" 
                MaxWidth="400" MaxHeight="300" 
                Grid.Row="1" SmallChange="1" 
                Value="100" Maximum="300" />
        <Image Grid.Row="2" Source="/Slv-ElementBinding;component/Images/Pallipuram%203.jpg" 
               Width="{Binding Value, ElementName=SliderWidth}" 
               Height="{Binding Value, ElementName=SliderHeight}" Stretch="Fill" />

In the above picture you can see the value property of slider control is binding with the width property of image control.  So whenever you change the slider control the image width get changed according to the value of the slider.

You can find the source code here.

Happy coding guys…