Tutorials » Silverlight tutorials »

Getting started with XAML tags

This chapter gives an introduction to the XAML tags in Silverlight applications.

Let us add a xaml tag to your Page.xaml file and see how it works.

Open page.xaml file from your Visual Studio project and place the following code within the Grid element:

<Rectangle Fill="Blue" Width="100" Height="100"/>

Now compile and run the application. You can see a blue rectangle displayed in your web page.

As demonstrated above, the elements in a Silverlight xaml page are declared using XAML tags. Silverlight 2 offers several XAML tags including common form tags like textbox, button etc and various other UI elements like rectangle.

One nice thing about Visual studio is, it will show you a preview of the page as you type the xaml tags. When you complete typing the above xaml tags in your .xaml page, you will see the design preview in Visual Studio as shown below:

You can swap the position of the code and preview by pressing the icon with 2 arrows in the middle of the screen (between the tabs "XAML" and "Design". Also, you can use the icons on the right end between the code and design panes to change the position of the code pane and design preview.

Next Chapter: How to place a Silverlight control in a web page ?
Previous Chapter: Page.xaml file
More Chapters: Silverlight Tutorials
More Tutorials: Tutorial Index

Top Contributors
TodayLast 7 Daysmore...

Awards & Gifts

Online Members

Copyright © SpiderWorks Technologies Pvt Ltd., Kochi, India