Friday, May 22, 2009

Making a 3d spin of an Image in Silverlight 3.0

Hi Friends,

I am with an another intresting feature in Silverlight 3.0. It's the 3 dimensional spin of any container in Silverlight 3

In this example, we are taking an example of an image to be moved in 3-d mode through 3 sliders.

Xaml Code :

<Grid x:Name="LayoutRoot" Background="Transparent">

<Grid x:Name="3dcontainer" Margin="250,160,233,150">
   <Grid.Projection>
       <PlaneProjection x:Name="Muthu"/>
   </Grid.Projection>

<Image x:Name="image" Source="Image1.jpg" Stretch="fill"/>

</Grid>

<StackPanel>

   <Slider x:Name="x" Height="20" Maximum="360" value="{Binding ElementName=Muthu, Path=RotationX, Mode=TwoWay}"/>
   <Slider x:Name="y" Height="20" Maximum="360" value="{Binding ElementName=Muthu, Path=RotationY, Mode=TwoWay}"/>
   <Slider x:Name="z" Height="20" Maximum="360" value="{Binding ElementName=Muthu, Path=RotationZ, Mode=TwoWay}"/>   

</StackPanel>

</Grid>


Output:

On sliding each slider the rotation will happen appropriately! Try out! Very cool feature , that can be utilized for 3-d stuffs.

As per my knowledge, there is a software named ZAM-3d which can create xaml for 3d objects created through it. So that can be placed into a grid in silverlight and using the same concept which I have explained above, we can achieve a 360 degree rotation of items on web.

Soon you can find an video in my personal site fmass.com related to this post!

This is amazing!

Cheers~!
Muthaiah
www.fmass.com

No comments: