"Свяжите" два флажка QML вместе, гарантируя, что их состояния всегда идентичны

Я хотел бы создать два флажка на разных страницах графического интерфейса, чтобы они семантически были "одинаковым" флажком - одна и та же метка, один и тот же эффект. (Наличие их на обеих страницах просто для удобства пользователя.)

Это требует "связывания" двух CheckBox Элементы QML вместе, так что состояние одного всегда отражается другим, и наоборот.

Это эквивалентно тому, что здесь спрашивают, за исключением того, что я использую QML/JS вместо JS/JQuery.

Я думал, что наивная реализация связывания checked Состояние каждого флажка для некоторого глобального постоянного свойства будет работать:

// Global shared state object
pragma Singleton
MySharedState {
    my_feature_on: false
}

Затем на двух отдельных страницах точно такой же CheckBox конкретизации:

// Checkbox implementation (on both pages
CheckBox {
    checked: MySharedState.my_feature_on
    onClicked: MySharedState.my_feature_on = checked
}

Тем не менее, это не работает, потому что когда флажок установлен, он ломает начальный checked связывание. Это предполагаемое поведение, а не ошибка.

Так как же я могу убедиться, что два флажка всегда находятся в одном и том же "проверенном" состоянии?

РЕДАКТИРОВАТЬ: Согласно приведенному ниже комментарию, вышеуказанная реализация будет работать без изменений в Qt Quick Controls 2, которая была выпущена с Qt 5.7, поэтому этот вопрос относится только к предыдущим версиям Qt (включая 5.6, что является "долгосрочной поддержкой"). " релиз).

2 ответа

Решение

Когда флажок установлен checked свойство изменено и оригинал checked: MySharedState.my_feature_on привязка снята. Вам нужно создать привязку свойства из Javascript, чтобы восстановить исходную привязку, как объяснил JP Nurmi в отчете об ошибке, который вы связали.

Для этого вы должны использовать Qt.binding(),

CheckBox {
    checked: MySharedState.my_feature_on
    onClicked: { // the checked binding is removed since checked has been changed externally to the binding
        MySharedState.my_feature_on = checked
        checked = Qt.binding(function() {return MySharedState.my_feature_on}); //we restore the checked binding
    }
}

Использование двусторонней привязки с Binding Тип работ:

import QtQuick 2.5
import QtQuick.Controls 1.0

ApplicationWindow {
    objectName: "window"
    width: 600
    height: 200
    visible: true

    Row {
        CheckBox {
            id: checkBox1
            text: "Check Box 1"
        }

        CheckBox {
            id: checkBox2
            text: "Check Box 2"
        }
    }

    Binding {
        target: checkBox2
        property: "checked"
        value: checkBox1.checked
    }

    Binding {
        target: checkBox1
        property: "checked"
        value: checkBox2.checked
    }
}

Хотя я не уверен, почему он не жалуется на обязательную петлю.

Другие вопросы по тегам