These tutorials are helping explain some of the core programming concepts of Silverlight.
We’ll start our SilverlightSample application by selecting the File -> New Project menu item within Visual Studio 2008 or Visual Web Developer 2008 Express (which is free) and use the New Project dialog to create a SilverlightSample (note: you will need to download and install the Silverlight Tools for VS 2008 release to get this support).
We’ll name the project SilverlightSample. When we click the OK button Visual Studio will prompt us with an additional dialog that allows us to choose whether we want to create just a Silverlight Application project, or optionally also add a server-side ASP.NET Web project to our solution to host the Silverlight Application within. For this sample we’ll choose to add an ASP.NET Web Application project to the solution as well and name it SilverlightSample.Web.
When we click OK Visual Studio will create a solution for us that have both a Silverlight client application and an ASP.NET web server application in it.
Right now our SilverlightSample application doesn’t do anything, and when it is run it brings up an empty page. We can change this by opening up the Page.xaml file in the project and adding some content to it.
We’ll begin by changing the background of the grid and by declaring a Button control within it. We’ll give the button an x:Name attribute value of MyButton – which will allow us to programmatically reference it within our code-behind class. We’ll also set its Content, Width and Height properties.
When we run the application our button will then show up in the middle of the page with Push Me content text like below.
To add behavior to our button we can add a Click event handler to it. We can do this in source view by typing the event name.
This will then prompt us for the event handler in our code-behind class to use.
We can then either type a new event handler method name to use, or optionally just press the enter key to name the event handler method using the default naming convention.
This is full code:
<UserControl x:Class=”SilverlightSample.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”>
<Button x:Name=”MyButton” Content=”Push Me!” Width=”100″ Height=”50″ Click=”MyButton_Click”></Button>
</Grid>
</UserControl>
VS will then automatically create a stub event handler implementation in our code-behind class file. We can use this event handler to update the Button’s content with a new message when it is clicked.
This is full code:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace SilverlightSample
{
public partial class Page : UserControl
{
public Page()
{
InitializeComponent();
}
private void MyButton_Click(object sender, RoutedEventArgs e)
{
MyButton.Content = “Pushed”;
}
}
}
After making the change above us can re-run the application and push the button again, and now its content is updated with a Pushed! Message.
Related Posts:
