Develop Business AppsCross-platform development using Visual Studio

with Xamarin and Azure

Alexander Meijers| SharePoint Lead Architect

Tuesday, April 14th 2015

Agenda

• Where to start?

• Development• Cross platform

• Programming skills

• Development environment

• Windows Azure

• Known issues

• Takeaways & Roundup

• Resources

Where to start?

• Considerations

• Type of Business Apps

Considerations

• Targeting• Single platform

• Cross platform

• Deployment• Development versus production

• Release management

• Hosting of the App

• App Store or not to Store

• Other• Localization

• Design

• Interaction

• Security

• Data storage• Local storage in App

• Storage in the cloud

• Hybrid scenarios

• Data availability• Scalability

• Data only available to App

• Data available to multiple solutions

• Data available cross Apps / Solutions

• Data transition• Transforming data to another format

• Move data to specific location

Ask yourself the following questions

• Which platforms do i want to support?

• Which systems does my app connect to?

• How many (active) users do i expect?

• Do i need to read and write data from a data container?

• What is the data connectivity for my users?

• Are other systems doing something with my data?

Type of Business Apps

• Office Platform• Office Apps• SharePoint hosted Apps, Provider-hosted Apps

• Cloud• Office 365 Apps• Azure Apps

• Windows• Universal Apps• Windows Phone Apps

• Other platforms• Android Apps• iOS Apps

DevelopmentCross-platform

• Xamarin Platform

• Xamarin.Forms

• Development

• .NET Libraries

• Models

Xamarin Platform

• A platform which allows you to share code accross all platforms witha single shared c# codebase

• Use the same language, APIs and data structures on every platform

• Platforms• iOS, Android, Windows Phone, Windows, Mac

• Xamarin Apps• Standard native user interface controls

• Compiled for native performance

• Leverage hardware acceleration

Xamarin tools

• Xamarin platform

• Xamarin Studio• iPhone and Android App development on Mac

• Android App development on Windows PC

• Visual Studio with Xamarin libraries• Windows Phone App development

• Android App development

• Mac and iPhone development only possible in combination with a Mac running XCode and Xamarin Studio, connected by network with theWindows PC

Devices & Emulators

• On screen emulators

• Real Phone (connection via USB cable)

Advantages Disavantages

Device • Easier to test

complex touch

interaction

• Feel for startup

and response

time

• Unlocking your Windows Phone

• Need of a developer account

• Android needs to have

debugging enabled

Emulator • Easier to test for

a variety of sizes

and forms

• Android emulators are very

slow

• Mac desktops don’t have touch.

Therefore difficult with controls

Xamarin development

Development Tools Language Platform

iOS XCode Objective-C Mac

Android Eclipse Java Lots of platforms

Windows Phone Visual Studio C# Windows PC

• Each language incorporates same sort methods or properties• Example toggle between to states

• iPhone its a view called UISwitch

• Android its a widget called Switch

• Windows Phone its a control called ToggleSwitchButton

• All languages are object-oriented descendants of C

Xamarin Platform .NET Libraries

Platform .NET Library Name

iOS Xamarin.iOS MonoTouch

Mac Xamarin.Mac MonoMac

Android Xamarin.Android Mono for Android

These libraries are known as the Xamarin Platform. They containnative Mac, iOS and Android APIs.

Shared code

• The trick is the ability of sharing code among the applications

• Platform independent code is isolated by moving it to a separate project

• The project is shared and referenced accross the other platform dependentprojects

• MVVM used in Xamarin projects• Model (underlaying data), View (user interface, visuals and input), ViewModel (manage

data between Model and View)

Shared code – can be complicated

• Different platforms use a different subset of the .NET Base Class Library (BCL)

• Different platforms are built to a different .NET Core Library Profile

• When creating cross-platform solutions, each platform can onlyuse class libraries that are targetedto the same profile within thatsolution

Shared code - Strategy

Approaches Overview

Shared Asset

Project (SAP)

• Organize your source

code

• Use #if compiler

directives to manage

platform specific

requirements

Portable

Class Library

(PCL)

• Class library targeting

the platforms you

want to support

• Use interfaces to

provide platform

specific functionality

Shared code - Shared Asset Project

• Benefits• Simplest approach

