如何在 QML 中链接两个滚动视图？

Posted 2023-02-17

【中文标题】如何在 QML 中链接两个滚动视图？

【英文标题】：How to make two scrollviews linked in QML?

【发布时间】：2016-12-07 07:45:11

【问题描述】：

我想制作一个标题固定的表格。我现在的想法是使用两个ScrollView，一个用于标题（RowLayout），一个用于正文（GridLayout）。有什么简单的方法可以将这两个在水平方向上链接，所以一个滚动，另一个滚动相同？

【问题讨论】：

TableView 有什么问题？

@Velkan，嗨，我想稍后将其扩展到“第一列作为标题”。

顺便说一句。对于未来的问题：提供一些代码总是有帮助的，因为它减少了可能甚至愿意提供答案的个人的工作量。

【参考方案1】：

我不知道如何使用low-performing QtQuick.Controls 1.x， 但是QtQuick.Controls 2.0ScrollBar 有一个属性position。

所以这里的诀窍是，创建两个ScrollBars，一个用于每个要滚动的项目，并将每个项目的位置绑定到另一个的位置。

ApplicationWindow 
    visible: true
    width: 300
    height: 120
    title: qsTr("Hello World")


    Column 
        anchors.fill: parent
        Flickable 
            id: flick1
            width: parent.width
            height: parent.height / 2
            contentHeight: 2 * height
            contentWidth: 2 * width
            Item 
                anchors.fill: parent
                Rectangle 
                    width: parent.height
                    height: parent.width
                    anchors.centerIn: parent
                    rotation: 90

                    gradient: Gradient 
                        GradientStop  position: 1; color: 'black' 
                        GradientStop  position: 0; color: 'white' 
                    
                
            

            ScrollBar.horizontal: scrl1
        
        Flickable 
            id: flick2
            width: parent.width
            height: parent.height / 2
            contentHeight: 2 * height
            contentWidth: 2 * width
            clip: true

            Item 
                anchors.fill: parent
                Rectangle 
                    width: parent.height
                    height: parent.width
                    anchors.centerIn: parent
                    rotation: 90

                    gradient: Gradient 
                        GradientStop  position: 0; color: 'black' 
                        GradientStop  position: 1; color: 'white' 
                    
                
            

            ScrollBar.horizontal: scrl2
        
    


    ScrollBar 
        id: scrl1
        orientation: Qt.Horizontal
    

    ScrollBar 
        id: scrl2
        orientation: Qt.Horizontal
    

    Binding 
        target: scrl2
        property: 'position'
        value: scrl1.position
    
    Binding 
        target: scrl1
        property: 'position'
        value: scrl2.position
    

如何将ScrollBars 附加到几乎任何东西上，您可以在这个问题的答案中找到。我不与Layouts 合作，所以我不能更具体地了解它们。

how to create a scrollbar for rectangle in QML

【讨论】：

即使有新版本，QtQC 1 AFAIK 也不会被弃用

好吧，这有点争议。但我猜你可以说，出于性能原因，建议不要使用它们？

我猜他们仍然在桌面软件上提供原生外观，而 QQC2 没有，但是 QQC2 的性能更高，尤其是对于嵌入式平台。

最重要的是它们不再被维护。模块页面中没有列出官方维护者。所以，是的，认为它们已被弃用。