Silverlight for Windows Phone 7

Erick Kurniawan, M.Kom, MCTS, MCPD, MCT erick@actual-training.com http://actual-trraining.com

Agenda

• Project and Solution

• Debugging Program

• Orientation Page

• Pages and Navigation

• Displaying List Of Data & Data Binding

Windows Phone App Frameworks

Silverlight for Windows Phone

• Silverlight

– Same base class libraries

– Modification for performance

– Hardware Integration

– Operating System Integration

– Phone-specific APIs

– Out of browser model

• In browser Silverlight is not supported

XAML and Silverlight

• A Silverlight application is made up of pages that contain elements

• These have properties that determine where they are, how they appear and what they can do in an application

• The Visual Studio tool allows us to manipulate the page content by using the design surface and the element properties pane

Why do we need XAML?

• XAML allows us to separate the role of

graphic designer and programmer

– The designer should not have to see code

objects to work

– The programmer should not be held back while

the design is produced

• The XMAL file provides a separation between

the code that drives the application and the

way the application looks

XAML file content

• This snippet of XAML is the description of the

firstNumberTextBox

• It contains fields that describe the position

and size of the textbox

<TextBox Height="72" HorizontalAlignment="Left" Margin="8,19,0,0" Name="firstNumberTextBox" Text="0" VerticalAlignment="Top" Width="460" TextAlignment="Center" />

Windows Phone Solutions

• A Silverlight Windows

Phone solution only

contains a single project

• This contains all the images

used for the icons on the

phone

• It also uses all the Windows

Phone references

Windows Phone Versions

• The new version of Windows Phone 7.5

– The previous (original) version was 7

• The operating system and SDK that Windows

Phone 7.5 is based on is numbered 7.1

The XAP File

• The XAP file is a container that holds everything needed to run the application

• It is a Zip archive with a manifest that describes its contents

Running the XAP file

• When you press the “run” button in Visual Studio

the XAP file is copied to the target device

• The device opens the archive, reads the manifest

file and starts the application running

• The XAP file is also the file that is sent to a

customer who buys the program in Windows

Marketplace

HOL Create Silverlight Project

Windows Phone Orientation

• Unlike a desktop device, users will can use a

Windows Phone in either orientation

– Portrait orientation – stood up

– Landscape orientation – laid on side

• Some applications work best in particular

orientations

• We might want to show off, and make an

application that works in either

Orientation Warning

• Handling multiple orientations is hard work

• It is at least twice as difficult as one orientation

– You need to design the screen twice

– You then have to add the orientation change management

• Many applications only work in one orientation

– Including the Windows Phone Start Screen

• So consider this issue carefully

Allowing multiple orientations private void PhoneApplicationPage_OrientationChanged( object sender, OrientationChangedEventArgs e) { if (e.Orientation == PageOrientation.PortraitUp) { setPortrait(); } else { setLandscape(); } }

• This method runs when the orientation changes and calls the appropriate setting method

Setting Landscape Mode private void setLandscape() { firstNumberTextBox.Margin = new Thickness(8,19,0,0); firstNumberTextBox.Width = 207; secondNumberTextBox.Margin = new Thickness(252,19,0,0); secondNumberTextBox.Width = 207; plusTextBlock.Margin = new Thickness(221,35,0,0); resultTextBlock.Margin = new Thickness(538,35,0,0); }

• This method configures the display for

landscape mode

• The Thickness value contains four elements

The StackPanel container

• A StackPanel contains a number of other text

elements and stacks them up on the screen

• We don‟t have to explicitly position them, the

StackPanel does this for us

• A StackPanel can arrange things across or

down the screen

• We can nest StackPanel elements inside other

StackPanels to create complex layouts

Changing Orientation

HOL

19

Page Navigation

• The NavigationService object performs

navigation for an application

• Each Silverlight page has a Uri

• The Navigate method takes the user to the

specified page

private void page2Button_Click(object sender, RoutedEventArgs e) { NavigationService.Navigate( new Uri("/CustomerDetailPage.xaml", UriKind.RelativeOrAbsolute)); }

Pages and Navigation

HOL

21

Data Binding

• This is a very important subject

• It provides a coupling between the data in a

program and the user interface

• It removes the need to write “glue” logic to

link program data to display elements

• It can work in two ways

– „One-way‟

– „Two-way‟

List and Data Binding

HOL

23

Reference

• http://www.microsoft.com/download/en/detai

ls.aspx?id=1678

• http://nice.or.id/curriculums/