QML TextArea: другое поведение при использовании QtQuick.Controls> 2.0 против 1.4 - PullRequest
Новая
       13

QML TextArea: другое поведение при использовании QtQuick.Controls> 2.0 против 1.4

1 голос
/ 07 октября 2019

Я новичок в Qml, но я хотел попробовать, стоит ли его использовать вместо старых виджетов Qt, особенно потому, что я слышал, что он лучше для мобильных устройств. Я использую Qml для GUI вместе с парой классов C ++ для основной логики. Мне нужна была прокручиваемая TextArea, как в текстовом редакторе, поэтому я обнаружил, что мне нужно использовать TextArea, вложенное в ScrollView, например: 

ScrollView {
    ...
    TextArea {
        ...
    }
}

Мне понравился результат в моем темном приложении QML скрасивый текстовый редактор и красивые полосы прокрутки на темном фоне.

Проблема возникла, когда мне понадобилось реализовать функцию scrollTo в моем коде. Мое приложение - это своего рода плеер, который выделяет текст и прокручивает его вниз, когда он достигает 1/4 высоты. Я обнаружил, что могу использовать свойство flickableItem.contentY для настройки относительного положения текста в моем ScrollView, но свойства там не было, хотя другие ответы ссылались на него.

Я дошел до документации Qt, и никаких признаков этого не было, только свойство contentItem. Поэтому я попытался настроить свойство contentItem.y , но результат был ужасным. Текст и весь фон были панорамированием, покрывая мою верхнюю панель инструментов.

Поэтому я искал в документах другие реализации TextArea и обнаружил, что QtQuick.Controls 1.4 имеет реализацию TextArea, которая унаследовалаКласс ScrollView. Это было решением, подумал я. Я переключился на более старую реализацию и сумел заставить все это работать. Теперь я могу прокручивать свою TextArea программно через свойство flickableItem.contentY и свойства contentHeight vs height , чтобы вычислить, сколько у меня места.

Проблема здесь в том, что версия 1.4 имеет ужасно выглядящие полосы прокрутки, и я чувствую, что использовать старую версию - это своего рода хак. Есть ли причина, по которой они удалили свойство flickableItem из ScrollView? Есть ли другой способ сделать то же самое с новыми версиями Controls?

Вот мой код: 

import QtQuick 2.12
import QtQuick.Controls 1.4
import QtQuick.Layouts 1.12

TextArea {
    id: textArea

    anchors.fill: parent
    backgroundVisible: false

    /*background: Rectangle {
        anchors.fill: parent
        color: "#000000"
    }*/

    //color: "#ffffff"

    textColor: "#ffffff"
    selectByKeyboard: true
    selectByMouse: true
    verticalScrollBarPolicy: Qt.ScrollBarAlwaysOn

    function scrollToY(y) {
        if ((contentHeight-y) > flickableItem.height && y > flickableItem.height/4) {
            flickableItem.contentY = y - flickableItem.height/4
        }
    }
}

1 Ответ

0 голосов
/ 07 октября 2019

Я не знаю причины изменений реализации между Qt Quick Controls 1 и Qt Quick Controls 2. Однако, ScrollView в Qt Quick Controls 2 можно программно прокручивать с помощью ScrollBar.vertical.position. Я написал пример кода, который перемещает контент с помощью таймера, пока он не прокручивается вниз, когда таймер останавливается. Обратите внимание, что если содержимое соответствует видимой области, то полоса прокрутки отключается и таймер не запускается, поскольку нет необходимости перемещать содержимое. Вы можете проверить это, изменив логическое значение useLongText на false. 

import QtQuick.Window 2.2
import QtQuick 2.9
import QtQuick.Controls 2.2

Window {
    visible: true
    width: 400
    height: 400
    color: "blue"
    property string exampleTextShort: "Lorem Ipsum is simply dummy text of the printing and typesetting industry."

    property string exampleTextLong: "Lorem Ipsum is simply dummy text of the printing and typesetting industry.

Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.

It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
"

    property bool useLongText: true // Change this to test with short text too

    Timer {
        id: timer
        running: scrollView.wholeTextSeen ? false : true
        repeat: true
        interval: 2000
        onTriggered: {
            scrollView.scrollDown()
        }
    }

    Rectangle{
        id: rect
        anchors.centerIn: parent
        width: parent.width*0.2;
        height: parent.height*0.2;
        ScrollView {
            id: scrollView
            anchors.fill: parent
            clip: true
            property bool wholeTextSeen: ScrollBar.vertical.size >= 1 ? true : false
            ScrollBar.vertical.policy: ScrollBar.vertical.size >= 1 ? ScrollBar.AlwaysOff : ScrollBar.AlwaysOn
            TextArea {
                readOnly: true
                text: useLongText ? exampleTextLong : exampleTextShort
                wrapMode: Text.WordWrap
            }

            function scrollDown() {
                if (wholeTextSeen) {
                    timer.running = false
                } else {
                    var scrollVar = ScrollBar.vertical.position + ScrollBar.vertical.size
                    console.log("scrollVar:",scrollVar)
                    if (scrollVar >= 1) {
                        wholeTextSeen = true
                    } else {
                        var step = 0.2
                        step = scrollVar + step > 1 ? 1 - scrollVar : step
                        ScrollBar.vertical.position = ScrollBar.vertical.position + step
                    }
                }
            }
        }
    }
}

Пример вывода при запуске длинного текста выглядит для меня так: 

qml: scrollVar: 0.15625
qml: scrollVar: 0.35625
qml: scrollVar: 0.55625
qml: scrollVar: 0.7562500000000001
qml: scrollVar: 0.95625
qml: scrollVar: 1
...