TabViewStyle QML Type | Qt Quick Controls 5.9

Qt 5.9 | Qt Quick Controls | QML Types | TabViewStyle QML Type

Qt 5.9.3 Reference Documentation

# TabViewStyle QML Type

Provides custom styling for TabView More...

Import Statement: | import QtQuick.Controls.Styles 1.4
Since: | Qt 5.1

- List of all members, including inherited members

## Properties

- control : TabView
- frame : Component
- frameOverlap : int
- leftCorner : Component
- rightCorner : Component
- tab : Component
- tabBar : Component
- tabOverlap : int
- tabsAlignment : int
- tabsMovable : bool

## Detailed Description

      TabView {
          id: frame
          anchors.fill: parent
          anchors.margins: 4
          Tab { title: "Tab 1" }
          Tab { title: "Tab 2" }
          Tab { title: "Tab 3" }

          style: TabViewStyle {
              frameOverlap: 1
              tab: Rectangle {
                  color: styleData.selected ? "steelblue" :"lightsteelblue"
                  border.color:  "steelblue"
                  implicitWidth: Math.max(text.width + 4, 80)
                  implicitHeight: 20
                  radius: 2
                  Text {
                      id: text
                      anchors.centerIn: parent
                      text: styleData.title
                      color: styleData.selected ? "white" : "black"
                  }
              }
              frame: Rectangle { color: "steelblue" }
          }
      }

## Property Documentation

[read-only] control : TabView

The ScrollView this style is attached to.

frame : Component

This defines the tab frame.

frameOverlap : int

This property holds the amount of overlap there are between individual tab buttons and the frame.

leftCorner : Component

This defines the left corner.

rightCorner : Component

This defines the right corner.

tab : Component

This defines the tab. You can access the tab state through the `styleData` property, with the following properties:

readonly property int styleData.index | This is the current tab index.
readonly property bool styleData.selected | This is the active tab.
readonly property string styleData.title | Tab title text.
readonly property bool styleData.nextSelected | The next tab is selected.
readonly property bool styleData.previousSelected | The previous tab is selected.
readonly property bool styleData.pressed | The tab is being pressed. (since QtQuick.Controls.Styles 1.3)
readonly property bool styleData.hovered | The tab is being hovered.
readonly property bool styleData.enabled | The tab is enabled. (since QtQuick.Controls.Styles 1.2)
readonly property bool styleData.activeFocus | The tab button has keyboard focus.
readonly property bool styleData.availableWidth | The available width for the tabs.
readonly property bool styleData.totalWidth | The total width of the tabs. (since QtQuick.Controls.Styles 1.2)

tabBar : Component

This defines the tab bar background.

tabOverlap : int

This property holds the amount of overlap there are between individual tab buttons.

tabsAlignment : int

This property holds the horizontal alignment of the tab buttons. Supported values are:

- Qt.AlignLeft (default)
- Qt.AlignHCenter
- Qt.AlignRight

tabsMovable : bool

This property holds whether the user can move the tabs. Tabs are not movable by default.