如何切换Qt5实时控制QML样式

时间:2014-03-17 20:28:10

标签: c++ qt qml

所以我的目标是为我所创建的应用程序设置主题。我希望能够检查一个菜单选项,一旦我按下它就会改变应用程序的主题;并按下按钮将主题更改回原生主题。我理解如何设置Qt Quick Controls的样式,但是我在加载和卸载这些主题时遇到了麻烦。目前我的应用程序带有Qt Controls附带的原生主题。我能够加载自定义样式,但我无法将它们交换为自定义样式和本机主题。我将如何创建此功能?

例如,我正在尝试交换TableView的主题。我首先尝试将TableViewStyle的属性设置为styleData.value这产生了保持类似本机主题的预期效果,但现在我将如何将Rectangle QmlObject分配给属性值?解释器抱怨我怎么不能将对象分配给属性。

TableViewStyle {
    property string color: styleData.value
    headerDelete: color                      // This does not work. Because 
                                             // styleData.value in undefined

    //property string color: rect            // Currently doing this does not
    //Rectangle {id: rect; color: "red"}     // have any effect on the value of
    //headerDelegate: color                  // the headerDelegate. Putting the
                                             // Rectangle in a Component produces
                                             // The same value too.

}

1 个答案:

答案 0 :(得分:0)

我没有找到回归默认样式的方法,而不必先使用默认样式加载元素并保存它,但这适用于在两个自定义样式和默认Button之间切换ButtonStyle 1}}

// Property used to save the default ButtonStyle
property var defaultStyle: undefined
// Property used to know the current style
property string currentStyle: "blue"

Button {
  id: myBtn
    text: qsTr("Hello World")
    anchors.centerIn: parent

    onClicked: {
      if(currentStyle == "blue") {
        style = myButtonStyleRed;
        currentStyle = "red";
      } else if(currentStyle == "red") {
        style = defaultStyle;
        currentStyle = "default";
      } else {
        style = myButtonStyleBlue;
        currentStyle = "blue";
      }
    }

    // Save the default Button style on load before switching to the blue one
    Component.onCompleted: {
      defaultStyle = myBtn.style;
      myBtn.style = myButtonStyleBlue;
    }
}

Component {
  id: myButtonStyleBlue
  ButtonStyle {
    label: Text {
      color: "blue"
      text: control.text
    }
  }
}

Component {
  id: myButtonStyleRed
  ButtonStyle {
    label: Text {
      color: "red"
      text: control.text
    }
  }
}