Developing Mobile Applications using MVVM

with Xamarin Forms

Getting To Know You

Eric Grover

Senior Consultant with

Content & Collaboration / Application Development Group

Twitter: @BlueChipEricBlog: http://www.ericgrover.com

Ask Our Experts!

• Visit the Blue Chip booth to chat with one of our Expert Consultants

• Drop us your business card, and we’ll help you solve your business problem and you might win an (Drawing Tuesday)

• Our resident SharePoint MCM/MVP is here all day, Monday & Tuesday*

• Visit our other sessions in the SharePoint & PowerShell tracks!

*Except when presenting

Paul Stork@PStork

Paul is a Microsoft SharePoint MVP and MCM who works as

Principal Architect at Blue Chip Consulting Group. An author and/or contributor on several SharePoint books, Paul is a well-known contributor to the SharePoint community.

Blue Chip Featured Expert

The Story Of Xamarin Forms

• Which problems does Xamarin Forms address?• What exactly is Xamarin Forms?• How do we use the MVVM pattern in Xamarin Forms?• What kind of apps can we build with Xamarin Forms?

The Mobile Dev Pit Of Dispair

Write an iOS app in Objective-C and UIKit in Xcode.

Write an Android app in Java and Android XML in Eclipse.

Write a Windows Phone app in C# and XAML in Visual Studio. (You probably never get around to this!)

Inconceivable?

Wouldn’t it be cool if …• We could write apps for Android and iOS along with

Windows Phone in Visual Studio?• We could write apps for Android and iOS in C#

instead of Objective-C and Java, but still have full access to each platform’s API?

• We could share over 80-90% of our code across platforms?

• We could write our UI with a common MVVM framework, but still render native controls?

As You Wish - Xamarin Forms

• Xamarin Forms is framework that allows you to build native UIs for iOS, Android, and Windows Phone from a single, shared C# codebase.

• Xamarin Forms runs on top of Xamarin iOS and Xamarin Android.

Xamarin iOS

• iOS apps are built using the Xamarin Ahead-of-Time (AOT) compiler that compiles C# directly to native ARM assembly code, producing ARM binaries for the apple App Store. Your app is a native platform binary – not cross compiled, not interpreted, and not a web page masquerading as a native app.

• 100% iOS SDK (including iOS 8) interface with C#.• Call existing Objective-C code from C# for

leveraging frameworks built for iOS.

Xamarin Android

• Android apps use just-in-time (JIT) compilation. Your app is a native Android APK —not cross-compiled, not interpreted, and not a web page posing as an Android app.

• 100% of Android APIs interface with C#, even adding async support (via the TPL).

• Call existing Java code from C# for custom Android libraries.

Visual Studio Integration

• Xamarin integrates Visual Studio with the Android SDK so you can build and run apps to emulators and phones on your PC.

• Xamarin integrates Visual Studio with XCode on a Mac via a build host running on the Mac. A Windows dev PC is paired over the network with the build host on the Mac.

Xamarin Forms Solution

• Visual Studio new project template creates a solution with 4 projects.– Windows Phone App– Android App– iOS App– Shared Assembly or PCL

New Solution Demo

Building the UI

• Xamarin Forms allows you to create your UI in XAML that is then rendered for each platform using native UI controls for each platform.

• Xamarin Forms provides basic renders for a core set of common controls, and allows you to override or extend the renders with your own custom code.

Building the UI

Page Types

Layout Containers

Controls

Xamarin XAML

• Xamarin Forms XAML is not the same as the Microsoft XAML used to build WPF/Silverlight/WindowsStore/WinPhone apps.

• Like Microsoft XAML, Xamarin XAML allows you to build visual trees, but it has a very different set of controls and containers.

Visual Tree ExamplePage

StackLayout

Label Entry StackLayout

Content

Children

Button Button Image

Children

Not Locked In

• Xamarin Forms allows you to mix native UIKit, AnroidXML, and WindowsPhone XAML pages with your Xamarin Forms pages.

• You can embed custom views build with native UI framework in your Xamarin Forms page.

Maps

• Xamarin Forms wraps each platform’s native map technology in a easy to use control.

Animation

• Xamarin Forms provides a set of async, composable extension methods that allow you to animate any UI control.

• Animation extension provide ability to:– Fade– Rotate (2D)– Scale – Translate – Layout (change bounds)

• Easing algorithms can be applied to each animation.

Dependency Service

• Xamarin Forms provides a dependency service so that you can write and inject your own platform-specific services in your shared C# code.

• Useful for abstracting things like sending an e-mail, raising a notification, etc.

MVVM Architecture

• Xamarin Forms provides two-way data binding so that you can implement the INotifyPropertyChanged interface.

• Xamarin Forms has a Messaging service that allows weak-referenced communication across views and view models.

Navigation

• Xamarin Forms implements a page based navigation stack that allows you to push and pop pages to navigate forward and backward.

Xamarin Forms Labs

• Open source project for creating controls, services, and MVVM helpers for Xamarin Forms.

• Not officially affiliated with Xamarin, but there are Xamarin employees who contribute.

• My contribution: RepeaterView control• https://github.com/XForms/Xamarin-Forms-Labs

MVVM Demo

Cleveland Plays App

• League standings and schedule.

• Real-time stat entry for games.

• Career and fantasy league stats.

• Geofence alerts for partner businesses.

• “CP Bucks” POS discount.

App Technologies

• WCF • JSON.Net• SingalR• Reactive Extensions• SQL Lite• Google Maps / Apple

Maps

CP Demo

Have Fun Storming The Castle!

Questions?