The process of creating a cover in QML involves defining the UI in QML. First, you create the QML document while specifying the QML file that contains the UI for the cover.
After you verify that the QML document is free of errors, you retrieve the root container, set it as the content of a SceneCover, and then set the cover on your app instance.

QmlDocument *qmlCover = QmlDocument::create("asset:///AppCover.qml").parent(this); if (!qmlCover->hasErrors()) { // Create the QML Container from using the QMLDocument Container *coverContainer = qmlCover->createRootObject<Container>(); // Create a SceneCover and set the app cover SceneCover *sceneCover = SceneCover::create().content(coverContainer); Application::instance()->setCover(sceneCover); }
Here's the QML that defines the components for the cover.
import bb.cascades 1.0 Container { Container { layout: DockLayout {} background: Color.Black ImageView { imageSource: "asset:///images/app-cover.png" scalingMethod: ScalingMethod.AspectFit } Container { bottomPadding: 31 horizontalAlignment: HorizontalAlignment.Center verticalAlignment: VerticalAlignment.Bottom Container { preferredWidth: 300 preferredHeight: 42 background: Color.create("#121212") layout: DockLayout {} Label { objectName: "TheLabel" horizontalAlignment: HorizontalAlignment.Center verticalAlignment: VerticalAlignment.Center text: "QML" textStyle.color: Color.create("#ebebeb") textStyle.fontSize: FontSize.PointValue textStyle.fontSizeValue: 6 } } } } }
When the user minimizes the app, the custom app cover is displayed instead of the default cover.