TableView.">

- Qt 6.5
- Qt Quick Controls
- QML Types
- VerticalHeaderView
- Qt 6.5.2 Reference Documentation

# VerticalHeaderView QML Type

Offers a vertical header view to accompany a TableView. More...

Import Statement: | import QtQuick.Controls
Inherits: | TableView

- List of all members, including inherited members

## Properties

- model : QVariant
- syncView : TableView
- textRole : QString

## Detailed Description

A VerticalHeaderView provides a styled table header. It can either be used as an independent view or header for a TableView.

You can add a header for a TableView by assigning a VerticalHeaderView to the TableView::syncView property. The header and the table will then be kept in sync while flicking.

By default, VerticalHeaderView displays header data from the sync view's model. If you don't wish to use this model, you can assign a different model to the model property. If you assign a model that is a QAbstractItemModel, its header data will be used. Otherwise the data in the model will be used directly (for example, if you assign a model that is simply an array of strings).

The application is responsible for placing the header at the correct location in the scene. You can add as many headers as you want to a single TableView, which can be useful if you for example want to place headers on all four sides of the table.

The following snippet shows how you can add a horizontal and vertical header view to a table view:

     import QtQuick
     import QtQuick.Controls
     import Qt.labs.qmlmodels

     ApplicationWindow {
         visible: true
         width: 640
         height: 480
         title: qsTr("HeaderView")

         Rectangle {
             anchors.fill: parent
             // The background color will show through the cell
             // spacing, and therefore become the grid line color.
             color: Qt.styleHints.appearance === Qt.Light ? palette.mid : palette.midlight

             HorizontalHeaderView {
                 id: horizontalHeader
                 anchors.left: tableView.left
                 anchors.top: parent.top
                 syncView: tableView
                 clip: true
             }

             VerticalHeaderView {
                 id: verticalHeader
                 anchors.top: tableView.top
                 anchors.left: parent.left
                 syncView: tableView
                 clip: true
             }

             TableView {
                 id: tableView
                 anchors.left: verticalHeader.right
                 anchors.top: horizontalHeader.bottom
                 anchors.right: parent.right
                 anchors.bottom: parent.bottom
                 clip: true

                 columnSpacing: 1
                 rowSpacing: 1

                 model: TableModel {
                     TableModelColumn { display: "name" }
                     TableModelColumn { display: "color" }

                     rows: [
                         {
                             "name": "cat",
                             "color": "black"
                         },
                         {
                             "name": "dog",
                             "color": "brown"
                         },
                         {
                             "name": "bird",
                             "color": "white"
                         }
                     ]
                 }

                 delegate: Rectangle {
                     implicitWidth: 100
                     implicitHeight: 20
                     color: palette.base
                     Label {
                         text: display
                     }
                 }
             }
         }

A VerticalHeaderView will have resizableRows set to `true` by default.

See also HorizontalHeaderView.

## Property Documentation

model : QVariant

This property holds the model providing data for the vertical header view.

When model is not explicitly set, it will be synchronized with syncView's model once syncView is set.

If model is a QAbstractTableModel, its vertical headerData() will be accessed.

If model is a QAbstractItemModel other than QAbstractTableModel, model's data() will be accessed.

Otherwise, the behavior is same as setting TableView::model.

See also TableView, model, and QAbstractTableModel.

syncView : TableView

This property holds the TableView to synchronize with.

Once this property is bound to another TableView, both header and table will synchronize with regard to row heights, row spacing, and flicking vertically.

If the model is not explicitly set, then the header will use the syncView's model to label the rows.

See also model and TableView.

textRole : QString

This property holds the model role used to display text in each header cell.

When the model has multiple roles, textRole can be set to determine which role should be displayed.

If model is a QAbstractItemModel then it will default to "display"; otherwise it is empty.

See also QAbstractItemModel::roleNames().