Xamarin Forms consente di sviluppare applicazioni cross-platform utilizzando C# e di condividere non solo la business logic (come consente già di fare l’approccio tradizionale), ma anche l’interfaccia utente, grazie ad un linguaggio basato sullo XAML, i cui elementi vengono poi convertiti in tempo reale in controlli nativi, garantendo perciò una user experience coerente con quella attesa dall’utente su Android, iOS e Windows. Nel corso di questa sessione vedremo come strutturare al meglio un progetto Xamarin Forms, grazie al pattern MVVM e al framework open source Prism.

1. Sviluppare applicazioni cross-
platform con Xamarin Forms e Prism
Matteo Pagani
Windows AppConsult Engineer @ Microsoft
matteo.pagani@microsoft.com
Twitter: @qmatteoq
MILAN 25-26 NOVEMBER 2016

2. Shared C# codebase • 100% native API access • High performance
Shared C# Business Logic
(Portable Class Library)
Shared C# UI (XML)
XAMARIN FORMS

3. <?xml version="1.0" encoding="UTF-8"?>
<TabbedPage xmlns=“…" xmlns:x=“…“ x:Class="MyApp.MainPage" > >
<TabbedPage.Children>
<ContentPage Title="Profile" Icon ="Profile.png">
< <StackLayout Spacing="20" Padding="20” VerticalOptions="Center">
<<Entry Placeholder="Username" Text="{Binding Username}">
<<Entry Placeholder="Password” Text="{Binding Password}” IsPassword="true">>
<<Button Text="Login" TextColor="White” BackgroundColor=”…” Command=”…">/>
</<StackLayout>>
</ContentPage>>
<ContentPage Title = "Settings"
Icon = "Settings.png">>
<!-- Settings -->
</ <ContentPage>>
</TabbedPage.Children>
XAMARIN FORMS

4. THE MVVM PATTERN

5. PRISM FOR XAMARIN FORMS
• Prism was a MVVM framework originally created by the Patterns &
Practises division by Microsoft
• Now it’s an open source project driven by Brian Lagunas, a Microsoft MVP,
and by the community
• It provides the basic infrastructure to implement the MVVM pattern:
• Base class for ViewModels
• Dependency injection container with multiple framework choices
• Messages
• It provides advanced features to solve specific requirements of Xamarin
Forms:
• Navigation from a ViewModel
• Handling the page’s lifecycle
• Handling platform specific code
• Deep linking
https://github.com/PrismLibrary

6. CONFIGURATION
• Manually, by adding the following NuGet packages:
• Prism.Core
• Prism.Forms
• Prism.xyz.Forms, where xyz is one of the supported dependency
injection containers (Unity, Ninject, Autofact, etc.)
• Automatically, with the project wizard:

7. DEPENDENCY INJECTION
With the standard approach, objects that are
used in a ViewModel are created at compile time:
public MainViewModel MainViewModel
{
public MainViewModel()
{
DataService service = new DataService();
service.GetItems();
}
}

8. DEPENDENCY INJECTION
MainViewModel IDataService
public MainViewModel(IDataService dataService)
{
}
DataServiceTestDataService

9. DEPENDENCY INJECTION
• In the App class you associate the interface with its concrete
implementation:
Container.RegisterType<IDataService, DataService>();
• In the constructor of the ViewModel, you create a dependency by adding a
parameter to the class’ constructor:
private readonly IDataService _apiService;
public MainPageViewModel(IDataService apiService)
{
_apiService = apiService;
}
• You use the class in any method or property of your ViewModel

10. CONFIGURATION
• Your App class needs to inherit from PrismApplication
• RegisterTypes() method to register classes inside the dependency
container.
• OnInitialized() method to navigate to the main page of the app using the
NavigationService provided by Prism
KEYWORD: flexibility
• Default naming convention: MainPage -> MainPageViewModel
• You don’t like it? Feel free to override it and manually specify the
connection in the dependency container.
Container.RegisterTypeForNavigation<MainPage>();
Container.RegisterTypeForNavigation<DetailPage,
MyCustomDetailViewModel>();

11. NAVIGATION
• INavigationAware is an interface that you can implement in your
ViewModels to get access to the following events:
• OnNavigatedTo() when you navigate to the page
• OnNavigatedFrom() when you navigate away from the page
• OnNavigatingTo() when you are navigating to the page
• NavigationService can be used to navigate from one page to another, with
support to parameters:
NavigationParameters param = new NavigationParameters();
param.Add("text", “This is a parameter");
await _navigationService.NavigateAsync("DetailPage", param);
• In the OnNavigatedTo() method of the destination page you can retrieve
the parameter

12. NAVIGATION
• Deep link: you can create complex navigation paths and retain the stack of
the pages
await
NavigationService.NavigateAsync("MainTabbedPage/NavigationPage
/ShowsListPage/DetailPage?id=279121");
MainTabbedPage Navigation ShowsList Detail

13. DEMO
Advanced navigation

14. HANDLING PLATFORM SPECIFIC CODE
• Xamarin Forms allows to share business logic and user interface but, at
some point, you need to write platform specific code
• Xamarin Forms offers a DependencyService class and a Dependency
attribute to handle this scenario
Portable Class
Library
IShareService
IosShareService
DroidShareService
UwpShareService
[assembly: Dependency(typeof(UwpShareService))]

15. HANDLING PLATFORM SPECIFIC CODE WITH DI
IShareService shareService =
DependencyService.Get<IShareService>();
Container.RegisterInstance<IShareService>(shareService);
• With a traditional dependency injection approach, you have first to get a
reference to the platform specific service and then register it into the DI
container
• Prism automatically register every class tagged with the Dependency
attribute inside the container, so you can just use it in your ViewModels
private readonly IShareService _shareService;
public MainPageViewModel(IShareService shareService)
{
_shareService = shareService;
}

16. DEMO
Platform specific code with DI

17. REFERENCES
• Slides: https://doc.co/P2VavL
• Samples: https://github.com/qmatteoq/XamarinForms-Prism
• Prism: https://github.com/PrismLibrary/
• Templates for Prism:
https://marketplace.visualstudio.com/items?itemName=BrianL
agunas.PrismTemplatePack
• Blog posts with more detailed info about Prism:
http://blog.qmatteoq.com/tag/prism/
• Blog posts to learn more about MVVM:
http://blog.qmatteoq.com/the-mvvm-pattern-introduction/
• MVA course about Xamarin Forms: https://aka.ms/xamarin-
forms-mva

18. Q & A
Matteo Pagani
Windows AppConsult Engineer @ Microsoft
matteo.pagani@microsoft.com
Twitter: @qmatteoq
MILAN 25-26 NOVEMBER 2016