Build for both: Windows and Windows Phone

47

description

Build for both: Windows and Windows Phone. Matt Hidinger Clarity Consulting 2-215. So umm… you’re not with Microsoft?. Clarity Consulting Windows Phone Dev MVP. But first… a phone!. Sharing. Design for both Develop for both Architecture & patterns. Image credit: Jason Emprey. - PowerPoint PPT Presentation

Transcript of Build for both: Windows and Windows Phone

Page 1: Build for both: Windows and Windows Phone
Page 2: Build for both: Windows and Windows Phone

Build for both: Windows and Windows PhoneMatt HidingerClarity Consulting 2-215

Page 3: Build for both: Windows and Windows Phone

Clarity ConsultingWindows Phone Dev MVP

So umm… you’re not with Microsoft?

Page 4: Build for both: Windows and Windows Phone

But first… a phone!

Page 6: Build for both: Windows and Windows Phone

Real-world stocks

Page 7: Build for both: Windows and Windows Phone

Design for both

Page 8: Build for both: Windows and Windows Phone

Same design language

What do they have in common?

C#.NETXAMLWinRT

Windows PhoneWindows

Page 9: Build for both: Windows and Windows Phone

Windows Phone800x4801280x7681280x1024

How do they differ?

Form factors, mostly

Windows1024x768…to…3200x1800+

Page 10: Build for both: Windows and Windows Phone

Landing pages

Page 11: Build for both: Windows and Windows Phone

GridViewGrouped by sectionHorizontal scrolling

PanoramaItem per sectionHorizontal and vertical scrolling

Panorama

Page 12: Build for both: Windows and Windows Phone

Lists of data

Page 13: Build for both: Windows and Windows Phone

Vertical scrollingOptionally grouped

Jump list to quickly navigate

GridView LongListSelectorHorizontal scrolling

Optionally groupedSemantic zoom to quickly navigate

Page 14: Build for both: Windows and Windows Phone

App bars

Page 15: Build for both: Windows and Windows Phone

AppBar ApplicationBarTop and Bottom

Supports circular buttonsAnd/or any content you want

Bottom onlySupports circular buttons

And/or menu items

Page 16: Build for both: Windows and Windows Phone

Back buttons

Page 17: Build for both: Windows and Windows Phone

On screen On device

Page 18: Build for both: Windows and Windows Phone

My personal favorite

Page 19: Build for both: Windows and Windows Phone
Page 20: Build for both: Windows and Windows Phone

Design is more than the appearanceTune the experience and use cases for the form factorPay attention to the details, modern design isn’t lack of design

Inspiration is everywhere

Page 21: Build for both: Windows and Windows Phone

Develop for both

Page 22: Build for both: Windows and Windows Phone

Sharing an assembly

Page 23: Build for both: Windows and Windows Phone

One SourceOne ProjectOne Binary

Multiple Platforms!

Portable Class Libraries

Page 24: Build for both: Windows and Windows Phone

Portable Class Library

Demo

Page 25: Build for both: Windows and Windows Phone

Sharing source code

Page 26: Build for both: Windows and Windows Phone

CtrlCtrl

-C-V

When? XAML

Image credit: http://quickmeme.com

Page 27: Build for both: Windows and Windows Phone

Linked files

Page 28: Build for both: Windows and Windows Phone

Linked files

Hold Alt and drag a folder to link multiple files at once!

Windows Phone

Windows

Page 29: Build for both: Windows and Windows Phone

Linked Files

Demo

Page 30: Build for both: Windows and Windows Phone

#if NETFX_COREDispatcher.RunAsync(CoreDispatcherPriority.Normal, myAction);#endif

Compiler directives

#if WINDOWS_PHONEDeployment.Current.Dispatcher.BeginInvoke(myAction);#endif

Windows

Windows phone

Page 31: Build for both: Windows and Windows Phone

Compiler Directives

Demo

Page 32: Build for both: Windows and Windows Phone

ComparisonSharing an assembly (PCL)Code remains clean and single purposeBuild, test, compile onceLimited API accessCan’t reference non-PCL assembliesWon’t work with Express SKUs

Sharing source code (linked files)

Full API access on the platform compiling itCan tweak source per platform using #if

Code can become complex due to compiler directivesMinor Visual Studio quirks: “This document is already open”

TL;DR: use them both

Page 33: Build for both: Windows and Windows Phone

You know C#You know .NETYou know and love XAML (right?)

Use your skills, Luke

Page 34: Build for both: Windows and Windows Phone

Architecture & patterns

Page 35: Build for both: Windows and Windows Phone

Portable Class Library

CoreViewModels

Services

Models

WindowsApp Startup / Lifecycle

ViewsControls

ConvertersViewModels

Windows PhoneApp Startup / Lifecycle

ViewsControls

ConvertersViewModels

Linked

Page 36: Build for both: Windows and Windows Phone

Building real-world stocks

Demo

Page 37: Build for both: Windows and Windows Phone

Summary

Page 38: Build for both: Windows and Windows Phone

What to share?Linked sourceü Convertersü Commands✋ Controls (if it makes sense)✋ View Models (if it makes sense)

User Interfaceü Static assetsü Design language XAML: Not right now

PCLü Modelsü Business logicü Web Servicesü Helpersü Logging✋ View Models (if it makes sense)✋ Commands (if it makes sense)

Page 39: Build for both: Windows and Windows Phone

Architect with sharing in mindPut as much into a PCL as possibleUse a platform adapter to Do More in CoreUse #if conditions for minor code differencesExtension methods can bridge missing APIsMaximize the user experience for each platform

Mix and match techniques

Image credit: Daniel E Lee

Page 40: Build for both: Windows and Windows Phone

PortableHttpClientPCLStorageMetroLog

Beneficial frameworks

MVVMCaliburn.MicroMVVM Light

Page 41: Build for both: Windows and Windows Phone

Try it yourself!

Download the full source for this talk in a few days

http://bit.ly/BuildRealWorldStocks

Page 42: Build for both: Windows and Windows Phone

Related sessionsStory of Nokia Music, from Windows Phone to Windows Store2-219 – Matthew Cooper – North 134 – 30 minutes from now!

Windows Phone Development Best Practices2-216 – Stefan Wick – North 134 – Friday @ 10:30 AM

MVVM In Action – Hulu Case Study2-205 – Matthias Shapiro – North 134 – Friday @ 12:00 PM

Page 44: Build for both: Windows and Windows Phone

Join other speakers and Microsoft employees to talk about sharing

Today @ 6 PMMicrosoft Office835 Market Street, Suite 700

Sharing code meet-up!

Drinks and appetizers provided

Page 45: Build for both: Windows and Windows Phone

@MattHidinger

Thank you!Q&A

Page 46: Build for both: Windows and Windows Phone

Evaluate this session

Scan this QR code to evaluate this session and be automatically entered in a drawing to win a prize!

Page 47: Build for both: Windows and Windows Phone

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