Lessons Learned from Building Windows 8 Store Apps with MVVM and XAML

Mike Douglasmikedouglas@Deliveron.com@mikedouglasdev

AGENDA• Background• Why XAML/C#/MVVM?• Lessons Learned• What’s Next?

ABOUT MIKE DOUGLAS• Solution Consultant for Deliveron

Consulting Services• Microsoft Visual Studio ALM MVP• Microsoft External Rangers – Visual Studio

ALM• HDC, KCDC, OTSUG Presentations• Team Deploy – TeamDeploy.CodePlex.com• Blog - CodeSmartNotHard.com• Email – mikedouglas **at** deliveron.com• Twitter - @mikedouglasdev

ABOUT DELIVERON• Project based, technology

consulting• Areas of Expertise:

– SharePoint– BizTalk– Business Intelligence– .NET Development– ALM Training and Consulting

• Deliveron Jumpstarts• Newsletters & Webcasts• www.Deliveron.com

BACKGROUND• The Challenge

• TFS Agile Poker (www.tfsagilepoker.com)– MVVM, XAML, WinRT, Async/Await,

OData/REST, Azure Mobile Services.

• ALM Readiness TreasureMap– Open source app for managing ALM

Ranger’s guidance and tools– http://tinyurl.com/almtreasuremap

WHY XAML/C#/MVVM?

• XAML/C# vs HTML5/JavaScript– Matching feature sets– Originally thought I was going to use HTML5/JavaScript– XAML/C# - Databinding and new features– XAML is only way to get cross platform between• Win8• WP• MVVM Cross and Xamarin

– IOS– Android

LESSONS LEARNED• Design• Development• Testing• Deployment to the Windows Store

LESSONS LEARNED - DESIGN

LESSONS LEARNED - DESIGN• Storyboarding

– Create wireframe and visualize design

• Frameworks– Roll your own– Utilize Existing

• IOC support• Flyout support• View to ViewModel auto wiring• Examples

– MvvmLight– Prism

LESSONS LEARNED - DEVELOPMENT

• Async / Await– No UI blocking threads

Method Signature Example Usage

Async Void private async void OnSubmitPointsCommand() Asynchronous Event Handlers onlyPotentially await-able

Async Task public async Task CloseSessionAsync(string session)

Use when returning void

Async Task<T> public async Task<Session> CreateSessionAsync() Use when having a return value

Await SomeMethodAsync

CurrentChannel = await PushNotificationChannelManager.CreatePushNotificationChannelForApplicationAsync();

Used to create asynchronous method and doesn’t block UI thread

LESSONS LEARNED - DEVELOPMENT

• Persisting Data– Scenarios

• Session State• Local or Roaming Settings

– Default Serialization• Painful, requires KnownTypes definitions, DataMember attributes

– JSONstring serializedSettings = Newtonsoft.Json.JsonConvert.SerializeObject(appSettings);applicationSettings = Newtonsoft.Json.JsonConvert.DeserializeObject<ApplicationSetting>(serializedSettings);

– Roaming Settings

Windows.Storage.ApplicationData.Current.RoamingSettings.Values["ApplicationSettings"] = serializedSettings;

LESSONS LEARNED - DEVELOPMENT

• Styling and Data Templates

LESSONS LEARNED - DEVELOPMENT

• DataBinding– Properties support 2 way binding

– Converters• Boolean To Visibility

LESSONS LEARNED - DEVELOPMENT

• Commanding

LESSONS LEARNED - DEVELOPMENT

• Behaviors– Only buttons have a Command property– Attached Properties extend object with Command

LESSONS LEARNED - DEVELOPMENT

• Simulating Suspending and Terminating from VS

LESSONS LEARNED - DEVELOPMENT

• Team Agile Poker Demo

LESSONS LEARNED - TESTING

LESSONS LEARNED - TESTING• Dependency Injection / IOC– Recently released frameworks for PCL• Unity• Ninject

• Coded UI Testing support in Windows 8.1 / VS 2013– Extensive gesture support

• Microsoft Test Manager – Execute test cases against device– Log and capture error information for bugs

LESSONS LEARNED – WINDOWS STORE

LESSONS LEARNED – WINDOWS STORE

• Windows App Certification Kit

LESSONS LEARNED – WINDOWS STORE

• Gracefully handle common scenarios– Unhandled Exceptions -> NO CRASHES!– Midstream Network Loss and no network connectivity– Snapped Views– Adaptive to support multiple resolutions (1366 x 768, 1920

x 1080)

LESSONS LEARNED – WINDOWS STORE

• Don’t make your company name / app name too long– Error Found: The performance launch test collected the following

results:. • The Native Image Generator failed due to long file path for file C:\

Program Files\WindowsApps\DeliveronConsultingServic.TeamPlanningPoker_1.0.0.1_neutral__s9dp6hmz44fsa\Microsoft.Data.Services.Client.WindowsStore.dll

• The Native Image Generator failed due to long file path for file C:\Program Files\WindowsApps\DeliveronConsultingServic.TeamPlanningPoker_1.0.0.1_neutral__s9dp6hmz44fsa\Microsoft.WindowsAzure.MobileServices.Managed.dll

– To Skip NGEN• Add nongen.txt file to root folder of project.

LESSONS LEARNED – WINDOWS STORE

• Privacy Policy– Must have privacy policy if accessing any external

resources and storing any data.

http://www.privacychoice.org

LESSONS LEARNED – WINDOWS STORE

• When submitting– Tester Notes • Assume it is one of your grandparents is doing the

review.• Assume no domain knowledge

– Some markets have restrictions• Had to change rating to 12+ (email)• Some countries require an official game rating

LESSONS LEARNED – WINDOWS STORE

• How to create all of the required image sizes?– PerfecTile for Windows 8– http://nirm.it/PerfecTile/

LESSONS LEARNED – WINDOWS STORE

• App Certification Demo

LESSONS LEARNED – WINDOWS STORE

LESSONS LEARNED – WINDOWS 8.1

LESSONS LEARNED – WINDOWS 8.1

• Windows 8.1 – Currently in preview, released as free update in Windows

Store on 10/17– No more snapped views, can adjust to any size– Windows 8.0 apps will work on Windows 8.1– Windows 8.1 apps will not work on Windows 8.0

WHAT’S NEXT?• Windows 8.1 Version• New Features• Cross Platform with Xamarin (IOS, Android, WP8)• Web version• Writing TFS book

RESOURCES• Xamarin and MvvmCross

– http://xamarin.com/evolve/2013#session-dnoeeoarfj

• Prism for Windows 8– http://prismwindowsruntime.codeplex.com/

• PerfecTile– http://nirm.it/PerfecTile/

• CUIT Gestures in VS 2013– http://

blogs.msdn.com/b/visualstudioalm/archive/2013/08/17/coded-ui-test-gesture-support-in-visual-studio-2013.aspx

• The Tablet Show – Getting apps into the Store– http://thetabletshow.com/?ShowNum=70

• Pluralsight Courses– http://www.pluralsight.com/training/Courses/TableOfContents/windows8-hands-on– http://www.pluralsight.com/training/Courses/TableOfContents/win8mvvm

• Free Online Privacy Policy tool– http://www.privacychoice.org

1 1 5 1 6 M i r a c l e H i l l s D r i v e S u i t e 2 0 1 O m a h a , N E 6 8 1 5 4

4 0 2 . 2 3 8 . 1 3 9 9 | w w w . d e l i v e r o n . c o m | c o n t a c t u s @ d e l i v e r o n . c o m