Xamarin.Forms
Notes for Professionals
Xamarin
.Forms
Notes for Professionals
100+ pages
of professional hints and tricks
GoalKicker.com
Free Programming Books
Disclaimer
This is an unocial free book created for educational purposes and is
not aliated with ocial Xamarin.Forms group(s) or company(s).
All trademarks and registered trademarks are
the property of their respective owners
Contents
About
...................................................................................................................................................................................
1
Chapter 1: Getting started with Xamarin.Forms
...........................................................................................
2
Section 1.1: Installation (Visual Studio)
Section 1.2: Hello World Xamarin Forms: Visual Studio
.........................................................................................................................
2
.............................................................................................
4
Chapter 2: Why Xamarin Forms and When to use Xamarin Forms
....................................................
7
Section 2.1: Why Xamarin Forms and When to use Xamarin Forms
.......................................................................
7
Chapter 3: Xamarin Forms Layouts
....................................................................................................................
8
Section 3.1: AbsoluteLayout
Section 3.2: Grid
Section 3.3: ContentPresenter
Section 3.4: ContentView
Section 3.5: ScrollView
Section 3.6: Frame
Section 3.7: TemplatedView
Section 3.8: RelativeLayout
Section 3.9: StackLayout
..........................................................................................................................................
8
...........................................................................................................................................................
10
....................................................................................................................................
11
............................................................................................................................................
................................................................................................................................................
.......................................................................................................................................................
.......................................................................................................................................
........................................................................................................................................
............................................................................................................................................
Chapter 4: Xamarin Relative Layout
...............................................................................................................
19
Section 4.1: Box after box
Section 4.2: Page with an simple label on the middle
...........................................................................................................................................
19
.............................................................................................
21
Chapter 5: Navigation in Xamarin.Forms
Section 5.1: NavigationPage flow with XAML
Section 5.2: NavigationPage flow
Section 5.3: Master Detail Navigation
Section 5.4: Using INavigation from view model
Section 5.5: Master Detail Root Page
Section 5.6: Hierarchical navigation with XAML
Section 5.7: Modal navigation with XAML
.......................................................................................................
............................................................................................................
..............................................................................................................................
.......................................................................................................................
.....................................................................................................
26
........................................................................................................................
.......................................................................................................
.................................................................................................................
Chapter 6: Xamarin.Forms Page
........................................................................................................................
32
Section 6.1: TabbedPage
Section 6.2: ContentPage
Section 6.3: MasterDetailPage
Chapter 7: Xamarin.Forms Cells
............................................................................................................................................
...........................................................................................................................................
...................................................................................................................................
.........................................................................................................................
36
Section 7.1: EntryCell
Section 7.2: SwitchCell
Section 7.3: TextCell
Section 7.4: ImageCell
Section 7.5: ViewCell
...................................................................................................................................................
36
.................................................................................................................................................
36
....................................................................................................................................................
37
.................................................................................................................................................
38
....................................................................................................................................................
39
Chapter 8: Xamarin.Forms Views
.......................................................................................................................
41
Section 8.1: Button
Section 8.2: DatePicker
Section 8.3: Entry
Section 8.4: Editor
Section 8.5: Image
Section 8.6: Label
.......................................................................................................................................................
41
...............................................................................................................................................
42
.........................................................................................................................................................
........................................................................................................................................................
.......................................................................................................................................................
........................................................................................................................................................
Chapter 9: Using ListViews
.....................................................................................................................................
47
Section 9.1: Pull to Refresh in XAML and Code behind
............................................................................................
47
12
13
14
14
15
16
23
23
24
25
28
29
31
Advertisement
32
33
34
43
43
44
45
48
48
56
56
57
59
61
65
70
70
78
79
79
96
99
Chapter 10: Display Alert
Section 10.1: DisplayAlert
Section 10.2: Alert Example with only one button and action
........................................................................................................................................
............................................................................................................................................
.................................................................................
49
Chapter 11: Accessing native features with DependencyService
.......................................................
50
Section 11.1: Implementing text-to-speech
Section 11.2: Getting Application and Device OS Version Numbers - Android & iOS - PCL
................................................................................................................
.................................
53
50
Chapter 12: DependencyService
Section 12.1: Android implementation
Section 12.2: Interface
Section 12.3: iOS implementation
Section 12.4: Shared code
.........................................................................................................................
55
........................................................................................................................
55
.................................................................................................................................................
...............................................................................................................................
...........................................................................................................................................
Chapter 13: Custom Renderers
............................................................................................................................
58
Section 13.1: Accessing renderer from a native project
Section 13.2: Rounded label with a custom renderer for Frame (PCL & iOS parts)
Section 13.3: Custom renderer for ListView
Section 13.4: Custom Renderer for BoxView
Section 13.5: Rounded BoxView with selectable background color
..............................................................................................................
.............................................................................................................
.......................................................................
...........................................................................................
58
.............................................
58
Chapter 14: Caching
..................................................................................................................................................
68
Section 14.1: Caching using Akavache
.......................................................................................................................
68
Chapter 15: Gestures
.................................................................................................................................................
70
.........................................................................................................................................
Section 15.1: Make an Image tappable by adding a TapGestureRecognizer
Section 15.2: Gesture Event
Section 15.3: Zoom an Image with the Pinch gesture
Section 15.4: Show all of the zoomed Image content with the PanGestureRecognizer
Section 15.5: Tap Gesture
Section 15.6: Place a pin where the user touched the screen with MR.Gestures
..............................................................................................
.......................................
78
...........................................................................................................................................
.......................................................
..................................................
Chapter 16: Data Binding
........................................................................................................................................
81
Section 16.1: Basic Binding to ViewModel
..................................................................................................................
81
Chapter 17: Working with Maps
...........................................................................................................................
83
Section 17.1: Adding a map in Xamarin.Forms (Xamarin Studio)
...........................................................................
83
Chapter 18: Custom Fonts in Styles
...................................................................................................................
92
Section 18.1: Accessing custom Fonts in Syles
..........................................................................................................
92
Chapter 19: Push Notifications
.............................................................................................................................
94
Section 19.1: Push notifications for Android with Azure
Section 19.2: Push notifications for iOS with Azure
Section 19.3: iOS Example
...........................................................................................
94
..................................................................................................
...........................................................................................................................................
Chapter 20: Eects
..................................................................................................................................................
101
Section 20.1: Adding platform specific Eect for an Entry control
......................................................................
101
Chapter 21: Triggers & Behaviours
..................................................................................................................
105
Section 21.1: Xamarin Forms Trigger Example
Section 21.2: Multi Triggers
.......................................................................................................
105
.......................................................................................................................................
106
Chapter 22: AppSettings Reader in Xamarin.Forms
..............................................................................
107
Section 22.1: Reading app.config file in a Xamarin.Forms Xaml project
.............................................................
107
Chapter 23: Creating custom controls
...........................................................................................................
108
Section 23.1: Label with bindable collection of Spans
Section 23.2: Implementing a CheckBox Control
Section 23.3: Create an Xamarin Forms custom input control (no native required)
Section 23.4: Creating a custom Entry control with a MaxLength property
...........................................................................................
...................................................................................................
.........................................
Advertisement
116
.......................................................
118
108
110
Section 23.5: Creating custom Button
.....................................................................................................................
119
Chapter 24: Working with local databases
Section 24.1: Using SQLite.NET in a Shared Project
Section 24.2: Working with local databases using xamarin.forms in visual studio 2015
................................................................................................
...............................................................................................
...................................
123
121
121
Chapter 25: CarouselView - Pre-release version
.....................................................................................
133
Section 25.1: Import CarouselView
Section 25.2: Import CarouselView into a XAML Page
..........................................................................................................................
133
..........................................................................................
133
Chapter 26: Exception handling
........................................................................................................................
135
Section 26.1: One way to report about exceptions on iOS
Chapter 27: SQL Database and API in Xamarin Forms.
....................................................................................
135
........................................................................
137
Section 27.1: Create API using SQL database and implement in Xamarin forms,
..............................................
137
Chapter 28: Contact Picker - Xamarin Forms (Android and iOS)
....................................................
138
Section 28.1: contact_picker.cs
Section 28.2: MyPage.cs
Section 28.3: ChooseContactPicker.cs
Section 28.4: ChooseContactActivity.cs
Section 28.5: MainActivity.cs
Section 28.6: ChooseContactRenderer.cs
................................................................................................................................
...........................................................................................................................................
....................................................................................................................
..................................................................................................................
....................................................................................................................................
...............................................................................................................
141
Chapter 29: Xamarin Plugin
Section 29.1: Media Plugin
Section 29.2: Share Plugin
Section 29.3: ExternalMaps
Section 29.4: Geolocator Plugin
Section 29.5: Messaging Plugin
Section 29.6: Permissions Plugin
................................................................................................................................
........................................................................................................................................
........................................................................................................................................
......................................................................................................................................
...............................................................................................................................
...............................................................................................................................
..............................................................................................................................
151
Chapter 30: OAuth2
.................................................................................................................................................
155
Section 30.1: Authentication by using Plugin
..........................................................................................................
155
Chapter 31: MessagingCenter
Section 31.1: Simple example
Section 31.2: Passing arguments
Section 31.3: Unsubscribing
.............................................................................................................................
157
....................................................................................................................................
.............................................................................................................................
......................................................................................................................................
Chapter 32: Generic Xamarin.Forms app lifecycle? Platform-dependant!
................................
159
Section 32.1: Xamarin.Forms lifecycle is not the actual app lifecycle but a cross-platform representation of
..........................................................................................................................................................................
it
159
Chapter 33: Platform-specific behaviour
.....................................................................................................
161
Section 33.1: Removing icon in navigation header in Anroid
Section 33.2: Make label's font size smaller in iOS
................................................................................
161
................................................................................................
161
Chapter 34: Platform specific visual adjustments
..................................................................................
163
Section 34.1: Idiom adjustments
Section 34.2: Platform adjustments
Section 34.3: Using styles
Section 34.4: Using custom views
Chapter 35: Dependency Services
...............................................................................................................................
........................................................................................................................
.........................................................................................................................................
............................................................................................................................
...................................................................................................................
165
Section 35.1: Access Camera and Gallery
...............................................................................................................
165
Chapter 36: Unit Testing
.......................................................................................................................................
166
Section 36.1: Testing the view models
.....................................................................................................................
166
Chapter 37: BDD Unit Testing in Xamarin.Forms
.....................................................................................
172
Section 37.1: Simple Specflow to test commands and navigation with NUnit Test Runner
..............................
172
138
138
139
139
140
144
144
146
147
148
150
157
157
158
163
163
164
Advertisement
164
Section 37.2: Advanced Usage for MVVM
..............................................................................................................
174
Credits
............................................................................................................................................................................
175
You may also like
......................................................................................................................................................
176
About
Please feel free to share this PDF with anyone for free,
latest version of this book can be downloaded from:
https://goalkicker.com/XamarinFormsBook
This Xamarin.Forms Notes for Professionals book is compiled from Stack Overflow
Documentation, the content is written by the beautiful people at Stack Overflow.
Text content is released under Creative Commons BY-SA, see credits at the end
of this book whom contributed to the various chapters. Images may be copyright
of their respective owners unless otherwise specified
This is an unofficial free book created for educational purposes and is not
affiliated with official Xamarin.Forms group(s) or company(s) nor Stack Overflow.
All trademarks and registered trademarks are the property of their respective
company owners
The information presented in this book is not guaranteed to be correct nor
accurate, use at your own risk
Please send feedback and corrections to [email protected]
GoalKicker.com – Xamarin.Forms Notes for Professionals
1
Chapter 1: Getting started with
Xamarin.Forms
Version Release Date
3.0.0
2.5.0
2.4.0
2.3.1
2018-05-07
2017-11-15
2017-09-27
2016-08-03
2.3.0-hotfix1 2016-06-29
2.3.0
2016-06-16
2.2.0-hotfix1 2016-05-30
2.2.0
2.1.0
2.0.1
2.0.0
1.5.1
1.5.0
1.4.4
1.4.3
1.4.2
1.4.1
1.4.0
1.3.5
1.3.4
1.3.3
1.3.2
1.3.1
1.3.0
1.2.3
1.2.2
1.2.1
1.2.0
1.1.1
1.1.0
1.0.1
2016-04-27
2016-03-13
2016-01-20
2015-11-17
2016-10-20
2016-09-25
2015-07-27
2015-06-30
2015-04-21
2015-03-30
2015-03-09
2015-03-02
2015-02-17
2015-02-09
2015-02-03
2015-01-04
2014-12-24
2014-10-02
2014-07-30
2014-07-14
2014-07-11
2014-06-19
2014-06-12
2014-06-04
Section 1.1: Installation (Visual Studio)
Xamarin.Forms is a cross-platform natively backed UI toolkit abstraction that allows developers to easily create user
interfaces that can be shared across Android, iOS, Windows, and Windows Phone. The user interfaces are rendered
using the native controls of the target platform, allowing Xamarin.Forms applications to retain the appropriate look
and feel for each platform.
Xamarin Plugin for Visual Studio
To get started with Xamarin.Forms for Visual Studio you need to have the Xamarin plugin itself. The easiest way to
have it installed is to download and install the latest Visual Studio.
GoalKicker.com – Xamarin.Forms Notes for Professionals
2
If you already have the latest Visual Studio installed, go to Control Panel > Programs and Features, right click on
Visual Studio, and click Change. When the installer opens, click on Modify, and select the cross-platform mobile
development tools:
You can also select to install the Android SDK:
Uncheck it if you already have the SDK installed. You will be able to setup Xamarin to use existing Android SDK later.
Xamarin.Forms
Xamarin.Forms is a set of libraries for your Portable Class library and native assemblies. The Xamarin.Forms library
itself is available as a NuGet package. To add it to your project just use the regular Install-Package command of
the Package Manager Console:
Install-Package Xamarin.Forms
for all of your initial assemblies (for example MyProject, MyProject.Droid and MyProject.iOS).
The easiest way to get started with Xamarin.Forms is to create an empty project in Visual Studio:
GoalKicker.com – Xamarin.Forms Notes for Professionals
3
As you can see there are 2 available options to create the blank app -- Portable and Shared. I recommend you to get
started with Portable one because it's the most commonly used in the real world (differences and more explanation
to be added).
After creating the project make sure you're using the latest Xamarin.Forms version as your initial template may
contain the old one. Use your Package Manager Console or Manage NuGet Packages option to upgrade to the latest
Xamarin.Forms (remember it's just a NuGet package).
While the Visual Studio Xamarin.Forms templates will create an iOS platform project for you, you will need to
connect Xamarin to a Mac build host to be able to run these projects on the iOS Simulator or physical devices.
Section 1.2: Hello World Xamarin Forms: Visual Studio
After successfully installing Xamarin as described in the first example, it's time to launch the first sample
application.
Step 1: Creating a new Project.
In Visual Studio, choose New -> Project -> Visual C# -> Cross-Platform -> Blank App (Xamarin.Forms Portable)
Name the app "Hello World" and select the location to create the project and click OK. This will create a solution for
you which contains three projects:
1.
2.
3.
HelloWorld (this is where your logic and views is placed, i.e. the portable project)
HelloWorld.Droid (the Android project)
HelloWorld.iOS (the iOS project)
GoalKicker.com – Xamarin.Forms Notes for Professionals
4
Step 2: Investigating the sample
Having created the solution, a sample application will be ready to be deployed. Open the App.cs located in the root
of the portable project and investigate the code. As seen below, the Contents of the sample is a StackLayout which
contains a Label:
using Xamarin.Forms;
namespace Hello_World
{
public class App : Application
Advertisement
{
public App()
{
// The root page of your application
MainPage = new ContentPage
{
Content = new StackLayout
{
VerticalOptions = LayoutOptions.Center,
Children = {
new Label {
HorizontalTextAlignment = TextAlignment.Center,
Text = "Welcome to Xamarin Forms!"
}
}
}
};
}
protected override void OnStart()
GoalKicker.com – Xamarin.Forms Notes for Professionals
5
{
// Handle when your app starts
}
protected override void OnSleep()
{
// Handle when your app sleeps
}
protected override void OnResume()
{
// Handle when your app resumes
}
}
}
Step 3: Launching the application
Now simply right-click the project you want to start (HelloWorld.Droid or HelloWorld.iOS) and click Set as
StartUp Project. Then, in the Visual Studio toolbar, click the Start button (the green triangular button that
resembles a Play button) to launch the application on the targeted simulator/emulator.
GoalKicker.com – Xamarin.Forms Notes for Professionals
6
Chapter 2: Why Xamarin Forms and When
to use Xamarin Forms
Section 2.1: Why Xamarin Forms and When to use Xamarin
Forms
Xamarin is becoming more and more popular - it is hard to decide when to use Xamarin.Forms and when
Xamarin.Platform (so Xamarin.iOS and Xamarin.Android).
First of all you should know for what kind of applications you can use Xamarin.Forms:
1.
Prototypes - to visualize how your application will look on the different devices.
2.
Applications which not require platform specific functionality (like APIs) - but here please note that Xamarin is
working busily to provide as many cross-platform compatibility as possible.
3.
Applications where code sharing is crucial - more important than UI.
4.
Applications where data displayed is more important than advanced functionality
There are also many other factors:
1.
Who will be responsible for application development - if your team consists of experienced mobile
developers they will be able to handle Xamarin.Forms easily. But if you have one developer per platform
(native development) Forms can be bigger challenge.
2.
Please also note that with Xamarin.Forms you can still encounter some issues sometimes - Xamarin.Forms
platform is still being improved.
3.
Fast development is sometimes very important - to reduce costs and time you can decide to use Forms.
4.
When developing enterprise applications without any advanced functionality it is better to use
Xamarin.Forms - it enables you to share mode code not event in mobile area but in general. Some portions
of code can be shared across many platforms.
You should not use Xamarin.Forms when:
1.
You have to create custom functionality and and access platform specific APIs
2.
You have to create custom UI for the mobile application
3.
When some functionality is not ready for Xamarin.Forms (like some specific behaviour on the mobile device)
4.
Your team consists of platform specific mobile developers (mobile development in Java and/or
Swift/Objective C)
GoalKicker.com – Xamarin.Forms Notes for Professionals
7
Chapter 3: Xamarin Forms Layouts
Section 3.1: AbsoluteLayout
AbsoluteLayout positions and sizes child elements proportional to its own size and position or by absolute values.
Child views may be positioned and sized using proportional values or static values, and proportional and static
values can be mixed.
A definition of an AbsoluteLayout in XAML looks like this:
<AbsoluteLayout>
<Label Text="I'm centered on iPhone 4 but no other device"
AbsoluteLayout.LayoutBounds="115,150,100,100" LineBreakMode="WordWrap" />
<Label Text="I'm bottom center on every device."
AbsoluteLayout.LayoutBounds=".5,1,.5,.1" AbsoluteLayout.LayoutFlags="All"
LineBreakMode="WordWrap" />
<BoxView Color="Olive" AbsoluteLayout.LayoutBounds="1,.5, 25, 100"
AbsoluteLayout.LayoutFlags="PositionProportional" />
<BoxView Color="Red" AbsoluteLayout.LayoutBounds="0,.5,25,100"
AbsoluteLayout.LayoutFlags="PositionProportional" />
<BoxView Color="Blue" AbsoluteLayout.LayoutBounds=".5,0,100,25"
AbsoluteLayout.LayoutFlags="PositionProportional" />
<BoxView Color="Blue" AbsoluteLayout.LayoutBounds=".5,0,1,25"
AbsoluteLayout.LayoutFlags="PositionProportional, WidthProportional" />
</AbsoluteLayout>
The same layout would look like this in code:
Title = "Absolute Layout Exploration - Code";
var layout = new AbsoluteLayout();
var centerLabel = new Label {
Text = "I'm centered on iPhone 4 but no other device.",
LineBreakMode = LineBreakMode.WordWrap};
AbsoluteLayout.SetLayoutBounds (centerLabel, new Rectangle (115, 159, 100, 100));
GoalKicker.com – Xamarin.Forms Notes for Professionals
8
// No need to set layout flags, absolute positioning is the default
var bottomLabel = new Label { Text = "I'm bottom center on every device.", LineBreakMode =
LineBreakMode.WordWrap };
AbsoluteLayout.SetLayoutBounds (bottomLabel, new Rectangle (.5, 1, .5, .1));
AbsoluteLayout.SetLayoutFlags (bottomLabel, AbsoluteLayoutFlags.All);
var rightBox = new BoxView{ Color = Color.Olive };
AbsoluteLayout.SetLayoutBounds (rightBox, new Rectangle (1, .5, 25, 100));
AbsoluteLayout.SetLayoutFlags (rightBox, AbsoluteLayoutFlags.PositionProportional);
var leftBox = new BoxView{ Color = Color.Red };
AbsoluteLayout.SetLayoutBounds (leftBox, new Rectangle (0, .5, 25, 100));
AbsoluteLayout.SetLayoutFlags (leftBox, AbsoluteLayoutFlags.PositionProportional);
var topBox = new BoxView{ Color = Color.Blue };
AbsoluteLayout.SetLayoutBounds (topBox, new Rectangle (.5, 0, 100, 25));
AbsoluteLayout.SetLayoutFlags (topBox, AbsoluteLayoutFlags.PositionProportional);
var twoFlagsBox = new BoxView{ Color = Color.Blue };
AbsoluteLayout.SetLayoutBounds (topBox, new Rectangle (.5, 0, 1, 25));
AbsoluteLayout.SetLayoutFlags (topBox, AbsoluteLayoutFlags.PositionProportional |
AbsoluteLayout.WidthProportional);
layout.Children.Add (bottomLabel);
layout.Children.Add (centerLabel);
layout.Children.Add (rightBox);
layout.Children.Add (leftBox);
layout.Children.Add (topBox);
The AbsoluteLayout control in Xamarin.Forms allows you to specify where exactly on the screen you want the child
elements to appear, as well as their size and shape (bounds).
There are a few different ways to set the bounds of the child elements based on the AbsoluteLayoutFlags
enumeration that are used during this process. The AbsoluteLayoutFlags enumeration contains the following
values:
All: All dimensions are proportional.
HeightProportional: Height is proportional to the layout.
None: No interpretation is done.
PositionProportional: Combines XProportional and YProportional.
SizeProportional: Combines Widt...