• The common code lives in the Shared Asset Project

• All platform projects are sharing the same code

• Branching possible to use compiler redirectives

• Application projects can include platform specificreferences that the shared code can utilize

• Disavantages• No output assembly

• During compilation the files are treated as part of the referencing project. Code is not shared aftercompilation

• Refactorings inside code in “inactive” compiler directives will not update the code

• Code is not intendend for distributing to otherdevelopers

Shared code - Portable Class Library

• Benefits• Allows you to share code across multiple

projects

• Refactoring always update all effectedreferences

• The output of the shared code is a class library

• Allows you to share your code with otherdevelopers

• Disavantages• More difficult to implement. You need to

considerate the options

• You can’t use compiler directives

• Only a subset of the .NET framework is available to use, determined by the profile selected

Xamarin App development model

iPhone App

Xamarin.iOS

iPhone API

Android App

Xamarin.Android

Android API

Windows Phone App

Windows Phone API

Shared Asset Project or Portable Class Library

Solution with

C# projects

Xamarin.Forms - Apps

• Xamarin.Forms• Introduced on may 28th, 2014• Write user-interface code for all platforms at once

• Xamarin.Forms application• 3 platform projects• 1 shared code project

• The shared code project contains most of the application

• The platform projects contains mostly stubs

• Xamarin.Forms Framework• Xamarin.Forms.Core• Xamarin.Forms.Xaml

• Xamarin.Forms is based on MVVM

Xamarin.Forms - App development model

iPhone App

Xamarin.iOS

iPhone API

Android App

Xamarin.Android

Android API

Windows Phone App

Windows Phone API

Shared Asset Project or Portable Class Library

Solution with

C# projects

Xamarin.Forms.Core / Xamarin.Forms.Xaml

Xamarin.Forms - Example

• Example displays a switch on all three platforms with a single XAML file

Xamarin APIs

• http://api.xamarin.com

• You will find here:• Base Class Library

• MonoMac Framework

• Xamarin.Android Framework

• Xamarin.iOS Framework

• Xamarin.Forms

• Other APIs found here from other Xamarin products

DEMOFormsGallery

Demo – Run the project

Programming skills

• Asynchronous programming

• Retrieve data from SharePoint

• Model – View - ViewModel

Programming skills – asynchronous

• Working with mobile applications that interact with network, database, files and device hardware reading are much more slower than in normal conditions due to communication bottlenecks

• Asynchronous allows us to run delayed tasks in the background• The program itself can continue without holding up by some task

• Available with .NET Framework 4.5 or higher

• A new simplified approach for running asynchronous tasks

• .NET APIs contain classes supporting asynchronous methods and properties to improve responsiveness

• The task has a state (Running, Finished or Cancelled), a result and is able to throw exceptions

Programming skills – asynchronous

• Keywords• async let the compiler know that

the method needs to be handled separately

• await Let the compiler know the suspension of the relative running async task

• Return types• Task or Task<TResult>• Task is used when the method has no

return statement of does not return an operand

What happens?

1. Function is called

2. Calls an async method on the object

3. Something causes a delay. It yields control to its caller.

4. The method continues because its not awaited

5. The method is executed synchronous

6. No work further. It now awaits on the result of the asynchronous call

7. The method completes and returns the result.

8. It calculates the length and returns it

Retrieve data from SharePoint

• Use WebClient with authentication credentials using SharePointOnlineCredentials()

• JSON as result

