如何從 QML 文件更改 QML 文件的屬性？
[英]How to change property of QML file from a QML file?
問題描述
我在我的 settingsPage.qml 文件中創建了一個可以打開和關閉的開關。 完成后，我想從 homePage.qml 文件更改矩形的顏色。 如何在兩個 qml 文件之間創建連接？
主頁.qml
import QtQuick 2.0
import QtQuick.Controls 2.15
import "../controls"
import QtQuick.Layouts 1.0
Item {
id: item1
Rectangle {
id: rectangle
color: "#2c313c"
anchors.fill: parent
property color windowBackground: #495163
...
我想用 settings.qml 中的開關更改屬性 windowBackground
Rectangle {
id: lightmode
width: 220
height: 60
visible: true
color: "#2c303b"
radius: 10
border.width: 0
Layout.fillHeight: false
anchors.topMargin: 20
anchors.leftMargin: 20
Switch {
id: customTitleBar1
anchors.left: parent.left
anchors.top: parent.top
anchors.bottom: parent.bottom
display: AbstractButton.IconOnly
onToggled: {
//backend.showHideRectangle(customTitleBar.checked)
}
font.wordSpacing: 0
padding: 0
font.pointSize: 15
rightPadding: 0
Label {
id: labelTextName2
x: 120
width: 200
color: "#e8e9ec"
text: qsTr("Light Mode")
anchors.right: parent.right
anchors.top: parent.top
anchors.bottom: parent.bottom
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
anchors.rightMargin: -170
font.pointSize: 14
}
spacing: 20
}
Layout.fillWidth: true
Layout.alignment: Qt.AlignLeft | Qt.AlignTop
}
（我正在使用 Py Creator、Pyside2 和 Qt 快速控制小部件。）
編輯：添加完整代碼：
settingsPage.qml：
import QtQuick 2.0
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.11
Item {
id: item1
Rectangle {
id: rectangle
color: "#2c313c"
anchors.fill: parent
Rectangle {
id: rectangleTop
height: 69
color: "#20232b"
radius: 10
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
anchors.rightMargin: 50
anchors.leftMargin: 50
anchors.topMargin: 40
Label {
id: labelTextName
x: 10
color: "#f1f2f3"
text: qsTr("Settings")
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
anchors.bottom: parent.bottom
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
anchors.topMargin: 22
anchors.bottomMargin: 22
anchors.leftMargin: 10
anchors.rightMargin: 10
font.pointSize: 14
}
}
Rectangle {
id: rectangleTop1
color: "#20232b"
radius: 10
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.bottomMargin: 20
anchors.topMargin: 131
anchors.leftMargin: 50
anchors.rightMargin: 50
GridLayout {
id: gridLayout
anchors.fill: parent
rows: 2
columns: 2
anchors.rightMargin: 10
anchors.leftMargin: 10
anchors.bottomMargin: 10
anchors.topMargin: 10
Rectangle {
id: rectangle1
width: 220
height: 60
visible: true
color: "#2c303b"
radius: 10
border.width: 0
Layout.fillHeight: false
Layout.alignment: Qt.AlignLeft | Qt.AlignTop
Layout.fillWidth: true
anchors.leftMargin: 20
anchors.topMargin: 20
Switch {
id: lightmode
anchors.left: parent.left
anchors.top: parent.top
anchors.bottom: parent.bottom
display: AbstractButton.IconOnly
spacing: 20
font.wordSpacing: 0
rightPadding: 0
padding: 0
font.pointSize: 15
onToggled: {
}
Label {
id: labelTextName1
x: 120
width: 200
color: "#e8e9ec"
text: qsTr("Light Mode")
anchors.right: parent.right
anchors.top: parent.top
anchors.bottom: parent.bottom
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
anchors.rightMargin: -170
font.pointSize: 14
}
}
}
Rectangle {
id: other
width: 220
height: 60
visible: false
color: "#2c303b"
radius: 10
border.width: 0
Layout.fillHeight: false
anchors.topMargin: 20
anchors.leftMargin: 20
Switch {
id: customTitleBar1
anchors.left: parent.left
anchors.top: parent.top
anchors.bottom: parent.bottom
display: AbstractButton.IconOnly
onToggled: {
//backend.showHideRectangle(customTitleBar.checked)
}
font.wordSpacing: 0
padding: 0
font.pointSize: 15
rightPadding: 0
Label {
id: labelTextName2
x: 120
width: 200
color: "#e8e9ec"
text: qsTr("other")
anchors.right: parent.right
anchors.top: parent.top
anchors.bottom: parent.bottom
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
anchors.rightMargin: -170
font.pointSize: 14
}
spacing: 20
}
Layout.fillWidth: true
Layout.alignment: Qt.AlignLeft | Qt.AlignTop
}
}
}
}
}
主頁.qml：
import QtQuick 2.0
import QtQuick.Controls 2.15
import "../controls"
import QtQuick.Layouts 1.0
Item {
id: item1
Rectangle {
id: rectangle
color: "#2c313c"
anchors.fill: parent
//property color backgroundColor: globalObject.switchValue ? "#ffffff" : "#000000"
Rectangle {
id: rectangleTop
height: 69
color: "#495163"
//color: backgroundColor
radius: 10
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
anchors.rightMargin: 50
anchors.leftMargin: 50
anchors.topMargin: 40
Label {
id: labelTextName
x: 10
color: "#e1e2e6"
text: qsTr("Welcome")
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
anchors.bottom: parent.bottom
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
anchors.topMargin: 22
anchors.bottomMargin: 22
anchors.leftMargin: 10
anchors.rightMargin: 10
font.pointSize: 14
}
}
Rectangle {
id: rectangleVisible
width: 540
color: "#1d2128"
radius: 10
anchors.left: parent.left
anchors.right: parent.right
anchors.top: rectangleTop.bottom
anchors.bottom: parent.bottom
anchors.bottomMargin: 40
anchors.rightMargin: 50
anchors.leftMargin: 50
anchors.topMargin: 10
GridLayout {
anchors.fill: parent
columnSpacing: 5
anchors.bottomMargin: 61
anchors.topMargin: 119
anchors.rightMargin: 10
anchors.leftMargin: 10
rows: 2
columns: 3
CustomButton{
id: btnChangeName
height: 70
text: "Bitcoin"
font.pointSize: 12
colorPressed: "#232435"
colorMouseOver: "#2b2c42"
colorDefault: "#252639"
Layout.leftMargin: 10
Layout.maximumWidth: 200
Layout.fillWidth: true
Layout.preferredHeight: 70
Layout.preferredWidth: 250
onClicked: {
backend.setBtc()
backend.setAsOfLabel()
}
}
CustomButton {
id: btnChangeName1
height: 70
text: "Ethereum"
font.pointSize: 12
colorPressed: "#232435"
colorMouseOver: "#2b2c42"
colorDefault: "#252639"
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
Layout.preferredWidth: 250
Layout.preferredHeight: 70
Layout.maximumWidth: 200
Layout.fillWidth: true
onClicked: {
backend.setEth()
backend.setAsOfLabel()
}
}
CustomButton {
id: btnChangeName2
height: 70
text: "Binance Coin"
font.pointSize: 12
colorPressed: "#232435"
colorMouseOver: "#2b2c42"
colorDefault: "#252639"
Layout.rightMargin: 10
Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
Layout.preferredWidth: 250
Layout.preferredHeight: 70
Layout.maximumWidth: 200
Layout.fillWidth: true
onClicked: {
backend.setBnb()
backend.setAsOfLabel()
}
}
CustomButton {
id: btnChangeName3
height: 70
text: "XRP"
font.pointSize: 12
colorPressed: "#232435"
colorMouseOver: "#2b2c42"
colorDefault: "#252639"
Layout.leftMargin: 10
Layout.preferredWidth: 250
Layout.preferredHeight: 70
Layout.maximumWidth: 200
Layout.fillWidth: true
onClicked: {
backend.setXrp()
backend.setAsOfLabel()
}
}
CustomButton {
id: btnChangeName4
height: 70
text: "sBDO"
font.pointSize: 12
colorPressed: "#232435"
colorMouseOver: "#2b2c42"
colorDefault: "#252639"
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
Layout.preferredWidth: 250
Layout.preferredHeight: 70
Layout.maximumWidth: 200
Layout.fillWidth: true
onClicked: {
backend.setsBdo()
backend.setAsOfLabel()
}
}
CustomButton {
id: btnChangeName5
height: 70
text: "BDO"
font.pointSize: 12
colorPressed: "#232435"
colorMouseOver: "#2b2c42"
colorDefault: "#252639"
Layout.rightMargin: 10
Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
Layout.preferredWidth: 250
Layout.preferredHeight: 70
Layout.maximumWidth: 200
Layout.fillWidth: true
onClicked: {
backend.setBdo()
backend.setAsOfLabel()
}
}
}
Label {
id: labelDate
y: 295
height: 25
color: "#55aaff"
text: qsTr(" ")
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
anchors.bottomMargin: 5
anchors.rightMargin: 10
anchors.leftMargin: 10
font.pointSize: 12
}
Label {
id: priceSet
height: 70
color: "#cbcbde"
text: qsTr("Please select the following:")
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
wrapMode: Text.Wrap
font.pointSize: 25
anchors.rightMargin: 50
anchors.leftMargin: 50
anchors.topMargin: 5
Component.onCompleted:{
}
}
Label {
id: asOfLabel
height: 70
color: "#cbcbde"
text: qsTr(" ")
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
wrapMode: Text.Wrap
anchors.rightMargin: 30
font.pointSize: 16
anchors.topMargin: 48
anchors.leftMargin: 30
}
}
}
Connections{
target: backend
function onPrintTime(time){
labelDate.text = time
}
function onBdoInfo(argument){
priceSet.text = argument
}
function onDiffsbdoInfo(argument){
priceSet.text = argument
}
function onAsOfLabel(argument){
asOfLabel.text = argument
}
function onAssetBTC(argument){
priceSet.text = argument
}
function onAssetBNB(argument){
priceSet.text = argument
}
function onAssetXRP(argument){
priceSet.text = argument
}
function onAssetsBDO(argument){
priceSet.text = argument
}
function onAssetBDO(argument){
priceSet.text = argument
}
function onAssetETH(argument){
priceSet.text = argument
}
}
}
1 個解決方案
解決方案1
1 2021-03-29 18:46:27
由於您沒有提供完整的代碼示例，因此無法在這里給出確切的答案。 如果您的主頁實例是 settings.qml 的父級，那么您可以通過id引用它。 這意味着如果您的代碼是這樣的：
// HomePage.qml
Item {
id: homepage
Settings {}
}
然后你的 Settings object 可以看到 HomePage 的屬性，你可以這樣做：
// Settings.qml
Rectangle {
Switch {
onToggled: {
homePage.doSomething()
}
}
}
或者你可以反過來做，並在設置中公開一個主頁可以訪問的屬性：
// Settings.qml
Rectangle {
property alias switchToggled: switch.toggled
Switch {
id: switch
}
}
// HomePage.qml
Item {
id: homepage
property color backgroundColor: settings.switchToggled ? 'red' : 'blue'
Settings { id: settings}
}
Or for a third option, you can have both HomePage and Settings access data from some external source, like a C++ or Python object, or some QML singleton. 看起來像這樣：
// Settings.qml
Rectangle {
Switch {
onToggled: {
globalObject.switchValue = toggled
}
}
}
// HomePage.qml
Item {
id: homepage
property color backgroundColor: globalObject.switchValue ? 'red' : 'blue'
}
QML - 如何將變量從一個qml文件發送/傳遞到其他qml文件
[英]QML - How to send/pass variable from one qml file to other qml file
如何使用Cascades，Blackberry 10中的Qt / QML / C ++從另一個qml文件更改一個qml文件中的標簽文本？
[英]How do I change the label text in one qml file from another qml file using Qt/QML/C++ in Cascades, Blackberry 10?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.