Implementing a splash screen with Qt Quick on Android | Qt 6.11
Description: Showcase how to setup a splash screen with Qt Quick View on Android.

- Qt 6.11
- Implementing a splash screen with Qt Quick on Android
- Qt 6.11.1 Reference Documentation

# Implementing a splash screen with Qt Quick on Android

Showcase how to setup a splash screen with Qt Quick View on Android.

This simple example demonstrates using a QML view as a Qt splash screen. No additional transitions are used. In this example, the default splash screen, that was introduced in Android 12, is hidden. When the application starts, the splash screen is shown for two seconds, after which the main view is shown without transition.

This example is one of series of two similar examples demonstrating splash screen. This one uses QML view, the other uses AndroidManifest flags.

#### Using the Qt Quick splash screen on Android

To use a QML view as a splash screen, you define a view and add a few items specific to splash screen functionality.

     Window {
         id: splash
         color: "#2CDE85"
         title: qsTr("Splash Window")
         modality: Qt.ApplicationModal
         flags: Qt.SplashScreen
         visible: true

         property int timeoutInterval: 2000
         signal timeout

- `modality: Qt.ApplicationModal` sets the view modal.
- `flags: Qt.SplashScreen` hides the titlebar.
- `property int timeoutInterval: 2000` sets the visibility time for the view.

##### Loading the main view

         Loader {
             id: mainLoader
             source: "Main.qml"

The timer calls the exit function on timeout to switch from the splash screen to the main view. Any possible out-animations would be initiated here.

         function exit() {
             mainLoader.item.show();
             splash.visible = false
             splash.timeout()
         }

The timer allows appropriate time for the splash screen to appear. This can be used in conjunction with Loader.loaded() signal or possibly with another signal originating from the app implementation when the app is ready to be shown.

         Timer {
             interval: splash.timeoutInterval;
             running: splash.visible;
             repeat: false
             onTriggered: {
                 splash.exit()
             }
         }

On launch, the default splash screen is shown before the first view of the application is shown. See Android Splash screens for the instructions on modifying it.
By default, Android uses the applications icon for the splash screen. On a Qt for Android application, this can be modified to be used as the app splash screen or it can be combined with the Qt splash screen.

##### Hiding the native Android splash screen

To keep the launch user experience consistent between platforms, it may be needed to hide the Android splash screen. To do this, define a translucent theme that effectively hides the Android splash screen.

     <?xml version="1.0" encoding="UTF-8"?>
     <resources>
         <style name="splashStartTheme">
             <item name="android:windowNoTitle">true</item>
             <item name="android:windowDisablePreview">true</item>
             <item name="android:windowIsTranslucent">true</item>
         </style>
     </resources>

There is a problem though. Orientation changes stop working if we have translucent theme. This is caused by the fact that the Android view gets its orientation from the underlying view, usually this is an Application Drawer which does not change its orientation. And because the theme cannot be changed after the Activity view is set, we end up with an application stuck in one orientation.
As a workaround we can create throwaway Activity with translucent theme for the Android splash screen. As soon as possible we launch another Activity, which has all the bells and whistles our application requires.

             <activity
                 android:name=".SplashActivity"
                 android:exported="true"
                 android:label="QML Splash Screen Example"
                 android:theme="@style/splashStartTheme">
                 <intent-filter>
                     <action android:name="android.intent.action.MAIN" />
                     <category android:name="android.intent.category.LAUNCHER" />
                 </intent-filter>
             </activity>

Now the native Android splash screen is not shown, and we launch the QtActivity, which shows the splash screen defined in QML. To launch the QML splash screen, we must override the Android Activity's `onCreate` method and use an Intent to launch the QtActivity.

     package io.qt.qmlsplashscreeninandroid;

     import android.app.Activity;
     import android.os.Bundle;
     import android.view.View;
     import android.util.Log;
     import android.content.Intent;
     import android.view.ViewTreeObserver;
     import org.qtproject.qt.android.bindings.QtActivity;

     public class SplashActivity extends Activity {

         private static final String TAG = "SplashActivity";

         @Override
         public void onCreate(Bundle savedInstanceState) {
             super.onCreate(savedInstanceState);
             // Set up an OnPreDrawListener to the root view.
             final View content = findViewById(android.R.id.content);
                     content.getViewTreeObserver().addOnPreDrawListener(
                             new ViewTreeObserver.OnPreDrawListener() {
                 @Override
                 public boolean onPreDraw() {
                     Intent i = new Intent(SplashActivity.this, QtActivity.class);
                     i.setFlags(Intent.FLAG_ACTIVITY_NO_ANIMATION);
                     startActivity(i);

                     content.getViewTreeObserver().removeOnPreDrawListener(this);
                     finish();
                     return true;
                 }
             });
         }
     }

Finally, the QML splash screen opens the main view, which in this example contains just a single View with a close button.

Example project @ code.qt.io