Introduction To Silverlight in ASP.Net

Introduction

Silverlight is a web-based technology that allows web designers and web developers to explore the boundaries of web application development. It is an integration of rich user interface of desktop applications, where we use the HTML and JavaScript web languages. Silverlight helps in building web applications that contain high-fidelity multimedia content and eye catching visual effects.

Architecture of Silverlight

Architecture of Silverlight

We will make a simple Silverlight application in Visual Studio 10. Open Visual Studio 10.

Create a New Project by pressing Ctrl + Shift + N, under C# go to Silverlight and choose Silverlight application. Name it Silverlight_demo.

Silverlight Application

This is your mainpage.xaml page where you will write your design code. It is very similar to a default .aspx page where we write design code in ASP.NET.

mainpage

These are the main default files that exist when you create a new project.

main default files

This is your mainpage.xaml page code.

  1. <UserControl x:Class="SilverlightApplication4.MainPage"  
  2.     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
  3.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
  4.     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"  
  5.     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"  
  6.     mc:Ignorable="d"  
  7.     d:DesignHeight="300" d:DesignWidth="400">  
  8.   
  9.     <Grid x:Name="LayoutRoot" Background="White">  
  10.         <TextBox Height="60" HorizontalAlignment="Left" Margin="28,104,0,0" Name="textBox1" Text="Welcome here for getting Silverlight"  VerticalAlignment="Top" Width="343" FontWeight="Bold" Background="#FF89FF89" Foreground="#FF1847D1" Padding="12" FontSize="15" />  
  11.     </Grid>  
  12. </UserControl>  
The design will look like the following:
 
Welcome here for getting Silverlight

Now open your MainPage.Xaml.cs page to make some server-side code for your textblock. Add your code after the InitializeComponent() in the constructor.
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Net;  
  5. using System.Windows;  
  6. using System.Windows.Controls;  
  7. using System.Windows.Documents;  
  8. using System.Windows.Input;  
  9. using System.Windows.Media;  
  10. using System.Windows.Media.Animation;  
  11. using System.Windows.Shapes;  
  12.   
  13. namespace SilverlightApplication4  
  14. {  
  15.     public partial class MainPage : UserControl  
  16.     {  
  17.         public MainPage()  
  18.         {  
  19.             // default constructor  
  20.             InitializeComponent();  
  21.             // we will add our textblock code here :  
  22.   
  23.             TextBlock txtn = new TextBlock()  
  24.             {  
  25.   
  26.                 Name = "textBox1",  
  27.                 Text = "Welcome here for Getting Silverlight",  
  28.                 Foreground = new SolidColorBrush(Colors.Blue),  

  29.             };  
  30.   
  31.         }  
  32.     }  
  33. }  
By pressing F5 you will get your output something like the following:

Silverlight

Thank you for reading, Have a nice day! I hope you will like this.

Next Recommended Readings