Qt on Android : Working example of a splash screen



  • I'm trying to create a custom splash screen for an Android application.
    I already noticed there is a splash layout for this purpose but I can't edit it since it's always overwritten by the default one.

    I can't find any working sample code for a custom splash screen. Has anybody already done this kind of thing?

    Thanks



  • I think some has had some luck with it - I can't get it to work either.

    I've managed to get the screen color just before my app loads changed from white to black (it was black on 5.2 and with 5.3 it's white for some reason).
    You can add files to, and override files in, the default android project created by Qt by adding a directory in your project root e.g.:
    @ mkdir /path/to/project/android-build @

    (Also see "This post":http://blog.qt.digia.com/blog/2013/10/09/android-deployment-in-qt-5-2/ for a more in-depth write up)
    And then tell the Android plugin where it can find your custom overrides by putting the following line somewhere in your .pro file:

    @ ANDROID_PACKAGE_SOURCE_DIR = $$PWD/android-build @

    Now you can put files in /path/to/project/android-build as if it was a normal Android project dir e.g.:

    @
    /path/to/project/android-build/AndroidManifest.xml
    /path/to/project/android-build/layout/splash.xml
    @

    I can't get the splash to show anything though neither with Qt5.2 or 5.3. The files get overridden fine so I don't know what the problem is - but maybe see if you can get further from there? - please do post your solution if you manage to get it working :)



  • Got it working with Qt5.3 because they've fixed some bugs on this specific issue. Here's how I got it working:

    1. Make your "splash.png" image and copy the different versions in:

    /path/to/project/android-build/res/drawable-mdpi/splash.png
    /path/to/project/android-build/res/drawable-ldpi/splash.png
    /path/to/project/android-build/res/drawable-hdpi/splash.png
    

    Make the directories as described above or use Qt Creator to give your Android build an icon and the directories will be created for you.

    2. Copy over or merge the AndroidManifest.xml template from your Qt install:

    cp /path/to/Qt/5.3/android_armv7/src/android/java/AndroidManifest.xml /path/to/project/android-build/AndroidManifest.xml
    

    (I had to merge mine as I had a custom one from my Qt5.2 project already)

    3. Uncomment the line in the manifest so it will read:

    <!-- Splash screen -->
                <meta-data android:name="android.app.splash_screen_drawable" android:resource="@drawable/splash"/>
    <!-- Splash screen -->
    

    If your named your image different than "splash.png" then edit:
    @drawable/splash to @drawable/<your image name>

    That's it :)

    The only drawback is that you for some reason can't use Android Layouts as splash screens - but that's a different topic.

    Also see this tutorial by @benlau which applies the same principles



  • In case your using Qt with C++, you can also use the main.cpp with the following code to display a splashscreen on mobile platforms. Both ways have their pros and cons...

    Works fine on Android and iOS, WinPhone untested.

    @#include "mainwindow.h"
    #include <QApplication>
    #include <QSplashScreen>
    #include <QTimer>

    int main(int argc, char *argv[])
    {
    QApplication a(argc, argv);
    MainWindow w;

    QPixmap pixmap(":/images/splash.png");
    QSplashScreen splash(pixmap);
    splash.show();
    
    QTimer::singleShot(3000, &splash, SLOT(close()));
    QTimer::singleShot(3000, &w, SLOT(show()));
    
    return a.exec(&#41;;
    

    }
    @



  • @dominik

    What do you have to do in order include the QSplashScreen? Do you have to add something to the project file? Because I get only a "QSplashScreen no such file or directory" at the #include line.



  • [quote author="DerMas" date="1404133192"]@dominik

    What do you have to do in order include the QSplashScreen? Do you have to add something to the project file? Because I get only a "QSplashScreen no such file or directory" at the #include line.[/quote]

    In .pro file:

    QT += widgets



  • Works, thanks :-)



  • Hi. If your are interested to make an animated Splash screen in QML, see "this post":https://qt-project.org/forums/viewthread/36745



  • #Larpon, I'm using Qt 5.3.1 and I used Qt creator to create the manifest file.
    In the splash screen section I see that the name set in
    @@drawable/logo@

    is the name of my logo. I don't know why, this should be for the splash screen, but it's not. I tried to change it manually, and I did put the splash in inside the

    @/path/to/project/android-build/res/drawable-mdpi/splash.png
    /path/to/project/android-build/res/drawable-ldpi/splash.png
    /path/to/project/android-build/res/drawable-hdpi/splash.png@

    but when I run the application all of this gets overwritten and the manifest return back to it's logo and I don't find the splash image in the directories above.
    Any Idea



  • #dominik.fehr, I also used the way you specified, it did work and show the splash screen, but the application still shows a black screen for around 4 seconds before showing the splash screen and then the application. apparently this splash is not a splash it is a part of the application.
    Any Idea
    Thanks



  • #Baso
    Also on 5.3.1 and it works perfectly with the AndroidManifest method posted by Larpon.

    Are you editing the right folder? Since everything gets overwritten, it sounds like you are editing the android output folder and not the soure folder.

    Check if the project file has the line:
    @ANDROID_PACKAGE_SOURCE_DIR = $$PWD/android_build@
    (Btw. since my project is quite old, the androidsource folder isnt called "android_build", but only "android". So check if the folder specified in the project file is the same, you use for your custom android files).



  • #DerMas
    You are right, I was editing the output folder. I edited the one in the project folder and everything works just fine.
    Thank you DerMas and thanks everybody.



  • [code]
    #include "mainwindow.h"
    #include <QApplication>
    #include <QSplashScreen>
    #include <QTimer>

    int main(int argc, char *argv[])
    {
    QApplication a(argc, argv);
    MainWindow w;

    QPixmap pixmap(":/images/splash.png");
    QSplashScreen splash(pixmap);
    splash.show();
    
    QTimer::singleShot(3000, &splash, SLOT(close()));
    QTimer::singleShot(3000, &w, SLOT(show()));
    
    return a.exec&#40;&#41;;
    

    }
    [/code]
    This example work well but there is a big (for me) problem when I run the app in the Android device (no emulation).

    Before that the Splash Screen part, for a second the MainWindow showing the incon associated upper left. After start the Splash Screen and then the MainWindow.

    The intial second of the MainWindow is deleterious.

    I tried the following solution, but it does not work well at 100%

    [code]
    #include "mainwindow.h"
    #include <QApplication>
    #include <QSplashScreen>
    #include <QTimer>

    int main(int argc, char *argv[])
    {
    QApplication a(argc, argv);

    QPixmap pixmap(":/images/splash.png");
    QSplashScreen splash(pixmap);
    splash.show();
    
    MainWindow w;
    
    QTimer::singleShot(3000, &splash, SLOT(close()));
    QTimer::singleShot(3000, &w, SLOT(show()));
    
    return a.exec(&#41;;
    

    }
    [/code]

    If I run the app in my desktop I haven't problem.

    Inside the MainWindow I have a Menu.

    If I remove the Menu from MainWindow I haven't the problem.


  • Qt Champions 2016

    In case you found that the action bar with your application name is shown together with your splash image. You may add this attribute to <activity> tag

    @
    android:theme="@android:style/Theme.Holo.Light.NoActionBar"
    @



  • Thank you for the response but it doesn't resolve my problem.

    if I add the following code:

    @android:theme="@android:style/Theme.Holo.Light.NoActionBar"@

    the splash screen is without action bar but also the next screen is without action bar.

    The same result if I use:

    @android:theme="@android:style/Theme.NoTitleBar"@

    My application show the application screen without Title bar (ok) and after the next screen show the Title bar (perfect).

    My problem is that the screen before splash screen (about 1 second) show the Title bar after it hide and show the Splash screen and after the screen with the title bar.


  • Qt Champions 2016

    Hi,

    FYI, I have written an article about how to create a splash screen with instant response and will not turn black:

    Complete Guide to Making a Splash Screen for your QML Android Application — Medium


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.