首页 文章

如何使QML中的Flckable上始终显示滚动条

提问于
浏览 次
2

我想让Flickable区域中的Scrollbar.vertical始终可见 . 目前点击时可见 . 文本区域也与滚动条重叠 . 如何在以下qml代码中使用文本区域分隔滚动条
enter image description here

import QtQuick 2.0
import QtQuick.Controls 2.0

Flickable {
    id: flickable
    anchors.fill: parent


    TextArea.flickable: TextArea {
        text: "The Qt QML module provides a framework for developing applications and libraries with the QML language.
It defines and implements the language and engine infrastructure, and provides an API to enable application developers to
extend the QML language with custom types and integrate QML code with JavaScript and C++.

The Qt QML module provides both a QML API and a C++ API.
Note that while the Qt QML module provides the language and infrastructure for QML applications,
the Qt Quick module provides many visual components, model-view support, an animation framework,
and much more for building user interfaces.
For those new to QML and Qt Quick, please see QML Applications for an introduction to writing QML applications."
        wrapMode: TextArea.Wrap
        font.pixelSize: 20
    }
    ScrollBar.vertical: ScrollBar {
        width: 40
    }
}
qt qml flickable

3 回答

  • 0

    似乎BaCaRoZzo建议的 active -property每隔几秒被一个计时器覆盖，如果它只是设置为 true . 因此，您可以使用 onActiveChanged -signal每次将其重置为 true .

    但是你也可以通过将 contentItem 的 opacity 设置为1来禁用它 . 至少对我来说，这就是诀窍 .

    为了解决你的定位：只需要锚定它 .

    Flickable {
    id: myflickable
    ...
    ScrollBar.vertical: myvertscroll
    clip: true
}

ScrollBar {
    id: myvertscroll
    anchors.left: myflickable.right
    contentItem.opacity: 1
}
    回复于
  • 3

    如果升级到Qt 5.9， QtQuick.Controls 2.2 会引入一个policy属性，可以帮助例如

    import QtQuick 2.0
import QtQuick.Controls 2.2

Flickable {
    id: flickable
    ...
    ScrollBar.vertical: ScrollBar {
        width: 40
        anchors.left: parent.right // adjust the anchor as suggested by derM
        policy: ScrollBar.AlwaysOn
    }
}
    回复于
  • 3

    其他解决方案对我不起作用 . 所以我试着覆盖contentItem . 另外，我必须添加一个恒定的宽度 .

    使用Qt 5.7和QtQuick.Controls 2.0进行测试 .

    ListView {
    id: listView
    ...

    ScrollBar.vertical: ScrollBar {
        width: 10
        contentItem: Rectangle {
            color: "black"
        }
    }
}
    回复于

相关问题