我想在GUI的不同页面上创建两个复选框,使它们在语义上是“相同”复选框 - 相同的标签,相同的效果。 (在两个页面上都有它们只是为了方便用户。)
这需要将两个CheckBox
QML元素“绑定”在一起,以便一个状态始终由另一个反映,反之亦然。
这是equivalent to what's being asked here,除了我使用的是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
绑定。这是intended behavior, not a bug。
那么如何确保两个复选框始终共享相同的“已检查”状态?
编辑:根据以下评论,上述实施将在Qt Quick Controls 2中无需修改即可使用,该版本随Qt 5.7一起发布,因此此问题仅适用于先前版本的Qt(包括5.6,这是一个“长期支持”发布。)
答案 0 :(得分:3)
单击复选框时,其“checked
属性已更改,原始checked: MySharedState.my_feature_on
绑定将被删除。
您需要create a property binding from Javascript恢复原始绑定,如J-P 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
}
}
答案 1 :(得分:2)
使用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
}
}
虽然我不确定为什么它不会抱怨绑定循环。