qml example: add image on button |
import QtQuick 2.0 Rectangle { width: 360 height: 360 Rectangle { id: myButton width: 200 height: 120 anchors.centerIn: parent property color buttonColor: "white" property color buttonColorPressed: "gray" property color buttonBorderColor: "gray" property color buttonBorderColorPressed: "black" MouseArea{ id: myButtonMouseArea anchors.fill: parent } color: myButtonMouseArea.pressed ? buttonColorPressed : buttonColor border.width: 2 border.color: myButtonMouseArea.pressed ? buttonBorderColorPressed : buttonBorderColor Text{ id: buttonLabel anchors { horizontalCenter: parent.horizontalCenter top: parent.top } color: "black" text: "Button Label" } Image { id: buttonImage source: "http://goo.gl/kdbgF8" anchors { horizontalCenter: parent.horizontalCenter top: buttonLabel.bottom } } } }
qml button step-by-step