Developing Multi Targetting Win8 & WP8 Apps.Jose Luis LatorreSenior Developer, Accenture UI Lead Developer, Roche Diagnosticsjoslat@gmail.com - @joslat http://silverlightguy.com

Agenda

Agenda

The importance of Multi Targeting5’

ABC of Multi Targeting 10’MVVM 5’Creating our Multi Targeting App25’ Creating the Multi Targeting “base application” Getting data from the web Using a shared user control

Summarizing + Q & A 5’

The Importance of Multi TargetingIt is important. that’s why you are here, right?

.NET

C#, VB

Windows Phone 7.x

Direct3D, XAudio2, MF,

WASAPI, WIN32, COM

C++

Windows Phone APIWindows Phone 8

Windows Phone

Runtime

C#, VB, C++

Your appsYour way

Windows Phone 8 Developer Platform

XAML Apps Direct3D Apps

XAML Maps Geolocation Sensors In-App Purchase Direct3D

HTML XML Threading Touch Speech XAudio2

Phone Features Push Camera Video Proximity Media

Foundation

Calendar Wallet Contacts Core Types VoIP STL

Multitasking Live Tiles Memory Async Enterprise CRT

C# and VB C#, VB, and C++ C++

File system, Networking, Graphics, Media

Core Operating System

Investment in Windows Runtime API

NetworkingProximityIn-App PurchaseSensorsLocationFile SystemCore app modelThreading

11,000 members

2,800 shared

members

Good Reasons for Multi Targetting..

ABC of Multi TargetingLet’s see the main points on how to do it right, the first time.

Best practices & Patterns

• Share code across platforms using Portable Class Libraries

• Share resources and code, whenever possible

• Apply MVVM to wire cross-platform apps• Create portable abstractions for non-

portable functionality• Use Service Locator and IoC container to hook up the implementations.• Other patterns apply as well, like Repository.

Best practices & Patterns

• Link Source code files between platforms.

• Whenever the implementation is equal or very similar.• Use compiler directives for jumping over the light differences.

• Create platform specific Views• To maximize the user experience in the UI

• Share UI with user controls • But only if it doesn’t reduce the user experience

• Always Decouple! Create Clean & SOLID Code.

• And remember fundamental OOP principles, KISS & DRY.• Avoid STUPID code.

web services

portable class library

Creating a Portable Class Library

One SourceOne ProjectOne Binary

Multiple Platforms!

Portable Class Libraries

Common StructureWindows 8 Windows Phone

8

“Add as Link”

“Add as Link”Windows 8 Windows Phone 8

#if Conditional BlocksWindows 8#if NETFX_COREDispatcher.RunAsync(CoreDispatcherPriority.Normal, () => {#endif

#if WINDOWS_PHONEDeployment.Current.Dispatcher.BeginInvoke(() => {#endif

Windows Phone 8

public class ServiceLocator

{

public static IFileStorage FileStorage { get; set; }

public static IPhotoChooser PhotoChooser { get; set; }

}

Simple service locator

MVVMIt deserves its own section on this XAML world.

Separate UI from app logic

User Interface

App Logic

General Model-View-ViewModel (MVVM)

Model-View-ViewModel (MVVM)

ViewsHow to display informationWritten in XAML

View ModelsWhat information to displayFlow of interaction

ModelsData objectsBusiness logicEtc.

Model

View Model

View Platform-specific

PortableReferences

Databinds

MVVM Cross-platform app architecture

Startup

Views

Windows Store App

Platform specific functionality

View Models

Models

Portable Class Library

Platform functionality abstractions

Startup

Views

Windows Phone App

Platform specific functionality

Reference Reference

Creating our Multi Targeting AppWe will see how to create a Windows Store & Windows Phone App that share code and components.

Interesting points from base app• Usage of PCL to share code• Portable.MvvmLightLibs &

Portable.CommonService Locator• MVVM done right• Linking code

OData Service Access implementation• Usage of the Repository pattern• Creation of our first ViewModel• OData Client Tools for Windows Store &

Windows Phone Apps (http://msdn.microsoft.com/en-us/jj658961)

Odata Service implementation

Do not trust the web…

Summary..So, what have we seen?

What have we seen?

Applying best practices is a mustUsing proper design patterns tooSharing Code through PCL & LinkingMVVM is fundamental

Best Practices

PCL – Portable Class Libraries

Design Paterns

MVVM is fundamental

Jose Luis LatorreEmail: joslat@gmail.com Twitter: @joslat Blog: http://Silverlightguy.com

© 2013 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.