We’ll use lots of controls when creating Silverlight applications. These controls make development more funnier. After a fair familarity of Silverlight, this article will teach you to apply Button control to a simple Silverlight application. The effect can be displayed in the demo(FireFox only).
Of course we need to have already installed Visual Studio 2008 or Visual Web Developer 2008 and deployed Silverlight 3 development environment, as the passage How to deploy the development environment for Silverlight3 says. In this sample I adopt Visual Web Developer 2008 Express Edition. Are you ready to start? Follow me, go!
First, open VWD, click File -> New Project, a New Project dialog will come out for you to choose what you want to create. Here, we choose Visual C# as the type of project in the left column then Silverlight Application in the right. The project name and its location have been set default value, you can change them if you like.
Then the MainPage.xaml panel shows up. Change the codes as the following pic shows. These codes are between the <Button> and </Button> tag. They define a button named myButton, with its width, height, content and other properties being set.
Press F5 to start debugging. If there is no errors, the project will run, or come out error prompts. This is the page effect when successfully running:
◇Tips: Sometimes one may fail to start by pressing F5 and the program points out that The page cannot be run in debug mode because debugging is not enabled in the Web.config file, and the Silverlight debugging package hasn’t been installed. To solve this problem, one is to press Ctrl + F5 to run without debugging, the other is reinstall the relevant Silverlight 3 Tools. Here is the download address: http://www.microsoft.com/Downloads/details.aspx?familyid=9442B0F2-7465-417A-88F3-5E7B5409E9DD&displaylang=en
Next we’ll add a Click event activated by clicking the button. Just add one row like the pic below:
And then right-click the new row, choose Navigate to Event Handler in the menu.
The MainPage.xaml.cs shows up and you find a blank function called myButton_Click. Add one row of code.
Press F5 to run. You’ll see the effect displayed in the demo at the start of this passage.
