[Solved] Full screen QSplashScreen on mobile

artem.marchenko

Hi

We am developing an app that consists almost of just QML and JavaScript. This combination works well, but loading QML engine and initializing everything takes quite a lot of time (about a couple of secs on Symbian3 devices), so I figured that we want show splash screen while the loading happens.

QSplashScreen works, but it either shows splash screen in the middle of a screen on top of transparent background (i.e. you can see app grid on the back if you were starting app from the app grid) or tiles the image many times.

I'd like to show the image not on a transparent background, but on a black or some other color. How could I do it?

Here's my [slightly simplified] current code:
@
int main(int argc, char *argv[])
{
QApplication app(argc, argv);
QPixmap splashPixmap("qml/myapp/images/splashScreen.png");
QSplashScreen splash(splashPixmap);
// splash.show(); // this displays splash image over a transparent background
splash.showFullScreen(); // this tiles splash image in a grid manner

QmlApplicationViewer viewer;
QString mainPath = QLatin1String("qml/myapp/main.qml");
viewer.setMainQmlFile&#40;mainPath&#41;;

viewer.showExpanded(&#41;;
splash.finish(&viewer);

// Enter the main loop
int returnCode = app.exec&#40;&#41;;
return returnCode;

}
@

Cheers,
Artem.

Fuzzbender

Two ideas:

If using non-fullscreen QSplashScreen, try to modify the palette's background value to be black instead of whatever the QStyle is providing (on Symbian it is transparent usually).
If you really want to have fullscreen QSplashScreen, try to resize your image so that it would
fill the whole screen area. I know this is not exactly what you were after, but it would prevent the
tiling. You could then modify the splashscreen image to contain "black background" to get what you are
really after.

DenisKormalev

About resizing. You can also use qDrawBorderPixmap function to draw it using QPainter to another pixmap to avoid scaling blur (this function is analogue of using BorderImage in QML)

artem.marchenko

Yeah, providing image sized to whole screen won't be a good solution as our app is going to run on devices with the different resolutions.

I am trying to play with the palette-related methods now.

Why should changing the palette work if QSplashScreen [I guess] isn't covering full screen anyway?

Fuzzbender

If there is any transparent area in the splashscreen (for message texts etc), these should at least then be opaque.

For fullscreen case, you could get the screen size first and then resize the pixmap (and then use qDrawBorderPixmap function as indicated by Denis above).

artem.marchenko

Thank you, guys!

I solved it in the following manner (irrelevant parts skipped):
@
int main(int argc, char argv[])
{
QPixmap splashSourcePixmap("qml/myproject/images/splashScreen.png");
QDesktopWidget desktop = QApplication::desktop();
const QRect desktopRect = desktop->availableGeometry();

QPixmap splashPixmap(desktopRect.width(), desktopRect.height());
splashPixmap.fill(QColor("070606"));

QPainter p;
p.begin(&splashPixmap);
QRect targetRect((splashPixmap.width() - splashSourcePixmap.width())/2,
                 (splashPixmap.height() - splashSourcePixmap.height())/2,
                 splashSourcePixmap.width(), splashSourcePixmap.height());
p.drawPixmap(targetRect, splashSourcePixmap);
p.end();

QSplashScreen splash(splashPixmap);

splash.showFullScreen();

QmlApplicationViewer viewer;

...
viewer.showExpanded();
splash.finish(&viewer);

// Enter the main loop
int returnCode = app.exec();
return returnCode;

}
@

This allows for showing a full screen solid color and a given image to be centered on it. I was worried about what happens if screen is rotated during the splash screen part, but it looks like it never happens on Symbian 3 devices, not sure about the others.

Our designer is also thinking about painting a gradient instead of a solid color, so I'll probably research it as well. Should be easy to do, not sure how fast or slow it is.

matti-

Would be nice if there was a way to display a launch image similar to iOS, meaning while the app binary itself is being loaded. A splash screen is fine and dandy but if your app binary is several megs, it takes quite a while before it has been loaded and is able to provide a QSplashScreen or similar.

This is the case especially if you compile your large resources into the app binary.