Как изменить цвет строки в TableView QML при событии мыши?

Итак, когда пользователь нажимает на строку, цвет этой строки должен измениться. Это то, что я пробовал. Это не работает.

Здесь table — идентификатор моего QML TableView.

Пусть цвет по умолчанию будет синим, а при щелчке он должен измениться на красный.

   rowDelegate:
            Rectangle
            {
                id: rowDel
                color:
                {
                    var activeRow = table.currentRow === styleData.row;
                                (activeRow ? mouse_area.pressed ? "red" : "blue" : "white")
                }

                border.width: 1
                height: 52
                width: 2000

                MouseArea
                {
                    id: mouse_area
                    anchors.fill: parent
                }
            }

Если вы добавите обработчик onClicked в свой MouseArea, он будет вызван? (Поместите оператор печати внутрь.)

— 12.12.2020 17:28

javascript qt qml qt5

12.12.2020 17:16

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

533

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

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

Решение

Вместо styleData.row используйте styleData.selected.

Пример

Вот пример, который я написал для вас, чтобы продемонстрировать предлагаемое решение:

import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 1.4

Window {
    width: 320
    height: 200
    visible: true
    title: qsTr("TableView")

    ListModel {
        id: libraryModel
        ListElement {
            title: "A Masterpiece"
            author: "Gabriel"
        }
        ListElement {
            title: "Brilliance"
            author: "Jens"
        }
        ListElement {
            title: "Outstanding"
            author: "Frederik"
        }
    }

    TableView {
        id: table

        anchors.fill: parent
        model: libraryModel

        rowDelegate: Rectangle {
            color: styleData.selected ? "red" : "blue"
            width: 2000
            height: 40
            border.width: 1
        }

        TableViewColumn {
            role: "title"
            title: "Title"
            width: 100
        }

        TableViewColumn {
            role: "author"
            title: "Author"
            width: 200
        }
    }
}

Результат

Приведенный пример дает следующий результат:

С выбранной второй строкой.

С выбранной последней строкой.

Великолепно! Есть решение для Qt Quick Controls 2? Похоже, что версия 1 устарела в Qt 5.11 и была удалена в Qt 6.0. Новый TableView кажется намного сложнее делать эти базовые вещи.

— 12.03.2022 12:32

12.12.2020 17:36