Replatforming: From Xamarin Native to Xamarin.Forms
Normally you have to decide between Xamarin Native and Xamarin.Forms for your mobile app. But sometimes you change your mind and want to change the framework. So I’m showing you how you can replatform your app to Xamarin.Forms.
Introduction
Before you actually start developing a mobile app, you have to make various decisions. This includes, for example, the choice of the framework. At the time of creating the app which will be transformed, there was a requirement to create an app for Android, iOS and Windows Phone. That is why the decision to use Xamarin Native was made at the time. It was possible to share the business logic between the three apps and only the UI for the different platforms had to be developed separately. Over time, the choice of Xamarin Native was questioned, so that a platform change was recently carried out. The app has now been implemented with the help of Xamarin.Forms. This article documents this procedure.
Xamarin Native vs. Xamarin.Forms
At this point I would like to roughly explain the difference between Xamarin Native and Xamarin.Forms in order to make the actual implementation easier to understand. Xamarin Native is suitable for the development of apps that want to share the business logic between different platforms. However, the UI must be written individually for each platform. For example, storyboards can be used for the iOS version or XAML under UWP. The following picture shows the structure of a Xamarin native app:
In comparison, Xamarin.Forms offers the possibility to share the UI between the individual platforms in addition to the business logic, so that, ideally, everything only has to be written once.
With this approach, depending on the app, you can share up to 95% of the code and only have to develop a very small part for each platform individually. In both cases 100% of the native APIs are available if required. By using Xamarin Native or Xamarin.Forms, there are no performance losses, since everything is compiled natively.
Starting position
The starting point is an app developed with Xamarin Native for Android, iOS and Windows Phone. It enables the customer to add a number of images to various projects that are accessed via an API. In a second step you can add a comment to each of the images. Then everything is sent to the backend via the API, where the images and comments are stored in a database. Here are a few screenshots of the Android version, implemented with Xamarin Native:
Replatforming
Fortunately, I already used the MVVM pattern in the original development of the app, which can now be implemented even more easily with the help of Xamarin.Forms and XAML and thus simplifies the switch from Xamarin Native to Xamarin.Forms.
MVVM (Model View View Model) is a design pattern, which provides for a strict separation between business logic and the UI.
I started in Visual Studio with an empty Xamarin.Forms project, which now only supports Android and iOS, since UWP was not important for the customer anymore. In the next step, the NuGet packages used were analyzed in the old app and added according to the different projects in the new project.
The business logic was then transferred step by step and adjustments were made directly. For example, I had implemented the determination of device information on each platform individually, but with the help of Xamarin.Essentials, this logic could be implemented platform-independently in the .NET Standard project. In this context, I also looked more closely at the implementation of the MVVM pattern and made minor adjustments to ViewModels and services. Thanks to the good preparatory work, this process did not take much time.
The next step focused on the UI. As you can see from the screenshots above, the app did not have an overly complex UI because the functionality was always in the foreground. Due to the fact that the XAML dialect differs between UWP with Windows Phone and Xamarin.Forms, almost nothing could be used from the old app. I took advantage of this opportunity and made adjustments to the UI, which makes the app look more contemporary.
While a lot of logic was still implemented in the activities under Android and under iOS in the ViewControllers, I have now implemented the complete UI with the help of DataBinding. Here it helped me that the Xamarin Native implementation was also implemented for Windows Phone, since the DataBinding model was already used and the ViewModels were prepared Ibaccordingly.
Overall, the development of the UI took a little more time because almost nothing could be used. Of course, I was able to orientate myself on the existing structures, so that I didn’t have to start from scratch.
At this point I would like to show you some pictures of the new Xamarin.Forms version of the app on Android:
Summary
For this project, I can summarize that the replatforming was worth it. Legacy implementation have been replaced by new implementations. At the same time, future adjustments to the app can now be implemented more quickly, since there is only one UI for both platforms. By implementing the Xamarin Native App with the MVVM pattern, much of the business logic could also be used nearly one to one. On the other hand, a little more time had to be invested in building the new UI, since almost nothing could be used here. However, this significantly improved the user experience.
To replatform a Xamarin Native to a Xamarin.Forms app, time must be invested until the platform change is completed, but there are numerous advantages through this change, which will definitely pay off in retrospect. We’ve used Xamarin.Forms 4.7 while replatforming the app.
