Book Image

Mastering Xamarin UI Development

By : Steven F. Daniel
Book Image

Mastering Xamarin UI Development

By: Steven F. Daniel

Overview of this book

<p>Xamarin is the most powerful cross-platform mobile development framework. If you are interested in creating stunning user interfaces for the iOS and Android mobile platforms using the power of Xamarin and Xamarin.Forms, then this is your ticket.</p> <p>This book will provide you the practical skills required to develop real-world Xamarin applications. You will learn how to implement UI structures and layouts, create customized elements, and write C# scripts to customize layouts. You will create UI layouts from scratch so that you can tweak and customize a given UI layout to suit your needs by using Data Templates.</p> <p>Moving on, you will use third-party libraries – such as the Razor template engine that allows you to create your own HTML5 templates within the Xamarin environment – to build a book library Hybrid solution that uses the SQLite.Net library to store, update, retrieve, and delete information within a SQLite local database. You’ll also implement key data-binding techniques that will make your user interfaces dynamic, and create personalized animations and visual effects within your user interfaces using Custom Renderers and the PlatformEffects API to customize and change the appearance of control elements.</p> <p>At the end of this book, you will test your application UI for robust and consistent behavior and then explore techniques to deploy to different platforms.</p>
Table of Contents (19 chapters)
Mastering Xamarin UI Development
Credits
About the Author
Acknowledgments
About the Reviewers
www.PacktPub.com
Customer Feedback
Dedication
Preface

Preface

Xamarin is the most powerful cross-platform mobile development framework. If you are interested in creating stunning user interfaces for the iOS and Android mobile platforms using the power of Xamarin and Xamarin.Forms, then this is your ticket.

This book will provide you with the practical skills required to develop real-world Xamarin applications. You will learn how to implement user interface structures and layouts, create customized elements, and write C# scripts to customize layouts. You’ll learn how to create User Interface layouts from scratch and customize these layouts to suit your needs by using Data Templates and Custom Renderers.

You’ll be introduced to the architecture behind the Model-View-ViewModel (MVVM) pattern, and how to implement this within your application so that you can navigate between each of your ViewModels and ContentPages.

We will then move on to discuss more advanced topics, such as how to incorporate platform-specific features within your apps that are dependent on the mobile platform being run, and you will learn how to properly perform location updates, whether the application's state is in the foreground or background, by registering the app as a background-necessary application.

We discuss more advanced topics, such as working with Microsoft Azure App services to create your very first cloud-based backend HTTP web service to handle communication between the cloud and the app, by creating a DataService API that will allow our app to consume the API so that it can retrieve, store, and delete walk trail information from the cloud.

We will also cover how you can work with the Facebook SDK to incorporate social networking features to obtain information about a Facebook user, as well as post information to their Facebook wall and use the Open Graph API to retrieve certain information about the user.

Moving on, you will learn how to use third-party libraries, such as the Razor template engine, which allows you to create your own HTML5 templates, within the Xamarin Studio environment to build a book library Hybrid solution that uses the SQLite.Net library to store, update, retrieve, and delete information within a SQLite local database. You’ll also implement key data binding techniques that will make your user interfaces dynamic and create personalized animations and visual effects within your user interfaces using custom renderers and the PlatformEffects API to customize and change the appearance of control elements.

At the end of this book, you will learn how to create and run unit tests using the NUnit and UITest testing frameworks right within the Xamarin Studio IDE. You'll learn how to write unit tests for your ViewModels that will essentially test the business logic to validate that everything is working correctly, before moving on to test the user interface portion using automated UI testing.

In this book, I have tried my best to keep the code simple and easy to understand by providing a step-by-step approach, with lots of screenshots at each step to make it easier to follow. You will soon master the different aspects of Xamarin.Forms, and the technology and skills needed to create your own applications for the Xamarin.Forms platform.

Feel free to contact me at [email protected] with any queries, or just drop me an e-mail to say a friendly "Hello".

What this book covers

Chapter 1, Creating the TrackMyWalks Native App, focuses on how to set up a basic cross-platform native app structure using Xamarin.Forms before proceeding with adding new, and updating existing, packages within your solution.

You’ll learn how to create C# classes that will act as the model for our app, and will create content pages that will form the user interface. We will also cover the differences between developing apps using Xamarin Studio and Microsoft Visual Studio.

Chapter 2, MVVM and Data Binding, introduces you to the architecture behind the MVVM pattern, and how you can implement this within your application by adding new Views and the associated Models.

You’ll learn how to create the underlying C# class files that will act as the ViewModels for your app, and update existing content pages to data-bind with the ViewModels to represent the information that will be displayed within the user interface for our application.

Chapter 3, Navigating within the MVVM Model - The Xamarin.Forms Way, builds upon your working knowledge of the MVVM design pattern architecture to show you how you can navigate through the ViewModels by creating a C# class that acts as the navigation service for our app, and updates our existing WalkBaseViewModel class to include additional abstract class methods each of our ViewModels will inherit; in turn, you'll update content pages to bind with the ViewModels to allow navigation between these Views to happen.

Chapter 4, Adding Location-Based Features within Your App, focuses on how you can incorporate platform-specific features within the TrackMyWalks app, which is dependent on the mobile platform, by creating a location service C# class that will include several class methods for both the iOS and Android platforms.

You’ll learn how to properly perform location updates whether the application's state is in the foreground or background by registering the app as a background-necessary application.

Chapter 5, Customizing the User Interface, shows you how you can work with DataTemplates to lay out your views neatly within your applications user interface by creating a C# class. You’ll get accustomed to working with platform-specific APIs to extend the default behavior of Xamarin.Forms controls using custom renderers to create a custom picker, before moving on to learn how to use the Xamarin.Forms Effects API to customize the appearance and styling of native control elements for each platform by implementing a CustomRenderer class.

Finally, you will learn how to manipulate the visual appearance of data bound using value and image converters.

Chapter 6, Working with Razor Templates, introduces you to the Razor HTML templating engine, and how you can use it to create a hybrid mobile solution. You'll learn how to build a book library mobile solution using the power of Razor templates, how to create and use models within your application, and how to connect this up to a SQLite database to store, retrieve, update, and delete book details.

Chapter 7, Incorporating API Data Access using Microsoft Azure App Services, shows you how you can use Microsoft Azure App services to create your very first live, cloud-based backend HTTP web service to handle all the communication between the cloud and the app. You’ll learn how to create a DataService API that will allow the app to consume the API so that it can retrieve, store, and delete walk trail information from the cloud, all from within the TrackMyWalks app.

Chapter 8, Making our App Social – Using the Facebook API, shows you how you can use both Xamarin.Auth and the Facebook SDK to incorporate social networking features within the TrackMyWalks app to obtain information about a Facebook user, as well as post information to their Facebook wall.

You’ll learn how to create a sign-in page that allows users to log in to your app using their Facebook credentials, and how to create a FacebookApiUser class that will be used to store information about the logged-in user, and use the Open Graph API to retrieve certain information about the user.

Finally, you will see how you can leverage the Facebook library to post walk data to your Facebook profile page, so you can show off your Walk Trail progress to your friends and/or work colleagues.

Chapter 9, Unit Testing your Xamarin.Forms App using the NUnit and UITest Frameworks, focuses on showing you how to create and run unit tests using the NUnit and UITest testing frameworks right within the Xamarin Studio IDE. You'll learn how to write unit tests for our ViewModels that will essentially test the business logic to validate that everything is working correctly before testing the user interface's portion using automated UI testing.

Chapter 10, Packaging and Deploying your Xamarin.Forms Applications, focuses on how to submit your TrackMyWalks iOS app to the Apple App Store, and share your creations with the rest of the community. You'll learn the steps required to set up your iOS development team, as well as certificates for both development and distribution, and you will learn how to create the necessary provisioning profiles for both your development and distribution builds and create the necessary app IDs for your application.

Finally, you will learn how to register your iOS devices so that your users can download and test your apps on their iOS devices and learn how to prepare your TrackMyWalks iOS app for submission to iTunes Connect using the Xamarin Studio IDE.

What you need for this book

The minimum requirement for this book is an Intel-based Macintosh computer running OS X El Capitan 10.11. We will be using Xamarin Studio 6.1.2, which is the Integrated Development Environment (IDE) used for creating Xamarin.Forms applications using C#, as well as Xcode 8.2.1 to compile our iOS app and run this within the simulator.

Almost all the projects that you create with the help of this book will work and run on the iOS simulator. However, some projects will require an iOS or Android device to work correctly. You can download the latest versions of Xamarin Studio and Xcode at:

Xamarin Studio: http://xamarin.com/download

Xcode: https://itunes.apple.com/au/app/xcode/id497799835?mt=12

Who this book is for

This book is intended for developers who have a working experience of application development principles, as well as a basic knowledge of Xamarin and C# coding and wish to expand their knowledge and develop applications using Xamarin.Forms. It is assumed that you are familiar with Object-Oriented Programming (OOP), and have some experience developing C# applications using Xamarin Studio.

Conventions

In this book, you will find a number of text styles that distinguish between different kinds of information. Here are some examples of these styles and an explanation of their meaning.

Code words in text, database table names, folder names, filenames, file extensions, pathnames, dummy URLs, user input, and Twitter handles are shown as follows: "One thing you will notice is that our solution contains a file called TrackMyWalks.cs which is part of the TrackMyWalks Portable Class Library."

A block of code is set as follows:

    //
    //  WalkEntryViewModel.cs
    //  TrackMyWalks ViewModels
    // 
    //  Created by Steven F. Daniel on 22/08/2016.
    //  Copyright © 2016 GENIESOFT STUDIOS. All rights reserved.
    //  using TrackMyWalks.Models;
        using TrackMyWalks.ViewModels;
        using Xamarin.Forms;
        namespace TrackMyWalks
       {
           public class WalkEntryViewModel : WalkBaseViewModel
           {

When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:

    //
    //  WalksPage.cs
    //  TrackMyWalks
    //
    //  Created by Steven F. Daniel on 04/08/2016.
    //  Copyright © 2016 GENIESOFT STUDIOS. All rights reserved.
    //
    using System.Collections.Generic;
    using Xamarin.Forms;
    using TrackMyWalks.Models;
    using TrackMyWalks.ViewModels;
    namespace TrackMyWalks
    {
        public class WalksPage : ContentPage
        {
            public WalksPage()
            {

Any command-line input or output is written as follows:

    Last login: Sun Nov 6 10:48:41 on console
    GENIESOFT-MAC-Mini:~ stevendaniel$ curl
    https://trackmywalks.azurewebsites.net/tables/walkentries 
    --header "ZUMO-API-VERSION:2.0.0"

New terms and important words are shown in bold. Words that you see on the screen, for example, in menus or dialog boxes, appear in the text like this: "if you click on the Proceed With ... button, it will navigate to the walks Trail Details page where you can begin your trail, by clicking on the Begin this Trail button."

Note

Warnings or important notes appear in a box like this.

Tip

Tips and tricks appear like this.

Reader feedback

Feedback from our readers is always welcome. Let us know what you think about this book-what you liked or disliked. Reader feedback is important for us as it helps us develop titles that you will really get the most out of. To send us general feedback, simply e-mail [email protected], and mention the book's title in the subject of your message. If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, see our author guide at www.packtpub.com/authors.

Customer support

Now that you are the proud owner of a Packt book, we have a number of things to help you to get the most from your purchase.

Downloading the example code

You can download the example code files for this book from your account at http://www.packtpub.com. If you purchased this book elsewhere, you can visit http://www.packtpub.com/support and register to have the files e-mailed directly to you.

You can download the code files by following these steps:

  1. Log in or register to our website using your e-mail address and password.

  2. Hover the mouse pointer on the SUPPORT tab at the top.

  3. Click on Code Downloads & Errata.

  4. Enter the name of the book in the Search box.

  5. Select the book for which you're looking to download the code files.

  6. Choose from the drop-down menu where you purchased this book from.

  7. Click on Code Download.

Once the file is downloaded, please make sure that you unzip or extract the folder using the latest version of:

  • WinRAR / 7-Zip for Windows

  • Zipeg / iZip / UnRarX for Mac

  • 7-Zip / PeaZip for Linux

The code bundle for the book is also hosted on GitHub at https://github.com/PacktPublishing/Mastering-Xamarin-UI-Development. We also have other code bundles from our rich catalog of books and videos available at https://github.com/PacktPublishing/. Check them out!

Errata

Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you find a mistake in one of our books-maybe a mistake in the text or the code-we would be grateful if you could report this to us. By doing so, you can save other readers from frustration and help us improve subsequent versions of this book. If you find any errata, please report them by visiting http://www.packtpub.com/submit-errata, selecting your book, clicking on the Errata Submission Form link, and entering the details of your errata. Once your errata are verified, your submission will be accepted and the errata will be uploaded to our website or added to any list of existing errata under the Errata section of that title.

To view the previously submitted errata, go to https://www.packtpub.com/books/content/support and enter the name of the book in the search field. The required information will appear under the Errata section.

Piracy

Piracy of copyrighted material on the Internet is an ongoing problem across all media. At Packt, we take the protection of our copyright and licenses very seriously. If you come across any illegal copies of our works in any form on the Internet, please provide us with the location address or website name immediately so that we can pursue a remedy.

Please contact us at [email protected] with a link to the suspected pirated material.

We appreciate your help in protecting our authors and our ability to bring you valuable content.

Questions

If you have a problem with any aspect of this book, you can contact us at [email protected], and we will do our best to address the problem.