Thursday, March 19, 2009

Silverlight 3 : Lap around Silverlight 3 Beta 1 : Part -1

You must have seen my yesterday’s article about Silverlight 3, Now from today I am going to explore more on Silverlight 3, offcourse as and when required I may still blog on Silverlight 2 since it might take some time to move you directly on Silverlight 3.

Silverlight 3 Beta 1 SDK, Runtime and Tools for Visual Studio installation is very smooth, While installation, it does not ask me to uninstall my Silverlight 2, Small Conclusion I drawn : Silverlight 2 and 3 Beta 1 right now going parallel. I am looking into Architectural part and covered most of the Silverlight CoreCLR architecture in my last article, For Silverlight 3 Beta 1 I found some new things :

sllauncher.exe at Program Files\Microsoft Silverlight\3.0.40307.0 and SlSvcUtil.exe at Program Files\Microsoft SDKs\Silverlight\v3.0\Tools , I will talk about these in more details in my upcoming articles. One thing to note, Silverlight 3 Beta 1 and Blend 2 not going hand in hand, When I tried so, it shown me “Invalid XAML”.

Once you installed all Silverlight 3 Beta 1 components successfully, You can now start programming it in Visual Studio.

NewProjectSL3

“Silverlight Navigation Application” is new template you can see. Some controls you will also find new, check this out :

SL3Controls 

So, many more things to talk about..so I will cover all stuff part by part so you can learn->Implement->Enjoy !! Silverlight 3 exprience. So to start with some Practical thing I am touching the new 3D support aspect of Silverlight 3.

3D in Silverlight 3 Beta 1 :

Tools Require :

  • Silverlight 3 Beta 1 SDK
  • Silverlight 3 Beta 1 Tools for Visual Studio 2008 [Offcourse with SP of VS and .NET 3.5 Framework]

Step 1 : Open Visual Studio 2008, go to File->New->Project and then choose Silverlight Application

Step 2 : Let me first tell you, there is nothing like 3D control etc., 3D in silverlight is mainly achieve by “Plane Projection” class under System.Windows.Media namespace. [ System.Windows.dll Assembly and there is no mapped XMLNS for xaml ]

Xaml :

<Grid x:Name="LayoutRoot" Background="White">
       <StackPanel Height="200" Width="300" Background="IndianRed" x:Name="MyStack">
           <StackPanel.Projection>
               <PlaneProjection
                   RotationX="0"
                   RotationY="0"
                   RotationZ="0"
                   />
           </StackPanel.Projection>
           <MediaElement Source="Bear.wmv" Height="200" Width="200" />
       </StackPanel>
       <StackPanel Margin="10,40,0,0">
           <TextBlock Margin="230,0,0,0">X:</TextBlock>
           <Slider Margin="10,-20,0,0" x:Name="Slider1" Maximum="360" Minimum="-360" Width="300"  ValueChanged="Slider1_ValueChanged"/>
           <TextBlock Margin="230,10,0,-15">Y:</TextBlock>
           <Slider Margin="10,-5,0,10" x:Name="Slider2" Maximum="360" Minimum="-360" Width="300" ValueChanged="Slider2_ValueChanged" />
           <TextBlock Margin="230,0,10,0">Z:</TextBlock>
           <Slider Margin="10,-20,0,0" x:Name="Slider3" Maximum="360" Minimum="-360" Width="300" ValueChanged="Slider3_ValueChanged"/>
       </StackPanel>
   </Grid>

*Note : In Silverlight 3 Beta 1, you will find Page.xaml now as “MainPage.xaml” with corresponding code behind file. Rest all looks same as it was in Silverlight 2.

C# Code :

using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;

namespace SL_3D_Demo
{
    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            InitializeComponent();          
        }

        private void Slider1_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
            ((PlaneProjection)MyStack.Projection).RotationX = e.NewValue;
        }

        private void Slider2_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
            ((PlaneProjection)MyStack.Projection).RotationY = e.NewValue;
        }

        private void Slider3_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
        {
            ((PlaneProjection)MyStack.Projection).RotationZ = e.NewValue;
        }
    }
}

Output :

Flip 3D

Something about Plane Projection :

Simple definition of Plane Projection given by Silverlight 3 docs is :

Represents a perspective transform (a 3-D-like effect) on an object.

Plane Projection Class gives you certain Methods and Properties, Plane Projection helps you to set orientation across X,Y and Z axis with properties like RotationX,Y and Z respectively and no wonder, all of them do take negative values. Basically now UIElement have property as Projection. You can even set the Center of Rotation with CenterOfRotationX,Y and Z property respectively. To know more details about Plane Projection, I encourage you to get hold of Silverlight 3 Beta 1 docs [chm file].

I know, few days back I spend many sleepless nights to get working that kit3D for implementing 3D in Silverlight 2, but I guess now we all should thank Microsoft for making this happen in Silverlight 3 and with great ease.

Hope by this small step towards Silverlight 3 must have given you idea what is the future of Silverlight Technology, many more things to come now, and yes as usual I will try my best to tell you those by making as simple as I can, so that you can start working on it. So go ahead and Download early bits of Silverlight 3 Beta 1, meanwhile I will get ready with my Part 2 of this Lap around article.

Vikram.

1 comment:

shoban said...

Thanks for the article. That was pretty quick :)