SilverLight 3D Effects to Images

Blog Author


Published Date

20th September, 2018




  • Share this blog :

Applying 3D effects to the Controls to the Images

To apply the 3D effects in general we use projection class and plane projection class. This plane projection class con not be implemented directly with controls rather we need to implement with container like stock panel or flow layout or grid layout etc. This plane projection class will allow to rotate the given layout in 3 directions s, y, and z

Properties with plane projection class

  • Centre of rotation x
  • Centre of rotation Y
  • Centre of rotation z
  • Rotation X
  • Rotation Y
  • Rotation Z

Centre of rotation X:- This property is used to rotate the  centre in x direction. Centre of rotation Y:-  used to rotate the centre of  the plane in Y direction. Centre of Rotation Z:-  used to rotate the centre of the plane in Z direction.   The values of centre of rotation X, centre of rotation y and centre of rotation Z should be form 0 to 1   Rotation X:  Used to set a value that plane should be rotated in x direction Rotation Y : used to set a value that the plane should be rotated in Y direction er, y – a x is Rotation Z:- Used to set a value that the plane should be rotated in z-axis The values of rotation x, rotation Y and rotation Z should be from 0 to 30

Syntax to Apply  3d Effects to a Plane in Layout

<Layout class> <layout class. Projection> <plane projection centre of rotation X = “value” centre of rotation Y = “value” centre of rotation Z = “value” rotation x= “value” rotation Y= “value” Rotation Z = “value”/> </layout class. Projection> Code to create controls within layout </layout class>

Example with 3d Effects to a Stack Panes

  Create a new silver light application


Go to xaml source of the page


write the following code Screenshot_57   <Grid vi name= <stack panel margin = “60” fill = “gray “> <stack panel. Projection> <plane projection Rotation x = “-20” Rotation Y = “-20” Rotations z = “35”/> </stack panel.Projection> </stack panel>  

Example to  Implement 3D Effects with Images

Go to design create the controls within the stock panel then Run the application and check


Create a new silver light page


go to xaml source. 


write the following code. <Stack panel margin = “60” fill= “gray”> <stack panel. Projector> <plane projection centre off rotation X = 0.9 Rotation Y = “90”/> </stack panel. Projection> </stack panel> Go to design


Go to tool box


double click on Image control


This will create image 1


Select image 1


Go to properties


Go to source property in common category


click on ellipses button


select the required image file to be displayed


click on open


click on ok  


Run the application and check

About Author


Author Bio

TekSlate is the best online training provider in delivering world-class IT skills to individuals and corporates from all parts of the globe. We are proven experts in accumulating every need of an IT skills upgrade aspirant and have delivered excellent services. We aim to bring you all the essentials to learn and master new technologies in the market with our articles, blogs, and videos. Build your career success with us, enhancing most in-demand skills .

Related Blogs

Write For Us