Earlier this year, I wrote about Silverlight 3’s new element data binding feature, which enables XAML elements to be bound together declaratively. I also bemoaned the fact that the target of an element-to-element data binding had to be a Framework-element derivative. Good news! Silverlight 4 fixes this by extending element data binding to DependencyObject derivatives.
My Silverlight 3 element data binding sample was built from the following XAML:
<Grid x_Name=”LayoutRoot” Background=”White”>
<Border>
<Border.Projection>
<PlaneProjection x_Name=”Projector” />
</Border.Projection>
<user:PenguinUserControl />
</Border>
<StackPanel Orientation=”Vertical” VerticalAlignment=”Top”>
<Slider Minimum=”0″ Maximum=”360″
Value=”{Binding RotationX, ElementName=Projector, Mode=TwoWay}”
Width=”400″ VerticalAlignment=”Top” Margin=”0,20,0,0″ />
<Slider Minimum=”0″ Maximum=”360″
Value=”{Binding RotationY, ElementName=Projector, Mode=TwoWay}”
Width=”400″ VerticalAlignment=”Top” Margin=”0,20,0,0″ />
<Slider Minimum=”0″ Maximum=”360″
Value=”{Binding RotationZ, ElementName=Projector, Mode=TwoWay}”
Width=”400″ VerticalAlignment=”Top” Margin=”0,20,0,0″ />
</StackPanel>
</Grid>
The result was a penguin that could be rotated about the X, Y, and Z axes using Sliders:
When I wrote this demo, I wanted to attach the {Binding} expressions to the PlaneProjection, not the Slider controls. But Silverlight 3 didn’t allow this because PlaneProjection isn’t a FrameworkElement. My recourse was to apply the bindings to the Sliders themselves and to use 2-way bindings to sync the Sliders’ Value properties with the PlaneProjection’s RotationX, RotationY, and RotationZ properties.
Such shenanigans are no longer necessary in Silverlight 4, which supports the following syntax:
<Grid x_Name=”LayoutRoot” Background=”White”>
<user:PenguinUserControl>
<user:PenguinUserControl.Projection>
<PlaneProjection
RotationX=”{Binding Value, ElementName=SliderX}”
RotationY=”{Binding Value, ElementName=SliderY}”
RotationZ=”{Binding Value, ElementName=SliderZ}” />
</user:PenguinUserControl.Projection>
</user:PenguinUserControl>
<StackPanel Orientation=”Vertical” VerticalAlignment=”Top”>
<Slider x_Name=”SliderX” Minimum=”0″ Maximum=”360″ Width=”400″
VerticalAlignment=”Top” Margin=”0,20,0,0″ />
<Slider x_Name=”SliderY” Minimum=”0″ Maximum=”360″ Width=”400″
VerticalAlignment=”Top” Margin=”0,20,0,0″ />
<Slider x_Name=”SliderZ” Minimum=”0″ Maximum=”360″ Width=”400″
VerticalAlignment=”Top” Margin=”0,20,0,0″ />
<
p class=”MsoNormal”> </StackPanel>
</Grid>
Also note that you can now apply a PlaneProjection directly to a user control. Silverlight 3 didn’t support this, which explains why in the Silverlight 3 version of this demo, I enclosed the user control in a Border and applied the PlaneProjection to the Border. This is yet another new feature of Silverlight 4 that further narrows the gap between Silverlight and WPF.