Introduction - First Windows Phone Application (1.2)

Hello

use "Silverlight for Windows Phone" template and create a new "Windows Phone Application" project via Visual Studio 2010 and name it "SilverlightHelloPhone" which is also the namespace

Application Zipped (use Firefox in case of error)

WMAppManifest.xml

• Title attribute- the name of the application as  presented to the use

ApplicationIcon.png - icon of the application

App.xaml.cs - code behind

• All silverlight application has an App class which inherit Application. It handles tasks like startup \ shutdown 
• Note that it is partial class, its definition continued in App.xaml 
• App class create one object type PhoneApplicationFrame  (only one object can exist). This frame is 480x800 pixels and occupy the entire display of the phone. It behaves somewhat like web browser by navigating to an object type MainPage which inherits PhoneApplicationPage.  PhoneApplicationFrame can have many instances type  PhoneApplicationPage but can host only one at a time

 App.xaml - XAML file

• used for resources which are used by the application : brushes,color,...
• Note that this XAML notation implied that class App derive from Application (root element) and thus continued definition of class SilverlightHelloPhoneApp from App.xaml.cs
• xmlns means XML namespace

• http://schemas.microsoft.com/winfx/2006/xaml/presentation - standard Silverlight namespace use to locate e.g. Application class
• http://schemas.microsoft.com/winfx/2006/xaml/presentation - namespace related to the XAML. x is used in x:Class 

App.g.cs -another partial definition of App class generated file . reside under obj directory


MainPage.xaml - XAML file

• definition of class MainPage
•  x:Class="SilverlightHelloPhone.MainPage - definition of the class, inherit PhoneApplicationPage
• next four xmlns are the same as in App.xaml

•  xmlns:d="http://schemas.microsoft.com/expression/blend/2008" - d stand for designer. 
• xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" - mc stand for markup compatibility 
• mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768" - ignore  DesignWidth and  DesignHeight during compilation. (why is it needed ?)
•  FontFamily,FontSize,Foreground : relate to the whole of the page
• SupportedOrientations : orientation supported by the page
•  shell:SystemTray.IsVisible="True" - enable view of  the status bar at the top of the phone 

• The body of MainPage.xaml is a visual tree of elements : Grid,StackPanel,TextBlock -  All of them are Silverlight classes with markup representation . Play with remarking of these elements and see the change of the page in the designer . 

 MainPage.xaml.cs - code behind

• definition of class MainPage 

MainPage.g.cs - another partial definition of  MainPage class generated file . reside under obj directory

Our application looks visually as follolws :

• PhoneApplicationFrame

• PhoneApplicationPage

• Grid name  LayoutRoot

•  StackPanel name TitlePanel

• TextBlock name ApplicationTitle
• TextBlock name PageTitle 

• Grid name ContentPanel 

Remarks

• Notice that i have used the word element. In Silverlight it has two meanings :

• It's an XML term used to indicate item delimited by start tag and end tag
• It's a visual object e.g. TextBox 

Exercise

• Add a TextBlock with "Hello" inside the content Grid. Do it twice, once by drag drop textBlock and once by editing the xaml file. make sure it is centered
• Change the content of ApplicationTitle and PageTitle

Color Themes

• it is possible to change theme by going from the phone Start, click the right arrow on the top, Setting , then choose theme. it is possible to choose Background between Dark\Light and Accent color between 10 colors - Colors list

• this will result as follows

Points and Pixels

• All dimensions in Silverlight are in pixels. e.g. font size of 36 means 36 pixels

XAP

• Under bin\Debug reside SilverlightHelloPhone.xap which is the file used for phone deployment.
• Rename to .zip and you will be able to unzip it and see it's content (it has not exe file, why?) :

Nathan