Tab QML Type

The property holds the index of the tab within the Tabs.

The contents of the Tab. Use a Page or a Loader that instantiates a Component or loads an external Page. When using a Loader, do not set the anchors or dimensions of the Loader so that the Page can control the height and prevent overlapping the header. Example:

import QtQuick 2.4
import Lomiri.Components 1.3
MainView {
    width: units.gu(40)
    height: units.gu(50)

    Component {
        id: pageComponent
        Page {
            Label {
                anchors.centerIn: parent
                text: "Loaded when tab is selected."
            }
        }
    }
    Tabs {
        id: tabs
        Tab {
            title: i18n.tr("Simple page")
            page: Page {
                Label {
                    anchors.centerIn: parent
                    text: i18n.tr("Always loaded")
                }
            }
        }
        Tab {
            id: loaderTab
            title: i18n.tr("Page loader")
            page: Loader {
                // no anchors
                id: loader
                sourceComponent: tabs.selectedTab == loaderTab ? pageComponent : null
                onStatusChanged: if (loader.status == Loader.Ready) console.log('Loaded')
            }
        }
    }
}

The title that is shown on the tab button used to select this tab.