StatusBar QML Type

(BETA) Allows access to status bar customization on iOS and Android devices. More...

Import Statement: import ArcGIS.AppFramework.Platform 1.0



  • error(StatusBarErrorStatus status)


Detailed Description

The StatusBar component provides access to a number of operations to manage the appearance of the status bar when using your app. The status bar is the bar on the top of a smartphone screen that displays elements such as system time, signal strength, and app notifications. This component is a singleton, and does not need to be instantiated.

This functionality is currently only supported on Android and iOS. Status bars are not displayed by default on these devices; it first has to be enabled by setting the property display.statusBar to true in the app's appinfo.json.

We recommend that when using this component, your App object be set as a delegate within an AppLayout object. This is done to handle verying heights of the status bar across devices, especially devices with a notch such as later iPhones. The following code sample demonstrates what this looks like:

AppLayout {
    width: 400
    height: 640
    delegate: App {
        id: app

This code sample demonstrates the various properties of StatusBar.

Page {
    anchors.fill: parent

    Column {
        spacing: 20
        anchors.centerIn: parent

        ComboBox {
            id: colorBox

            displayText: "Color"
            currentIndex: Material.Indigo
            popup.width: 160

            model: ListModel {
                ListElement { name: "Red" }
                ListElement { name: "Blue" }

            delegate: ItemDelegate {
                id: colorDelegate
                text: modelData
                width: colorBox.popup.width
                Rectangle {
                    z: -1
                    anchors.fill: parent
                    parent: colorDelegate.background
                    color: Material.color(index)

        ComboBox {
            id: themeBox

            displayText: "Theme"
            currentIndex: Material.Dark

            model: ListModel {
                ListElement { name: "Light" }
                ListElement { name: "Dark" }

            delegate: ItemDelegate {
                id: themeDelegate
                text: modelData
                width: themeBox.popup.width

        CheckBox {
            text: "visible"
            checked: true
            visible: StatusBar.supportedOperation(StatusBar.StatusBarVisible)
            onCheckedChanged: {
                if (checkState === Qt.Checked)
                    StatusBar.visible = true;
                    StatusBar.visible = false;

        Button {
            text: "apply"

            onClicked: {
                StatusBar.theme = themeBox.currentIndex
                StatusBar.color = Material.color(colorBox.currentIndex, Material.Shade700)

        Component.onCompleted: {
                StatusBar.theme = themeBox.currentIndex
                StatusBar.color = Material.color(colorBox.currentIndex, Material.Shade700)


Theme enumeration

Enum decribing the themes that can be used for a status bar. Informs the theme property.


StatusBarErrorStatus enumeration

Enum describing error states of status bar operations. Informs the error signal.


StatusBarOperation enumeration

Enum describing the different operations for status bars. Informs the supportedOperation method.


Property Documentation

color : color

The color value to set the status bar to.

[read-only] supported : bool

Returns true if status bar operations are supported on this device. Otherwise, returns false.

theme : Theme

The theme to be used for the status bar. Informed by the Theme enum. If this property is not set, uses the system default.

visible : bool

Set this property to true if the status bar is to be seen while using the app. Otherwise,this property should be set to false.

Signal Documentation

error(StatusBarErrorStatus status)

Signal emitted when a status bar operation encounters an error. Informed by the StatusBarErrorStatus enum.

Note: The corresponding handler is onError.

Method Documentation

bool supportedOperation(statusbaroperation operation)

Returns true if the status bar operation defined by the parameter is supported on the device. Otherwise, returns false.

The operation parameter

Informed by the StatusBarOperation enum. the status bar operation to check the supported status for.

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.