7

Glen GordonDeveloper Evangelist, Microsofthttp://blogs.msdn.com/glengordon@glengordon

Building Windows Phone 7 Apps with Silverlight

Agenda Silverlight Momentum Development Experience Phone Controls Web Browser Control App Bar Navigation Launchers and Choosers Application Lifecycle

Silverlight Momentum

Silverlight 1September 2007

Silverlight 2October 2008

Silverlight 1September 2007

Silverlight 3July 2009

Silverlight 1September 2007

Silverlight 2October 2008

Silverlight 1September 2007

Silverlight 2October 2008

Silverlight 3July 2009

Silverlight 4April 2010

• Business Applications• Media• Beyond the Browser

Silverlight 4

RIAStats.com

60%

225%

Simplyhired.com

Development Experience

Common Base Class Library

Collections ComponentModel Configuration

DiagnosticsReflection IO

Security Threading

Runtime Resources Globalization TextLocation Net

ServiceModel Linq

Application Object

Silverlight Presentation and Media

XNA Frameworks for Games

Windows Phone Frameworks

NavigationShapes Markup Media

Controls Drawing IsolatedStorage

AudioMedia GraphicsInput

Drawing GamerServices

Content

PhoneApplicationPage

PushNotification

WebBrowserControl

SensorsPhoneApplicationFra

me

CameraDevice

IntegrationLaunchers &

ChoosersWindows Phone

Controls

Windows Phone 7 Framework

Graphics Composition

App Bar

SIP

App PageStart

Experience

Incoming Call

System TrayNotification

Volume

Direct3D Surface

Shell frame composes all UI into a single screen

Central page management enables cross app UI transitions and other effects

You can also do this for orientation changes

Phone applicationProvides UI represented as XAML pages connected into cross-app flows by URI’s

UI Model: Familiar Web Concepts

Web applicationProvide media represented as HTTP resources linked by URL’s

Shell frameRequests pages, renders UI, and handles navigation across apps

Sessions and back stackGroups together sequences of pages corresponding to a user’s activity across apps

Web browserRequests HTTP resources, renders them, and handles navigation across sites

History and tabsGroups together sequences of HTTP resources corresponding to a user’s activity across sites

Phone Controls

Silverlight Controls Rich Set of Controls Familiar Additional features

For example, Software Input Panel (SIP) support on TextBox

16

Supported Border Button Canvas CheckBox Grid HyperlinkButton Image ListBox

MediaElement Messagebox ProgressBar RadioButton ScrollViewer TextBlock TextBox WebBrowser

Controls support Touch Mouse Events

Automatically converted for you SIP and WebBrowser control have gestures

ScrollViewer Just like Silverlight Basic Flick and Pan gestures

Raw Touch.FrameRendered DoodlePad – Sketch App

Controls support Touch Gestures

System level (WM_GESTURE). Can make your own.

Tap, Double Tap, Pan, Flick, Touch and Hold Multi-Touch

Pinch, Stretch Manipulations

Events ManipulationStarted ManipulationData ManipulationCompleted

Use for Drag and Drop, etc.

DEMO – Controls

List Application Master/Detail Data

MainPage.Xaml, DetailsPage.xaml

ViewModel ItemViewModel.cs, MainViewModel.cs

Project Types VS2010 calls it List Application and Blend

calls it Databound Application

DEMO – List Application

WebBrowser control

23

Displays network and local content

Gestures: pan, double tap and pinch

Supports transforms & projections No Input on transform

Application can interact with JavaScript

Optimized for privacy Script is disabled by default Cookies and cache are isolated

Silverlight to Script

function runScriptStuff(arg1, arg2){ return “awesome”; }

string fromScript = wb.InvokeScript("runScriptStuff", arg1, arg2);

Silverlight

JavaScript

Script to Silverlight

Window.external.Notify(string);

void wb_ScriptNotify(object s, NotifyEventArgs e){ string fromScript = e.Value;}

Silverlight

JavaScript

DEMO – Web Browser

AppBar Toolbar

Up to 4 icons Can set transparency level Slide up Menu can display more items

Can declare in code or XAML

Icons found under Program Files\Microsoft SDKs\Windows Phone\v7.0\Icons

DEMO – AppBar

Frame and Page Frame

Top-level container control PhoneApplicationFrame class Contains the page control and

system elements such as system tray and application bar

Page Fills the entire content region of

the frame PhoneApplicationPage-derived

class Optionally surfaces its own

application bar Handles Orientation NavigatedTo and

NavigatedFrom

Page Navigation Forward

NavigationService.Navigate(new Uri(“/Page2.xaml”,uriKind.RelativeOrAbsolute));

Back NavigationService.GoBack();

Hardware Back Button Handle BackKeyPress, OnBackKeyPress

and Navigate to where you would like

DEMO – Navigation

Tasks - Launchers and Choosers Launcher

Launches one of the built-in applications through which a user completes a task

No data is returned to calling application Example: PhoneCallTask

Chooser Launches one of the built-in applications through which

a user completes a task, and which returns some data to calling application

When caller completes, calling application is activated and supplied with the Chooser result

Example: PhotoChooserTask

Launchers & ChoosersLaunchers EmailComposeTask MarketplaceDetailTask MarketplaceHubTask MarketplaceReviewTas

k MarketplaceSearchTas

k MediaPlayerLauncher PhoneCallTask SearchTask SMSComposeTask WebBrowserTask

Choosers CameraCaptureTask EmailAddressChooserT

ask PhoneNumberChooser

Task PhotoChooserTask SaveEmailAddressTask SavePhoneNumberTas

k

DEMO – Tasks

App Lifecycle Close

Back Button Tombstoned

Start Button Task Launched Phone call received

Handle events in App.xaml.cs

App State - Storage Isolated Storage

Settings and Custom Data Secure and Sandboxed Logical Folder Structure via APIs No quota currently

Be responsible and inform/empower user State Management

PhoneApplicationPage/PhoneApplicationState

Good for transient data

Isolated Storage APIUsing System.IO;using System.IO.IsolatedStorage;

IsolatedStoragefile isf = IsolatedStorageFile.GetUserStoreForApplication();

IsolatedStorageFileStream fs = new IsolatedStorageFileStream(“myfile.txt”,FileMode.Open,isf);

StreamReader sr = new StreamReader(fs);

data=sr.ReadLine();

sr.Close();

DEMO – Lifecycle

© 2010 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.

The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation.

MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.