Tumbler QML Type | Qt Quick Extras 5.9

Qt 5.9 | Qt Quick Extras | QML Types | Tumbler QML Type

Qt 5.9.4 Reference Documentation

# Tumbler QML Type

A control that can have several spinnable wheels, each with items that can be selected. More...

Import Statement: | import QtQuick.Extras 1.4
Since: | Qt 5.5

- List of all members, including inherited members

## Properties

- columnCount : int

## Methods

- TumblerColumn addColumn(TumblerColumn column)
- int currentIndexAt(int columnIndex)
- TumblerColumn getColumn(int columnIndex)
- TumblerColumn insertColumn(int index, TumblerColumn column)
- void setCurrentIndexAt(int columnIndex, int itemIndex, int interval)

## Detailed Description

Note: Tumbler requires Qt 5.5.0 or later.

The Tumbler control is used with one or more TumblerColumn items, which define the content of each column:

      Tumbler {
          TumblerColumn {
              model: 5
          }
          TumblerColumn {
              model: [0, 1, 2, 3, 4]
          }
          TumblerColumn {
              model: ["A", "B", "C", "D", "E"]
          }
      }

You can also use a traditional model with roles:

      Rectangle {
          width: 220
          height: 350
          color: "#494d53"

          ListModel {
              id: listModel

              ListElement {
                  foo: "A"
                  bar: "B"
                  baz: "C"
              }
              ListElement {
                  foo: "A"
                  bar: "B"
                  baz: "C"
              }
              ListElement {
                  foo: "A"
                  bar: "B"
                  baz: "C"
              }
          }

          Tumbler {
              anchors.centerIn: parent

              TumblerColumn {
                  model: listModel
                  role: "foo"
              }
              TumblerColumn {
                  model: listModel
                  role: "bar"
              }
              TumblerColumn {
                  model: listModel
                  role: "baz"
              }
          }
      }

## Limitations

For technical reasons, the model count must be equal to or greater than visibleItemCount plus one. The visibleItemCount must also be an odd number.

You can create a custom appearance for a Tumbler by assigning a TumblerStyle. To style individual columns, use the delegate and highlight properties of TumblerColumn.

## Property Documentation

[read-only] columnCount : int

The number of columns in the Tumbler.

## Method Documentation

TumblerColumn addColumn(TumblerColumn column)

Adds a column and returns the added column.

The column argument can be an instance of TumblerColumn, or a Component. The component has to contain a TumblerColumn. Otherwise `null` is returned.

int currentIndexAt(int columnIndex)

Returns the current index of the column at columnIndex, or `null` if the index is invalid.

TumblerColumn getColumn(int columnIndex)

Returns the column at columnIndex or `null` if the index is invalid.

TumblerColumn insertColumn(int index, TumblerColumn column)

Inserts a column at the given index and returns the inserted column.

The column argument can be an instance of TumblerColumn, or a Component. The component has to contain a TumblerColumn. Otherwise, `null` is returned.

void setCurrentIndexAt(int columnIndex, int itemIndex, int interval)

Sets the current index of the column at columnIndex to itemIndex. The animation length can be set with interval, which defaults to `0`.

Does nothing if columnIndex or itemIndex are invalid.