• Example: Jtoken listItems = GetList(new Uri(https://appztekonline-public.sharepoint.com”), Credentials(), “B

• If called from an Azure Service you will need to configure some additional settings• Allowed Origins

• Other

Model – View - ViewModel

• A model which allows you to create shared code projects at ease

• Model (business logic and underlaying data)

• View (presentation, user interface, visuals and input)

• ViewModel (presentation logic, manage data between Model and View)

Development environment

• Software installation

• Development setup

• Android specific• Android API levels

• Android Virtual Device

Dev environment – Software installation

• Windows 8 or higher

• Hyper-V enabled• Needed for emulators (Windows Phone, Android)

• Visual Studio 2013 with Update 4• Contains the Windows Phone SDK

• Xamarin for Windows

• Xamarin Android Player for Windows• Only when you want to develop for Android!!• You will need VirtualBox (not possible with Hyper-V enabled)

• Update the Android SDK Manager

Dev environment – Development setup

• Create a blank Xamarin App based on Xamarin.Forms Shared

• Remove the iOS project• Mac platform needed and not present (in this case)

• Use Android Virtual Device Manager• Create or use device definitions• Create Android virtual devices based on device definitions

• Project properties of the Android project• Define compile level• Define minimum target level• Define Android version

Dev environment - Android API Levels

• API Level determines for which Android versions you can deploy

• Choose the API Level• Install the SDK platform for that level

• Install the system images for that level

• Sources and samples of SDK are available

Dev environment - Android Virtual Device

• Create Android Virtual Device• Choose Device

• Choose target (API Level need to be installed)

• CPU/ABI

• In some cases you need to restart Visual Studio to get the device listed under the start button

DEMOConfiguration

Demo - Configuration

Windows Azure

• Why Azure?

• Xamarin and Azure

• Azure Mobile Services

• Azure Messaging component

• Azure Active Directory authentication

Why Azure?

• Set of great tools completely integrated with Xamarin• Azure Mobile Service• Push notifications

• All the benefits of a great platform• Scalability• Uniform platform and layer in your solution

• Data synchronization• Asynchronous• Offline data synchronization

• Authentication with Active Directory

Xamarin and Azure

• Microsoft Azure plugs easily into Xamarin projects

• Incorporates Azure features like;• Cloud data storage

• Cross-platform push notifications

• Xamarin has components available to integratie it!• Azure Messaging component

Azure Mobile Services

• Add structured storage, authentication, push notifications and more toyour Xamarin based mobile application using Microsoft Azure Mobile Services.

• https://components.xamarin.com/view/azure-mobile-services/

Azure Messaging component

• Send push notifications to your iOS, Android and Windows apps

• Allows you to register with Azure Notification Hubs

• Send notifications from any backend

• Target content to specific user segments

• Use templates to tailor notifications

• Due to the notification hubs you can scale op to millions of devices and billions of push notifications

• http://components.xamarin.com/view/azure-messaging

Azure Active Directory Authentication

• Use Active Directory to authenticate users in Xamarin mobile applications

• Use the same organizational account that employees use to sign in to their corporate environment

• Secure resources like;• Files, links, Web APIs, Office 365 and more

Azure Active Directory Authentication

• Get it up and running in three steps• Register with Azure Active Directory

• https://www.windowsazure.com

• Configure Service Access for Mobile Application• http://developer.xamarin.com/guides/cross-

platform/azure/active-directory/

• Develop mobile apps using the service access

• Examples of services you can access include:• Graph API, Web API and Office 365

DEMOTodo list with data in Azure

Demo – Create mobile service

Demo – Get project

Demo – Run the project

Known issues

• Fastdev directory creation failed

Known issues

Issue FastDev directory creation failed

Resolutions Turn off Fast Deployment in project properties

Takeaways & Roundup

Takeways & Roundup

• The Xamarin platform is great for developing cross-platform business apps

• Understand the technology of Shared Code, choose wisely!

• Not everything is cross-platform. Specific functionality demands written code per platform

• Get to know asynchronous programming with async and await

• The Azure platform is great for expanding your app with storage, push notifications and security

• Integration between Xamarin and Azure

Resources

Sources & Resources

• Free e-book “Creating Mobile Apps with Xamarin.Forms” by Charles Petzoldhttp://blogs.msdn.com/b/microsoft_press/archive/2014/10/06/free-ebook-creating-mobile-apps-with-xamarin-forms-preview-edition.aspx

• Xamarin platformhttp://xamarin.com/platform

• Xamarin + Azurehttp://developer.xamarin.com/guides/cross-platform/windows/microsoft-azure/

• Xamarin API documentationhttp://api.xamarin.com/

• Xamarin FormsGallery demo – Great impression of the Xamarin.Formshttp://developer.xamarin.com/samples/xamarin-forms/FormsGallery/

• Xamarin early preview setup – Windows Phone 8.1 developmenthttp://developer.xamarin.com/guides/cross-platform/xamarin-forms/windows/installation/

• Managing your Azure environmenthttps://manage.azure.com

Questions?