Question

我使用Qt Quick Designer制作了一个非常基本的GUI。单击一个按钮时，我想要一些文字来改变颜色。所以这就是我对代码所拥有的：

onClicked: {

     if(displayText.color == "#ff0000") {
           displayText.color = "Black";
     }
     else if(displayText.color == "#000000"){
           displayText.color = "Red";
     } 
}

因此，当我运行它时，这会有效，但当我尝试进入Qt设计视图时，它会说＆＃34; Qt Quick Designer＆＃34;中不支持命令代码。我做错了什么或者这只是我遇到的Qt怪癖？我知道有很多方法可以在C ++中处理这个问题，但我希望在QML中完成所有这些工作。

Answer 1

忽略警告。您的代码没问题，只有Qt Quick Designer无法运行脚本或正确处理某些脚本绑定。我建议您使用状态而不是脚本化属性更改。它将产生更清晰，更少冗余的代码：

onClicked: state = (state !== 'clicked' ? 'clicked' : '')

color: '#ff0000'   // or #000000, if that's your default color

states: State [
   name: 'clicked'
   PropertyChanges {
      target: displayText
      color: '#000000'
   }
]

Qt Quick Designer非常好地处理状态（它在顶部显示），您可以在其中选择状态并更改设计器中的属性值。

Answer 2

您只需使用指示颜色的简单布尔标志：

property bool colorFlag: false
...
color: colorFlag ? "black" : "red"
...
onClicked: colorFlag = !colorFlag

或者您可以使用以下内容：

MouseArea {
    id: myMa
}
...
color: myMa.clicked ? "black" : "red"

这种方式比州便宜得多。

如何在Qt QML中以声明方式更改文本的颜色

2 个答案: