59
Developing Apps for Nokia Developing Apps for Nokia Windows Phone Windows Phone Raj Lal Raj Lal Senior Engineer, Nokia Level: Intermediate

Developing Apps for Nokia Windows Phone VSLiv Conference May 15, 2012 @iRajLal

  • Upload
    raj-lal

  • View
    2.918

  • Download
    2

Embed Size (px)

DESCRIPTION

Learn to develop Mobile Apps for Nokia Windows Phone Lumia. See what's unique about the Nokia Windows Phone also known as the "First Real Windows Phone". Create some snazzy graphics and animation using XAML. The session with Live Demo on Nokia Windows Phone Lumia. You will learn: Windows Phone Development on Nokia Phone Key features of Nokia Windows Phone Lumia See a working demo with advanced graphics

Citation preview

Page 1: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Developing Apps for Nokia Developing Apps for Nokia Windows PhoneWindows Phone

Raj LalRaj LalSenior Engineer, Nokia

Level: Intermediate

Page 2: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

AgendaAgenda

1. Key Features of Nokia Lumia

2. Windows Phone 7

3. Developing Apps for Lumia

– Creating a VSLive Event App

Page 3: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

KeyKey Features Features of of Nokia Lumia Nokia Lumia

Page 4: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Nokia Lumia 900 Nokia Lumia 900

Page 5: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Key FeaturesKey Features

LTE

1.4 GHz

4.3” AMOLED

Hotspot

Carl Zeiss 8FM

HD 720p

VibrantColors

CPU

Page 6: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Windows Phone Windows Phone on Lumiaon Lumia

Page 7: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal
Page 8: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Key FeaturesKey Features

Metro

LocalBing

Social

NokiaDriveZune

Video ChatVoice

Page 9: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

DevelopingDeveloping AppsAppsfor Lumia for Lumia

Page 10: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Two Choices Two Choices **

* * You can have You can have both in a single Appboth in a single App

Page 11: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Two Choices *Two Choices *

Silverlight XNANews, Utility Game, Animations

Event-driven apps High-performance apps

Use controls Use contents and assets

RIA style Interface 2D/3D Interface

Embed Video / Browser Seamless Interface

Data driven Image/ driven

* * You can have You can have both in a single Appboth in a single App

Page 12: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Silverlight AppSilverlight App

Page 13: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Silverlight AppSilverlight App

3 Main layout Types3 Main layout Types

Page 14: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Single Screen Panorama PivotUtility App Events, Restaurant App News App

RIA Style Heterogeneous list of data

List of similar data

Quick tool Display data, images, videos

Display data with date

At-a-glance view is important

Personalization is important

Performance is important

3 Main Layout Types3 Main Layout Types

Page 15: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Developing a Developing a VSLive Event App VSLive Event App

Page 16: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

VSLive Event AppVSLive Event App

1. Event

2. Speakers

3. Sessions

4. Location

5. My Schedule

Page 17: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Panorama Panorama

Page 18: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

3 Step in developing VSLive App3 Step in developing VSLive App

Page 19: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

1. Design 1. Design

Page 20: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal
Page 21: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Step 1: Designing VSLive AppStep 1: Designing VSLive App

Application Icon

BackgroundTile Icon Splash Screen

Page 22: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Map Icon

Step 1: Designing VSLive AppStep 1: Designing VSLive App

Add / Cancel

Create a Schedule

Page 23: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Step 1: Designing VSLive AppStep 1: Designing VSLive App

Panorama Background

Page 24: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Step 1: Designing the UIStep 1: Designing the UI

• Event Page

• Speakers, Sessions

• Map

• Schedules

Page 25: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Event Page Event Page

Page 26: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Event Screen: CodeEvent Screen: Code

Page 27: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Event ScreensEvent Screens

Page 28: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Event Screen: CodeEvent Screen: Code

Page 29: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Map ScreensMap Screens

Page 30: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Map Main Page: CodeMap Main Page: Code

Page 31: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Map : CodeMap : Code

MapView.SetView(Location, 12); MapPushpin.Location = Event.Location;

Page 32: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Create a Schedule Screen(s)Create a Schedule Screen(s)

Page 33: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Schedule Main Page: CodeSchedule Main Page: Code

Page 34: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Schedule Add Page: CodeSchedule Add Page: Code

Page 35: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

2. Data2. Data

Page 36: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Step 2: Getting the DataStep 2: Getting the Data

Page 37: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Step 2: Getting the Static DataStep 2: Getting the Static Data

Page 38: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Create an Event Object

Page 39: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Load Event Data from XML

Page 40: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Load Event Data from XML

using System.Xml.Linq;

Page 41: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Bind Event to App

Text="{Binding Path=Event.Name}"…Event.CityEvent.Location…

IN XAML

Page 42: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Step 2: Getting Dynamic DataStep 2: Getting Dynamic Data

Schedules•Load Schedules•Save Schedules

Page 43: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal
Page 44: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Step 2: Getting Dynamic DataStep 2: Getting Dynamic Data

IsolatedStorageFile file = IsolatedStorageFile.GetUserStoreForApplication()

IsolatedStorageFileStream stream = new IsolatedStorageFileStream("schedules.dat", System.IO.FileMode.OpenOrCreate, file)

Initialize Isolated Storage

Page 45: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Step 2: Getting Dynamic DataStep 2: Getting Dynamic Data

Load Schedules

DataContractSerializer serializer = new DataContractSerializer(typeof(ObservableCollection<Schedule>)); Event.Schedules = serializer.ReadObject(stream) as ObservableCollection<Schedule>;

Page 46: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Step 2: Getting Dynamic DataStep 2: Getting Dynamic Data

Save Schedules

DataContractSerializer serializer = new DataContractSerializer(typeof(ObservableCollection<Schedule>)); serializer.WriteObject(stream, Event.Schedules);

Page 47: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Step 2: Getting Resource DataStep 2: Getting Resource Data

Resource

•Creating a Resource File

•Bind

•Use Resource

Page 48: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Creating a Resource FileCreating a Resource File

Page 49: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Binding Resource FileBinding Resource File

public class LocalizedStrings{ public LocalizedStrings() {}

private static vsliveapp.AppResources _ localizedResources = new _ vsliveapp.AppResources();

public vsliveapp.AppResources _ LocalizedResources { get {return localizedResources; } }}

Page 50: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Using the ResourceUsing the Resource

Text="{Binding Path=LocalizedResources.Title}”

…LocalizedResources.HeaderDescriptionLocalizedResources.LocationWeb…

IN XAML

Page 51: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

3. Method3. Method

Page 52: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Step 3: Using Panorama TemplateStep 3: Using Panorama Template

• Create the Panorama UI

• Creates the Main ViewModel

• Creates the Item ViewModel

• Instantiate ViewModel in App.cs

• Creates a DataContext

DataContext = App.ViewModel;

Page 53: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal
Page 54: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Step 3: Creating View ModelsStep 3: Creating View Models

ViewModels

•MainViewModel

•Item ViewModels

• EventData

• Schedules

• Sessions

Page 55: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Step 3: MainViewModelStep 3: MainViewModel

Page 56: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Creating View Models: SchedulesCreating View Models: Schedules

Page 57: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Demo on Demo on Lumia 900Lumia 900

Page 58: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

XNA AppXNA App

Advanced XNA Games for Windows Phone - Brian Peek 05/16/12  1:30pm - 2:45pm

Page 59: Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal

Thank YouThank You

Raj LalRaj Lal

Twitter @ iRajLal