Get yourself started with Silverlight (ASP.NET with VB.NET scripting)
by ShahSilverlight is the big thing right now, esp. in usable animated display (I stress on the word “usable,” - think in the line of DeepZoom) in replacing AJAX and working alongside AJAX (there was a time when one would have said “payback is a bitch.” Now, it’s “postback is a bitch.”) and of course to finally get over with the awful ways of mixing the layout design and the scripting development thanks to XAML.
There are plenty of Getting Started with Silverlight out there. Most of them are in C#. So, I’m going to do things in VB.NET because it reminds me of good ole’ college days.
First, you need to know what XAML and Canvas mean.
XAML is pronounced a cute way (Zammel.) Who knows? If XAML becomes a standard thanks to the WPF/E, I might get my daughter to be to named Zammel. Anyway, XAML is XML based of course, and it is meant to define the user interface. It describes the controls and properties as well as relationships to one another.
A canvas is like an overlay whereby controls and objects are put inside and positioned. Once you’ve your canva which contains all your controls among other stuff, you only need to position it onto your page and voila! No more going to and fro to edit HTML when adding controls.
So, what are the tools I’m going to use to get you started?
- Fully updated MS. Visual Studio 2K8 with ASP.NET 3.5 and VB.NET
- Silverlight 2.0b2 runtime
- Silverlight 2.0b SDK
So, let’s get things going, shall we?
Fire up VS.NET. Click File-> New Project. Go for Silverlight Application.
Now, check out your Solution Explorer. You’ll have Default.aspx, your aspx and html files for the silverlight application, web.config (of course,) among other things but more important of them are the scripts.
Open up Page.xaml
The contents of the XAML file are as follows:
<UserControl x:Class=”YOUR_APP_NAME_WHATEVER_IT_IS.page”
xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation”
xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml”
Width=”400″ Height=”300″>
<Grid x:Name=”LayoutRoot” Background=”White”></Grid>
</UserControl>
Now, let’s add piece of text, a text box and a button inside the canvas.
Add a Canvas within the grid using the <Canvas> </Canvas> tags.
A textbox (like a label) is added (”Enter your name.”) A text box (txtName) with added.
A button named goatsebutton is added.
Another textblock (txtSayGoatse) is added below the button.
@ those feeling offended by the Goatse - Oh, loosen up, will ya?! Goatse is part of internet culture!
<UserControl x:Class=”YOUR_APP_NAME_WHATEVER_IT_IS.page”
xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation”
xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml”
Width=”400″ Height=”300″><Grid x:Name=”LayoutRoot” Background=”White”>
<Canvas>
<TextBlock Text=”Enter your name” Canvas.Left=”25″ Canvas.Top=”50″/>
<TextBox x:Name=”txtName” Canvas.Left=”150″ Canvas.Top=”50″ Height=”20″ Width=”100″/>
<Button x:Name=”goatsebutton” Canvas.Left=”120″ Canvas.Top=”105″ Width=”100″ Content=”Goatse Me!” Click=”goatsebutton_Click”/>
<TextBlock x:Name=”txtSayGoatse” Canvas.Left=”100″ Canvas.Top=”150″/>
</Canvas>
</Grid>
</UserControl>
See, you can add any component within the canvas. Cool, isn’t it?
Now, it’s time to open Page.xaml.vb It’s time to get the Goatse clicking button work. LOL
Partial Public Class Page
Inherits UserControlPublic Sub New()
InitializeComponent()
End Sub
Private Sub goatsebutton_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)Me.txtSayGoatse.Text = Me.txtName.Text & ” has been Goasted. Ha ha!”
End Sub
End Class
When someone clicks the button, the name entered should be displayed below along with the text “has been Goasted. Ha ha!”
Now, save the application. Run (Debug) it. Or, if you’re confident enough, run it without debugging (CTRL+F5).
If you right click on the page loaded, you’ll see Silverlight Configuration.
Now, let’s goatse someone. What about goatsing Michael? (He’s a bad wraith hybrid in Stargate Atlantis. He deserves it LOL.)
Enter the name in the text box and press the button.
LOL
Sure, this is just the beginning. I believe this is all you need - understanding the canvas and xaml. The rest is just scripting and SQL (if you’re dealing with data and if you’re not using LINQ and using SQL Server for e.g instead, write the SQL there, not on the page.) You need to try integrating Silverlight in your apps (even if it’s for fun.)
Get on with playing with Silverlight.
————
The wp theme isn’t designed for bloquoting codes. Nevermind, I’ll change it later. Sorry for any inconvenience related to the display of images and codes. Here is app.zip, the source codes. 
Read more here