Xamarin.Forms (Android): Remove blank screen during app launch — a splash screen alternative

The recommended way to remove the blank white/black background when an android app launches is to add a splash screen. The main issue with this method is that you are effectively increasing the start up time of your app. If you run it on a powerful device, the start up time might be smaller than the delay implemented in the splash activity, forcing users to wait unnecessarily. On the other hand, if the app runs a less powerful device, the start up time might be longer than the delay implemented in the splash activity, rendering the process useless as the users will still see the blank screen.

The blank screen takes the window background property from the styles.xml an it can be replaced with a desired image by changing the value of the property. To do this:

1. Add the splash screen image (splash_icon.png) to the Resources/drawable folder and make sure the Build Action is set to AndroidResource.
2. Add a new xml file (splash_screen.xml) to Resources/drawable folder.

content of resources/drawable folder

1. Add the image to the splash_screen.xml file.

• <?xml version=”1.0" encoding=”utf-8"?> <layer-list xmlns:android=”http://schemas.android.com/apk/res/android"> <item> <! — color of spaces not covered by the image → <color android:color=”@color/primaryDark” /> </item> <item> <! — place the image in the center of the screen → <bitmap android:src=”@drawable/splash_icon” android:tileMode=”disabled” android:gravity=”center” android:layout_gravity=”center” /> </item> </layer-list>

1. Change the android:windowBackground in the styles.xml file to the new spalsh_screen.xml.

• <?xml version=”1.0" encoding=”UTF-8"?> <resources> <style name=”MyTheme” parent=”MyTheme.Base”> </style> <style name=”MyTheme.Base” parent=”Theme.AppCompat.Light.NoActionBar”> <item name=”colorPrimary”>@color/primary</item> <item name=”colorPrimaryDark”>@color/primaryDark</item> <item name=”colorAccent”>@color/accent</item> <item name=”windowActionModeOverlay”>true</item> <item name=”android:textCursorDrawable”>@null</item> <! — window background set to the splash_screen.xml file → <item name=”android:windowBackground”>@drawable/splash_screen</item> </style> </resources>

The splash image will now be shown during the app’s launch. There is one other issue to take care of as the app now uses the splash image as the background on all other pages. A workaround is to reset the window background to a desired color when the application finishes loading.

public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsAppCompatActivity
    {
        protected override void OnCreate(Bundle bundle)
        {
            TabLayoutResource = Resource.Layout.Tabbar;
            ToolbarResource = Resource.Layout.Toolbar;

            base.OnCreate(bundle);

            Bootstrap_init();

            global::Xamarin.Forms.Forms.Init(this, bundle);

            LoadApplication(new App());

            //reset background from splash image to drawable color.
            this.Window.DecorView.Background = Resources.GetDrawable(Resource.Drawable.window_background);

        }
    }

Now, an image will be displayed during the launch process instead of a blank screen and the desired background color will be used when the launch process is completed.

Originally published at Phatye.