Making Android App with Xamarin 1 – Splash Screen

I read pros and cons of writing app with Xamarin.  But well, if I can write both Android and iPhone App on Visual Studio, why not?

First here are list of resources that I refer to.

Xamarin – Adndroid Getting Started
https://developer.xamarin.com/guides/android/getting_started/

I want to make Android version of http://trainwcoach.com, it’s a web service to keep log of fitness activities and share with friends, get advises from coaches.

Basic features are

  • Login to the service
  • Create activity logs
  • See feed, Search for activity log
  • Find friends
  • Exchange message with friends
  • Make payment for the service

The first step is to launch the app and see if login credential is valid.  I think the best is to check it at behind the splash screen.

Here is how to create splash screen

https://developer.xamarin.com/guides/android/user_interface/creating_a_splash_screen/

And even better, sample code can be found

https://developer.xamarin.com/samples/monodroid/SplashScreen/

It is required to have Xamarin.Android.Support.v4 and Xamarin.Android.Support.v7.AppCompat, both of them can be found and download from NuGet.

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88_100916_104300_am

After you get both files ready, let’s place splash screen image on Resources/drawable.

Android come with many different resolution and have to be thoughtful in designing splash screen that fits all nicely.   9-patch images is the best technique you can use to make sure the splash screen fits all screen nicely.  You can find a nice article about 9-patch images here, http://www.tidev.io/2014/02/12/android-splash-screens-using-9-patch-images/.

We will come back to this but for now, let’s prep simple splash screen and place it under Resources/drawable .

Usually, there is Activity Class that handles activity and layout file that handles layout for the App, but you can skip layout file for splash screen and just load theme and load background image from the theme.

Step 1, Let’s create drawable XML that runs on background.

Resources/drawable/splash_screen.xml

Step 2, we create custom theme for splash screen.

Resouces/drawable/values/style.xml

Step 3, we now create Splash Activity

SplashActivity.cs

Step 4, run it, and here it is.

screenshot_2016-10-09-11-32-59

OK, this handles just showing splash screen, so now let’s see if the device or the user is logged in next.

 

 

Leave a Reply