【问题标题】:QML QtQuick.Controls 2.2 ScrollView - how to disable horizontal flicking?QML QtQuick.Controls 2.2 ScrollView - 如何禁用水平滑动?
【发布时间】:2017-11-28 21:13:27
【问题描述】:

在使用我声明的 QtQuick.Controls 2.2 ScrollView 时,我试图仅禁用水平滑动(只有垂直滚动和滑动内容):

ScrollView {
    anchors.fill: parent
    ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
}

我试过了

ScrollView {
    anchors.fill: parent
    ScrollBar.horizontal.policy: ScrollBar.AlwaysOff

    Flickable.flickableDirection: Flickable.VerticalFlick
}

但 Android 应用程序正在静默崩溃。

如何只禁用水平滑动和滚动而垂直滑动和滚动?

【问题讨论】:

    标签: android qml scrollview qtquick2 qtquickcontrols2


    【解决方案1】:

    只需指定ScrollView::contentWidth

    此属性保存可滚动内容的宽度。

    如果在 ScrollView 中只使用单个项目,则内容大小为 根据其包含的隐式大小自动计算 项目。

    ScrollView {
        contentWidth: -1
        anchors.fill: parent
    
        Text {
            text: "ABC"
            font.pixelSize: 512
        }
    }
    

    【讨论】:

    • 谢谢,我试过了,但它只显示“ABC”,没有垂直滑动和滚动(我已经复制了 10 次 Text 以获得垂直滚动的内容)。我认为很明显我只想禁用水平轻弹但有垂直滚动和轻弹。我应该澄清我的问题。
    • 其实我也用过ListView,不过还是对这种方式很好奇
    • 文本元素只是虚拟示例内容。如果内容足够高,则可以垂直滚动。该示例的重点是展示如何根据您的要求禁用水平滚动。说到 ListView,一个垂直的 ListView 默认没有水平滚动。您必须明确覆盖内容宽度才能使其水平滚动。
    • 我重复了 Text {...} 10 次,所以滚动的内容相当大,但它不起作用,我检查过。
    • 实际上,我已经通过 ColumnLayout 包装了 10 个 Text {},以便拥有一个非常长的 ScrollView 子项。通过这种方式,内容看起来像预期的那样 - 比滚动视图更长,但仍然不可滚动。
    【解决方案2】:
    ScrollView {
            id: svId
            anchors.fill: parent
            contentWidth: textId.width
            Text {
                id: textId
                width: svId.width    //Can't use parent.width
                text: "this is a long text"
                wrapMode: Text.WordWrap
            }
        }
    

    【讨论】:

      【解决方案3】:

      ScrollView 确实有一个名为availableWidth 的属性。在Qt文档中是这样写的,

      如果您希望 ScrollView 仅垂直滚动,您可以将 contentWidth 绑定到 availableWidth(对于 contentHeight 反之亦然)。这将使内容水平填充 ScrollView 内的所有可用空间,同时考虑任何填充或滚动条。

      所以你只需要将 ScrollView 的 contentWidth 设置为 availableWidth 即可。

      https://doc.qt.io/qt-5/qml-qtquick-controls2-scrollview.html#details

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多