With the recent acquisition of Xamarin by Microsoft, it could be expected that the development of mobile applications would become a little more accessible, especially considering that this acquisition has changed the cost of Xamarin to… nothing! Thanks to Xamarin Forms and Visual Studio Community Edition, it is now possible to develop a mobile application that can be distributed on Android, iOS, and Windows Phone, without any costs other than those associated with the publication on each of these platforms.
So now that it’s available, is it easy to make a cross-platform mobile application? The answer is simply yes. Our new project will already contain what’s necessary (almost) to our “Hello World”. So let’s rather look at what it takes for us to be able to see our application on the three major platforms (Android, iOS, and Windows Phone) without having these devices on hand.
- Windows 7 or above and Windows Phone 8.1
- Visual Studio 2015 or 2013 Update 2
- Xamarin (we used version 18.104.22.1683)
- Windows Phone only:
- The Hyper-V component of Windows needs to be activated
- Windows Phone emulator:
- iOS only:
- Mac with Xamarin and XCode installed (necessary for the iOS app only)
- iOS simulator for Windows:
Creating your project
To begin with, you need to start Visual Studio, create a new project (File → New → Project) and select the “Blank App (Xamarin.Forms Portable)” template. This will this create the solution with the following projects:
- HelloWorldMobile (Mobile)
Besides the “Mobile” project, all the others contain what’s necessary to start the application according to the platform.
You will probably have connection screens to a Mac, that you can close for now, we will see that later.
You can now open the “App” class of the Mobile project and change the sentence: “Welcome to Xamarin Forms!” for “Hello World” (otherwise it would not be a real hello world anymore). To make sure to see the result, you can add the following line inside de brackets of the Label so that the text displayed is a bit bigger on the screen:
FontSize = Device.GetNamedSize(NamedSize.Large, typeof(Label))
A few updates
The first thing to do would be to verify that the NuGet components are up to date on the solution (right-click on the solution and select “Manage NuGet Packages for Solution”). Regarding what’s installed (“Installed” tab), make sure that you have version 22.214.171.124 of Xamarin.Forms.
In the “Updates tab”, you will probably note that there are several packages to update, all related to Android. It is tempting to update them isn’t it? But contrary to what one might think, we will not do it. Although these Android packages are available, they are not yet compatible with Xamarin.Forms, but rather only with specific projects for Android; so, they are not supported by Forms. The Xamarin.Forms package knows its dependencies for Android. Thus, it’s best to let it manage what needs to be installed in its updates.
We will then check the status for the packages of the Android SDK. To do this, go to the menu Tools → Android → Android SDK Manager. Here, the detection of missing or outdated packages should happen automatically; so, you only need to click on “Install packages” once the verification is done. Depending on the required updates, you may have to restart the Updates Manager for a second set of updates.
Once all this is done, we can test our application.
Testing our Hello World
We are now ready to test our application. We will see how to configure the emulators for each of these platforms to be able to test without necessarily having a device in our hands.
For Windows 8.1, no other installation is required, and you should be able to start the application:
For Windows Phone 8.1, you only have to download and install the emulator directly from the Microsoft website (see link in the requirements). Note that Windows 8.1 or 10 is a requirement for this installation. Once the installation is completed and the solution started, you will have the possibility to start the project targeting one of the different emulators as shown here:
For Android, several options are available to us in terms of emulation.
With the installation of the Android SDK comes the “Android Virtual Device Manager”, which includes two default emulator configurations. This driver allows us to configure new virtual machines, if desired, and it offers decent performance. On the other hand, if Hyper-V is enabled on your computer, it will not be possible to use configurations with x86 processor, so the performance will be rather poor.
A second option is the Android Xamarin Player (available for download). Although officially in beta, this manager is very stable and gives us the opportunity to download several Android device configurations (all those in the Nexus line). The only thing that could prevent you from using this tool is Hyper-V, which makes the use of these emulators impossible.
A final option is the Android emulator for Visual Studio (available for download). In this case, Hyper-V is not a problem, but rather a requirement. However, if it’s possible for you to install it, you will get the best performance during usage (which is much more representative of reality) and get more configuration options and sensor adjustments. A wide range of emulators is also available with examples of comparative models. Depending on your Hyper-V configuration, there may be changes to be made to this configuration and your project. It is best to refer to this page if the application startup is not possible.
So you have several choices available. If your computer does not support Hyper-V, you should try both solutions and choose the one you prefer because they both offer a good performance and ease of use. In the end, you should have your emulator to test the project on Android.
We are now ready to test on iOS. The first step is to create a profile on the Mac for the development of the application. So, on the Mac, you need to open XCode and go to XCode → Preferences. Here, use the + button to add your Apple ID (“Add Apple ID”). You can register your ID if you already have one or create a new one. Once this is done, select your username and press “View Details” in the section on the right. To allow the development of an application (you must distinguish between development and distribution, because the distribution requires other configurations), press the “Create” button in the “iOS Development” entry.
The next step will be to connect to the Mac. Back in Visual Studio, you can use the menu Tools → iOS → Xamarin Mac Agent or the button on the toolbar, as shown in this screenshot:
If it’s not already done, you will have the necessary explanations to enable the Mac agent for remote connections. The explanatory window can be disabled completely; so, if that’s what you did, here‘s Xamarin website page with the necessary explanations.
Once the agent is enabled, you should have access to the Mac via the Xamarin Mac Agent screen, where you can select the Mac and enter the username and password to connect to it:
Xamarin has recently made it possible to visualize the iOS simulator directly from our Windows environment, with the tool mentioned in the Requirements section (before, you had to go see the simulator directly on the Mac). Therefore, you will check that the tool is active, by going to the menu Tools → Options, then in the section Xamarin → iOS Settings. Here, the option of the simulator should be checked, as follows:
The last step is to configure our application in Visual Studio, to indicate the development profile to be used. For this, we right-click on the iOS project and go to “Properties”. In the “iOS Bundle Signing” tab, you should be able to select your Apple ID profile in the “Identity” field (it starts with “iPhone Developer”, followed by the email used). This configuration can be easy to forget when starting a new project, but is necessary if we want to be able to use the simulators.
If we now try to access the list of emulators, we should find the list of the different devices available according to the XCode configuration (which can always be adjusted to your needs):
We now have everything we need to develop and test locally our mobile cross-platform application without having to possess all these devices.
Although it is not necessary to have all the devices, it is still important to note that physical devices are the best way to test your application. The peripheral devices of the machine, such as the camera or accelerometer, will always be better tested on a real device.
Read Éric De Carufel’s blog post on the enterprise version of the Hello World.