Qt/QML：如何在 QML 中双向同步 ScrollView？答案

【问题标题】：Qt/QML: How to bidirectional sync ScrollView in QML?Qt/QML：如何在 QML 中双向同步 ScrollView？
【发布时间】：2020-03-08 11:42:44
【问题描述】：

我想同步两个可滚动列表视图的 contentY，如此简化代码所示

Item {
    SplitView {
        orientation: Qt.Horizontal

        Component1 {
            id: left
            contentY: right.contentY
        }
        Component1 {
            id: right
            contentY: left.contentY
        } 
    }
}

//Component1.qml

Item {
    property alias contentY: component2.contentY

    Component2 {
        id: component2
    }
}

//Component2.qml

Item {
    property alias contentY: list.contentY

    ScrollView {
        ListView {
            id: list
        }
    }
}

当我启动或重新加载 QML 场景并仅在一个拆分视图中滚动时，它正在工作。但是，一旦我开始在另一个列表视图中滚动，双向绑定就会被破坏，并且 contentY 不再同步。我只能彼此分开滚动列表视图。我怎样才能避免这种情况？有没有更好的同步内容的方法？

【问题讨论】：

标签： qt qml qt5

【解决方案1】：

我找到了一个似乎可行的解决方案：

Item {
    SplitView {
        orientation: Qt.Horizontal
        
        Component1 {
            id: left
            Binding {
                target: right
                property: "contentY"
                value: left.contentY
            }
        }
        Component1 {
            id: right
            Binding {
                target: left
                property: "contentY"
                value: right.contentY
            }
        } 
    }
}

//Component1.qml

Item {
    property alias contentY: component2.contentY
    
    Component2 {
        id: component2
    }
}

//Component2.qml

Item {
    property alias contentY: list.contentY

    ScrollView {
        ListView {
            id:list
        }
    }
}

但是，如果有更好的解决方案，我会感谢任何提示 :)

【讨论】：