Building Cross Platform Mobile Solutions

@gittetitterproq.blogspot.com

Building Cross Platform Mobile Solutions

Gitte Vermeiren

My perfect mobile world ...

My perfect mobile world ...

My perfect mobile world ...

My perfect mobile world ...

Data Access

Business Logic

Service Interface

Business Logic

UI Logic

WP iOS Droid Win8

Business Logic

Business Logic

Business Logic

UI Logic UI Logic UI Logic

Service Consumptio

n

Local Data/Servic

es

Service Consumptio

n

Local Data/Servic

es

Service Consumptio

n

Local Data/Servic

es

Service Consumptio

n

Local Data/Servic

es

My perfect mobile world ...

Data Access

Business Logic

Service Interface

Service Consumption Local Data/Services

Business Logic

UI Logic

WP iOS Droid Win8

My perfect mobile world ...

Data Access

Business Logic

Service Interface

Service Consumption Local Data/Services

Business Logic

UI Logic

WP iOS Droid Win8

My perfect mobile world ...

Data Access

Business Logic

Service Interface

Service Consumption Local Data/Services

Business Logic

UI Logic

WP iOS Droid Win8

My perfect mobile world ...

Data Access

Business Logic

Service Interface

Service Consumption Local Data/Services

Business Logic

UI Logic

WP iOS Droid Win8

Can we do this?

Portable Class

LibrariesXamarin MvvmCros

s

Intro

How did we do this?

Portable Class

LibrariesXamarin MvvmCros

s

Portable Class Library

- Share code across platforms

Portable Class LibraryWindows Store App

Startup

Views

Windows Phone App

Startup

Views

PCL

ViewModels

Models

AndroidApp

Startup

Views

iOSApp

Startup

Views

references

references

references

references

Demo: Portable Class Library

How did we do this?

Portable Class

LibrariesXamarin

Xamarin for Android/iOS

Xamarin for Android/iOS

Business Logic

UI Logic

WP iOS Droid Win8

Data Access

Business Logic

Service Interface

Service Consumption Local Data/Services

Xamarin

Xamarin for Android/iOS

Code Completio

n for Native APIs

Visual Studio

Integration

Advanced Debugging

Support

Point and click UI design

Xamarin for Android/iOS

Xamarin for Android/iOS

Demo: Xamarin for Android

Getting Started

- Windows PC or Mac

- Google Play account / iOS account

- Xamarin for Android / Xamarin for iOS: free – 999$

How did we do this?

Xamarin MvvmCross

Data Binding (binder)

M-V-VM

View ViewModel

Events

DataModelData

M-V-VMSeparati

on of Concerns

Designable (Blend)

More structure

d code

TestableDatabinding

Code reuse

MvvmCross

MvvmCross

Data Binding (binder)

View ViewModel

Events

DataModelData

WP View

iOS View

Android View

Win 8 View

MvvmCross

Android

WP/Win8

HomeViewModel SessionsViewModel

SessionDetailViewModel

iOS

RequestNavigate

RequestNavigate

MvvmCross

Your appDevice SpecificPlugin

IMvxNativeColor

MvxWinRTColor Add Plugin

MvxAndroidColor Add Plugin

MvxWPColor Add Plugin

MvvmCross

Demo: MvvmCross ‘Backend’

MvvmCross

- ViewModels- DI- Services/Plugins- Navigation- Unit test

MvvmCross

Data Binding (binder)

ViewModel

Events

DataModelData

WP View

iOS View

Android View

Win 8 View

Demo: MvvmCross WP

A WP app with MvvmCross

- Data Binding as you know it- ViewModels are auto-wired using

MvxPhonePage<TViewModel>- Configure platform specific services

... and that’s it

Demo: MvvmCross Android

An Android app with MvvmCross

- UI is build up using .axml - Data Binding using json expressions- Navigation mapped to Intents- ViewModels are auto-wired using

MvxBindingActivityView<TViewModel>- ValueConverters can be used

Lessons Learned

Why this became my precious

- Native UI- Native Performance- One language to rule them all- 95% shared application logic- 100% shared test harness- Overall dev time ≈ dev time per app- Changes can be done in 1 place (most of the time)

Why this became my precious

Portable Class

LibrariesXamarin MvvmCros

s

Related Sessions

- Coding and designing for Windows 8 and Windows Phone 8, best practices and reusing code

- Laurent Bugnion- Applied MVVM in Windows 8 apps: not your typical MVVM

session!- Gill Cleeren

- Live coding: The Windows Store Apps showdown - C# vs JavaScript

- Iris Classon

Other Resources

- MvvmCross- https://github.com/slodge/MvvmCross- http://slodge.blogspot.com

- Xamarin- http://xamarin.com/- monogame.net

- The bits- https://github.com/vermegi/TechdaysBeDemo

Thanks!

@gittetitterproq.blogspot.com