Как создать представление таблицы (5.12) с заголовками столбцов?

Я создаю таблицу, используя новое табличное представление qml (Qt 5.12). Я могу создать модель на С++ и заполнить модель в табличном формате вместе с полосой прокрутки. Как добавить заголовки столбцов в эту таблицу? Код:

import QtQuick 2.12
import QtQuick.Controls 2.5
import Qt.labs.qmlmodels 1.0
//import QtQuick.Controls.Styles 1.4
import TableModel 0.1
Rectangle {
    id:table
    border.width: 3
    border.color: 'dark blue'
    QtObject{
        id:internals
        property int rows:0
        property int col:0
        property int colwidth:0
        property var columnName:[]
    }

    function setRows(num){ internals.rows = num}
    function setCols(num){ internals.col =  num}
    function setColWidth(num){internals.colwidth = num}

    function setColNames(stringlist){
        if (stringlist.length > 1)
            internals.col = stringlist.length

    dataModel.setColumnName(stringlist);
    }

    function addRowData(stringlist){
        var len = stringlist.length

         if (len >0)
         {
             dataModel.addData(stringlist)
         }
    }

    TableModel {
        id:dataModel
    }

    TableView{
            id:tbl
            anchors.top: headerCell
            anchors.fill: parent
            //columnSpacing: 1
            //rowSpacing: 1
            clip: true

           ScrollBar.horizontal: ScrollBar{}
           ScrollBar.vertical: ScrollBar{}

            model:dataModel

            Component{
                id:datacell
                Rectangle {
                    implicitWidth: 100
                    implicitHeight: 20
                    color: 'white'
                    border.width: 1
                    border.color: 'dark grey'
                    Text {
                        id:txtbox
                        anchors.fill: parent
                        wrapMode:                           Text.NoWrap
                        clip:                               true
                        verticalAlignment:                  Text.AlignVCenter
                        horizontalAlignment:                Text.AlignHCenter
                        text: display
                    }
                }
            }

        }

        function init(){
            console.info("Calling init")
            tbl.delegate= datacell
        }

}

Как сказано в документах Qt: Вы предоставляете заголовок и размер заголовка столбца, добавляя TableViewColumn, поэтому вам просто нужно добавить один или несколько элементов ТаблицаViewColumn.

folibis 10.04.2019 16:24

@folibis — это старый TableView, OP использует новый.

Mitch 10.04.2019 17:18

А, ладно, не обратил внимания. Как насчет реализации данные заголовка в модели?

folibis 10.04.2019 17:45
Стоит ли изучать PHP в 2023-2024 годах?
Стоит ли изучать PHP в 2023-2024 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
11
3
9 523
3
Перейти к ответу Данный вопрос помечен как решенный

Ответы 3

Ответ принят как подходящий

В настоящее время TableView не имеет заголовков, поэтому вы должны создать его, в этом случае используйте Row, Column и Repeater.

С другой стороны, вы должны реализовать метод headerData, и вы должны сделать это Q_INVOKABLE.

class TableModel : public QAbstractTableModel
{
    Q_OBJECT

public:
    // ...
    Q_INVOKABLE QVariant headerData(int section, Qt::Orientation orientation, int role = Qt::DisplayRole) const override;
    // ...
TableView {
    id: tableView
    model: table_model
    // ...
    Row {
        id: columnsHeader
        y: tableView.contentY
        z: 2
        Repeater {
            model: tableView.columns > 0 ? tableView.columns : 1
            Label {
                width: tableView.columnWidthProvider(modelData)
                height: 35
                text: table_model.headerData(modelData, Qt.Horizontal)
                color: '#aaaaaa'
                font.pixelSize: 15
                padding: 10
                verticalAlignment: Text.AlignVCenter

                background: Rectangle { color: "#333333" }
            }
        }
    }
    Column {
        id: rowsHeader
        x: tableView.contentX
        z: 2
        Repeater {
            model: tableView.rows > 0 ? tableView.rows : 1
            Label {
                width: 60
                height: tableView.rowHeightProvider(modelData)
                text: table_model.headerData(modelData, Qt.Vertical)
                color: '#aaaaaa'
                font.pixelSize: 15
                padding: 10
                verticalAlignment: Text.AlignVCenter

                background: Rectangle { color: "#333333" }
            }
        }
    }

Полный пример вы найдете здесь.

Спасибо @eyllanesc за решение. Что такое modelData в файле qml?

anuj chauhan 11.04.2019 05:39

@anujchauhan Если вы заметили, что модель ретранслятора представляет собой число, поэтому оно эквивалентно списку от 0 до n-1, где n — это число, которое указывает, поэтому данные равны 0, 1, 2, ..., n- 1, а modelData — это именно то, что нужно. Так что вам не нужно ничего определять, modelData будет создан автоматически. Чтение doc.qt.io/qt-5/qtquick-modelviewsdata-modelview.html#repeat‌​rs

eyllanesc 11.04.2019 06:15

Большое спасибо @eyllanesc Теперь с вашей помощью я могу получить заголовок столбца.

anuj chauhan 11.04.2019 08:57

Есть еще одна функция, которую я пытаюсь реализовать. Как я могу выбрать полную строку щелчком мыши или нажатием клавиши ввода, а при выборе цвет строки должен измениться? Любая идея о том, как реализовать эту функцию?

anuj chauhan 11.04.2019 08:57

@anujchauhan Я еще не знаю модель выбора для этого TableView, поэтому вам придется реализовать эту логику самостоятельно.

eyllanesc 11.04.2019 09:01

Можно ли изменить размер столбца?

Apin 13.05.2019 15:25

Я новичок в QML. Я много раз приходил к ответу Эйлланеск из-за своей борьбы с новый TableView (qt 5.12+), поэтому я хочу поблагодарить вас и поделиться тем, что помогло мне еще больше. Это видео: Шон Рутледж — TableView и DelegateChooser: новое в Qt 5.12 часть Qt Virtual Tech Summit 2019

Обсуждаемый код

Это немного длинно, но он покрывает

  • различия между старым и новым TableView

  • как создать модель универсальный для представлений

  • заголовки с изменяемым размером

  • разное представление для каждого типа столбца — DelegateChooser

  • сортируемые столбцы

  • изменение порядка столбцов

Если вы используете Qt 5.15, вы можете использовать HorizontalHeaderView для меток столбцов.

https://doc.qt.io/qt-5/qml-qtquick-controls2-horizontalheaderview.html

Также есть VerticalHeaderView для маркировки строк.

https://doc.qt.io/qt-5/qml-qtquick-controls2-verticalheaderview.html

Другие вопросы по теме