In Proceedings of the 7th ACM SIGGRAPH international Conference on Virtual-Reality Continuum and Its Applications in industry (Singapore, December 08-09, 2008). The main effect in this article consists of taking 8 images at the same position, they can be seen in design time overlapping each other. One can easily see why the image rotates as seen. Moving the RY Slider will revolve the image around the (cylindrical) surface of the tilted drum. The image that is stuck to the cylindrical surface of the drum will lean forward. The drum in Figure 2 will tilt forward towards the user, that is the top circular surface will come towards the viewer and the bottom circular surface will move away from the viewer. Move the RX slider from its left end position by a small amount. Reset the RY slider back to its starting position. Moving the RY Slider will revolve the image on the surface of the drum. Move the CZ slider a bit, this will push the image on the Z axis by some amount say ' a'Ī drum as shown in Figure 2 needs to be imagined now.Moving the RZ slider corresponds to RotationZ.Moving the RY slider corresponds to RotationY.Moving the RX slider corresponds to RotationX.Moving the CZ slider corresponds to moving the CenterOfRotationZ.For this, I use the image (Figure 3) and the sliders provided on the right part of the application as shown below: Note: These values are angles in degrees. The Curve Y (see Figure 2) rotation action corresponds to changing the RotationY property and the Curve X (see Figure 2) rotation action corresponds to changing the RotationX property of the image. Note: The point of intersection of the image and the Z axis is the center of the image. Finally the same description for curve Z. The same thing will happen, if the X axis is held and rotated (curve X), this rotation is similar when a Bike's accelerator is rotated to speed up the bike. Doing so will rotate the drum about the Y axis and the image that is stuck to the cylindrical surface of the drum revolves along with drum. Now imagine holding the Y axis and rotating it like holding a screwdriver (curve Y). Once CenterOfRotationZ is assigned, one should imagine a drum as shown in Figure 2 where the radius of the drum is CenterOfRotationZ. We will start with trying to understanding the CenterOfRotationZ property.įrom Figure 2, it is evident what this means, the distance the image is from the centre of the XYZ axis. In this article, the projection is assigned to a PlaneProjection object, this object does all the perspective 3-D rendering, for our purposes we will deal with CenterOfRotationZ, RotationX, RotationY, RotationZ properties. In Silverlight, every object of a class derived from UIElement has an important property called Projection. The right side of the application has one thumb nail that helps in understanding the effect in depth. There are sliders provided that can speed up or slow down the revolving of the thumb nails, change the axis of revolution and bring the revolving thumb nails closer or farther from the viewer. When the user passes the mouse over any of the revolving thumbnails, the animation stops and sets the current thumb nail as the background of the application. The application consists of a main page with a revolving carousel of thumbnails. The reader must be reasonably familiar with programming in Silverlight and basic 3-dimensinal geometry and a bit about Storyboards. This article digs deep into the intricacies of the geometry involved in coding such a effect. This animation has been the forte of tools like flash and dojo for a very long time, but with the entry of Microsoft Silverlight, it no longer remains a mystery. This article explains how to code the carousel animation effect in Silverlight.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |