Xamarin Notes - Set Up the Environment (Windows and IOS)

Introduction

I always worked as web or desktop developer using the .NET framework, C# language, but Angular was dominant in the front-end of some of the projects. In Tunisia, we talk always about the future of Mobile application development, but I wasn’t gifted to switch to another language, this is from a few years, but for my social project, I tried to build a sample using the Hybrid framework with AngularJS and Ionic, Cordova… But it wasn’t as easy as I thought. After, when Microsoft bought Xamarin in February 2016 following a strategy to be open and that their software will run everywhere, not only Windows. Following the acquisition of Xamarin by Microsoft, there has been an increasing demand for professionals who can unite C# development with fully featured cross-platform mobile development tool able to share Business Logic and code to deliver fully native application, it hasn’t stopped evolving since 2011.

So, Xamarin was a solution to start developing cross-platform apps, it gives you a smooth user interface with native output iOS, Android even UWP.

With Xamarin.Forms, the user interface is dedicated to all three platforms using one framework that is XAML. It’s very interesting if we are able to release an app with the max code sharing for 3 platforms.

This course aims to introduce Xamarin multi-platform development framework in my way of learning.

Xamarin is well documented with free and paid resources, the best for me to start is Xamarin University. There’s no limit to the knowledge you can obtain.

If we start learning Xamarin, we will find two approach development, the first one is to use Xamarin.Forms where you will build all in a Portable project using XAML and C# or using Xamarin. Android or Xamarin. iOS, in this case, we will use specific native environments like StoryBoard for iOS with C#.

This is an overview about Xamarin:

“Xamarin’s not one thing, but many.”

This is a small description related to Xamarin, you can find more documents describing the advantage and cons.

Xamarin lets you create Native Apps using C#.

In the other part, I will start by defining the hardware and software requirements, you will get what you need to know to start building any application even with no mobile experience.

Background

• Should have a basic knowledge of C# and some Mobile basis.

Set Up the Environment (Windows and IOS)

It is important to note that the tools evolve very fast and it may be that, depending on when you read this post, it is not as useful.

If you want to build an Android application, you need Visual Studio 2017 in Windows or Visual Studio 2017 Mac, but if you build the iOS application, you can use Visual Studio 2017 in Windows but you have to compile using a MAC or you use Visual Studio 2017 Mac, this is imposed by Apple.

1. System Requirements
   1. Windows
      • Windows 10
      • Core i7, 16 GB RAM (to work more comfortable and the minimum requirement can be Core i5, 4GB RAM)
      • Visual Studio 2017 (In this case, it is not important whether the version is Enterprise or Community)
   2. Mac
      • Mac OS 11 (until writing this document, but we always use the last version)
      • Core i7, 16 GB RAM, and 256 SSD
      • Visual Studio for Mac
      • XCode 9 (or the last version)

UWP

It only works on Windows and its installation is very simple, summarizing the selection of the option "Development with the Universal Platform of Windows" as an Option to install environment for UWP development and the choice of SDKs: IntelliTrace and SDK for Windows 10.

Setting Up the Environment

You can find all needed requirements for Windows or iOS in this documentation:

• System requirements

But for both of them, we have to install the latest version of Visual Studio, until writing this document, we have Visual Studio 2017 (for Windows and for MAC): https://www.visualstudio.com/

1. Windows

We can install what we want, the community or professional or enterprise. We choose Mobile development with .NET.

2. IOS

The installation of Visual Studio for Mac is very similar to that of Visual Studio for Windows. You can choose the components and at this point, you may prefer not to install the Android SDK, since you will already have installed in Windows. Now if you do not use Windows, you will have to install the Android SDK and the process that I will describe below can be applied from Mac without any problem.

If you are on MAC, the website will detect that and display the download part for Community or others:

Emulator does not. Simulator.”

The iOS simulator is not an emulator. This has a big difference. There are things that only work on the physical device.

Simulators are installed with XCode. By default, when installing the IDE, some already installed, but if you want to add some more, click on code, then go to Preferences, Downloads, components and select the Simulators you want. Whenever you install / update XCode run it. Generally, a window for accepting the terms of use may appear. If you do not accept the terms, Visual Studio for Mac may not identify the simulators.

For more details, check out this link.

1. Prerequisite for Android

Android basically needs the following components:

• Java 64-bit SDK (JDK)
• Android SDK
• Android NDK is optional, but anyway, I install

When you install Xamarin via Visual Studio, it already installs all these components. However, until the latest version, the installer downloads the 32-bit JDK, which is incompatible.

Another point is that it installs them in C: / Program Files /RepositoryName, this is not safe because you can get an error related to the character size of the path that may exceed 256 characters, and in this path, you can have a space and this can cause many problems.

So, to prevent all these problems, you install each one manually in C: / and then add its paths in Windows environment variables.

C:/java
C:/android-sdk
C:/android-ndk

Placing these components in environment variables ensures that if I need to use any other development platform that also needs these components, they will already be there, ready for use.

1.a. To install JDK

You download it from this link.

Your installer here. Make sure this is the most current version.

Once installed, add the following system variables:

• JAVA_HOME with the value C: / java / jdk {installed version}
• CLASSPATH with the value.;% JAVA_HOME% \ lib;% JAVA_HOME% \ jre \ lib

Edit the path variable by adding the following value: % JAVA_HOME% \ bin

Now open the command line and type java -version. If all goes well and nothing goes wrong, the java version will be displayed.

1.b. To Install Android NDK

Download the zip here and unzip it in C: / android-ndk. Add the variable ANDROID_NDK_HOME with the value C: / android-ndk. Unzip the content, making sure it does not have a folder inside the other.

1.c. Android SDK

In the website, this is will be installed with Android Studio but in Visual Studio 2017, this will be integrate it so no need to add it. But you can also add Xamarin Android SDK Manager in this link.

Create a Cross-Platform Xamarin Project

You can get started with a new Xamarin.Forms app by going to File -> New -> Visual C# -> Cross-Platform -> Cross-Platform App. This template allows you to select the starter project, the platforms you plan on targeting, and your code sharing strategy.

Before we had this display:

Portable Class Libraries allow you to write code and produce libraries that can be shared across multiple platforms including Xamarin.iOS, Xamarin.Android and Windows Phone.

(https://developer.xamarin.com/guides/cross-platform/application_fundamentals/pcl/)

But now, Portable Class Library is replaced by .NET Standard:

.NET Standard is a formal specification of .NET APIs that are intended to be available on all .NET runtimes (such as .NET Framework, Mono, and .NET Core).

https://blog.xamarin.com/building-xamarin-forms-apps-net-standard/

And you can include Azure Mobile Apps, backed project.

After creating a new project, we will have this structure:

The next step is to choose between compiling using Emulators or your device, but recently, they announced a new, faster tool for Xamarin and Visual Studio for Mac feature to compile and render your application that is Xamarin Live Player app installed on your iOS or Android device.

Emulator

When I started Workshop, I was facing many problems to work with Emulators, Windows 10 Mobile emulators use Hyper-v. And we tried to install GenyMotion as an Android emulator and it uses Virtual Box. Hyper-v and Virtual Box do not work on the same machine. There may even be some way to make them work together, GenyMotion allows you to get more devices (for personal use) but as I said before, it requires specific configuration (see more here), but the machine used in the training room doesn’t have this characteristic.

After, to minimize the use of the machine memory, we used our mobile (Samsung, Huawei …), we installed USB driver and we started to compile and to see the result, but it’s always a problem for some mobile.

Xamarin Live Player

Visual Studio has a Forms Previewer tool that’s supposed to show the view on the fly but it never works. Everybody is complaining about it. So Visual Studio released another tool; Xamarin Live Player.

It provides real-time feedback to developers while fitting into their existing mobile development experience. By pairing your device to the IDE, we are able to continually deploy, test, and debug the app directly on the device.

So, how can we use it?

It’s simple, we start by selecting a new target from our device.

Visual Studio App Center (Before Xamarin Test Cloud)

After creating a new application and development, developers are facing a lot of challenges in the Test process, even they have to proceed by a continuous integrated delivery, you need an environment that lets you test in many Devices.

In the Mobile cycle, an application, start by a design and development after we go through the test and monitoring, but if the test wasn’t as we expect, we come back to the design and development, so we try to iterate develop and maintain.

Microsoft offered a lot of services like HockeyApp, Xamarin Test Cloud, Xamarin Insights (but it joined HockeyApp after), Azure Mobile Engagement, Azure App Service and CodePush.

Connect to https://appcenter.ms/ BUT after Microsoft created the Visual Studio App Center that collects all in one place. They have taken all of these different solutions and they brought them together in one single central application.

To start your build functionality, you connect to an existing code repository in the cloud from VSTS or GitHub or BitBucket, along with this build process, it has also a device lab with over 300 configurations of Android and IOS devices that you can run your automation scripts on, it supports a variety of frameworks like Appium, Espresso, XCUITest and Xamarin.UITest.

Once you have been through the build task process, you go to the distribution to users, you can create groups, both for internal test groups in your company or for maybe beta testers and send your app directly to them as well as give them live in-app updates. You also have the ability. Once you’re ready to publish your app to Google play or iTunes, connect to the app center.

Once the application is published and used, developers want to know what is going on and to be easy to maintain it in case of a crash, you can get in real time stack traces in crash reports from the fields from your app.

Along with a crash, we need to know some analytics to understand more our customers, so from the app center, we can log custom events. Finally, it’s a single source for push notifications.

History

• 5^th January, 2018: Initial version