From UWP/Xamarin Forms to Xamarin Android building an MVP ( Horizontal lists & Database) [Part 1]

Xamarin Android

In these articles I will go over my journey of building an application that runs on multiple platforms. My original application was a classic UWP application, next I built the same application but with Xamarin Forms XAML which you can find here.

The aim of these articles is to go over the different steps that were needed for my application to work. The application needed to have a horizontal listview , database/caching, audio and tracking.

This audio application was built using Xamarin.Android and will release it to the Google Play Store. We already have all of the C# code in a .Net Standard library which allows us to already have the API call, the caching mechanisms, our ViewModels and our Models.

We will start by again trying to build a Horizontal list and getting the database working.

This article is be broken into 3 parts:

• [Part 1] Migrating my UWP / Xamarin Forms application to Xamarin Android building an MVP — Horizontal lists & Database
• [Part 2] Migrating my UWP / Xamarin Forms application to Xamarin Android building an MVP — Audio player & Fragments
• [Part 3] From MVP to Release Build, migrating a UWP / Xamarin Forms application to Xamarin Android and submitting it to the Google Play Store

This article is part of a part of a bigger series of articles that walk through the different steps that I went through to migrate an Audio application. You can find the articles here.

Here are the features that the application will have:

Building this MVP allowed me to learn and use Xamarin.Android, it allowed me to better understand how to use the Android Designer, how styling worked and how to integrate C# with our Android UI. Also we will see the hurtles and the small issues I stumbled upon.

Building a ListView with Horizontal Listview Items

Having all of the C# backend code for the application I was able to mainly focus on how to bind the data to the UI. Having worked mainly with MVVM bindings I had to learn how Android binding worked.

I learned that to set data inside a ListView you needed to use

Android.Widget.BaseAdapter

Also, I learned that I needed looked for the element in the UI, I need to the method called FindViewById<element type> (element id).

To bind data I must search with FindViewById and look for my UI Element by its id, here is what my RadioItemAdapterViewHolder looks like

Creating a double ListView, means that we have the main ListView that has for data template another ListView that is horizontal, to achieve this I added 2 new files in the layout folder (horizontal_item & audio_item).

Current my MVP had 3 UI elements that were located in Layout folder as follows:

Resources
   /Layout
       - activity_main.xml
       - horizontal_item.xml
       - audio_item.xml

My initial horizontal_item.xml code looked as follows

However this was what it produced:

Which is not what was desired, because the radios here are listed vertically and not horizontal. Basically all I did was add a vertical list view with a fixed height in a vertical list view which is not great.

I learned that by replacing my ListView by a RecyclerView inside a HorizontalScrollView it would allow me to have a Horizontal ListView.

RecyclerView

Yes it now looks much better, here is what I got:

Which is what I wanted! I tweaked the UI of the radio cards so that it would look better. I am still getting the hang of how to use the Android Designer but I do feel that it is more natural to use. It did take me quite a while to understand how to set data templates, set data to these data template and how to design the elements. But being new the platform this is normal.

Database in Xamarin.Android

Getting the database to work in Xamarin Forms was a bit touchy, I really thought that I was going to encounter the same issue, however it literally took me 10 minutes to get the database working. Finding and downloading the nuget packages might have been the most time consuming.

First I installed the nuget Microsoft.EntityFrameworkCore.Sqlite

Microsoft.EntityFrameworkCore.Sqlite 3.1.0

Next, I added my DbStorageContext initialized at the start of my application and I was almost ready to go.

using (var db = new DbStorageContext())
{
    db.Database.EnsureCreated();
}

Next I needed to the the real database package for SQLite and not just the ORM which can be found here:

SQLitePCLRaw.lib.e_sqlite3.android 2.0.2

By adding these 2 packages my caching mechanism worked out of the box. Of course all of the logic was already done in my Net Standard library but it always amaze me how much code can be shared with .Net Standard.

In the MVP v2 I will try to implement the second important part of my application which is to be able to play audio and use fragments.

Here is quick recap of my mini-articles:

• [Part 1] Migrating my UWP / Xamarin Forms application to Xamarin Android building an MVP — Horizontal lists & Database
• [Part 2] Migrating my UWP / Xamarin Forms application to Xamarin Android building an MVP — Audio player & Fragments
• [Part 3] From MVP to Release Build, migrating a UWP / Xamarin Forms application to Xamarin Android and submitting it to the Google Play Store

Here is the full list of what I plan on working on and writing about: