Changing Background color of window on button click in qml

问题

I developing qml project in that i want to add functionality of changing background color ..

for that i create one combo box with items {red,blue,white} and create one update button to update color when user select red item and click on update background color change as red so how can i do ??

Button {
            id: button1
            x: 284
            y: 95
            width: 114
            height: 34
            text: qsTr("Update")


            contentItem: Text {

                   font: control.font
                   opacity: enabled ? 1.0 : 0.3
                   text: "Update"
                   //Font.pixelSize:15
                   horizontalAlignment: Text.AlignHCenter
                   verticalAlignment: Text.AlignVCenter
                   elide: Text.ElideRight
               }
            background: Rectangle {
                       id: myRectId1
                       color: Colorchange.Rectange_Color
                       radius: 8
                   }
            onHoveredChanged: hovered ? myRectId1.opacity = 1 :
            myRectId1.opacity = .80;
            MouseArea {
                   id: mouseAreaScanbtn
                   anchors.fill: parent
                   hoverEnabled: true;
                   onEntered: { myRectId1.border.width = 2 }
                   onExited: { myRectId1.border.width = 1 }
                   onClicked: {
      //i want to add some code here to change background color
      // i tried 
            //window.color:combobox.currantindex()
}
               }
        }

回答1:

hi just use ComboBox Qml type like this:

ComboBox {

        currentIndex: -1
        width: 200
        model: [ "white", "blue" , "red" ]
        onCurrentIndexChanged:{

             background.color=model[currentIndex]

        }


}

or if you want to update the background color after user click the button you should save the color that user selected in a property then use this in onClicked of your button:

Item {
    id:root 
    property  var SelectedColor
    ComboBox {

        currentIndex: -1
        width: 200
        model: [ "white", "blue" , "red" ]
        onCurrentIndexChanged:{

             SelectedColor=model[currentIndex]

        }



}

来源：https://stackoverflow.com/questions/56624748/changing-background-color-of-window-on-button-click-in-qml

标签

qml