import Qt 4.7 Rectangle { id: rectangle property alias pathToIcon: image.source; property int iconWidth:rectangle.width-8; property int iconHeight:rectangle.height-8; signal clicked; function press() { mouseArea.pressed } radius: 50 MouseArea { id: mouseArea anchors.centerIn: parent; width: rectangle.width height: rectangle.height; onClicked: { rectangle.clicked(); } } Image { id: image z:4; smooth: true anchors.centerIn: parent width: iconWidth; height: iconHeight; } Image { id: image1 smooth: true width: (image1.sourceSize.width*parent.height)/image1.sourceSize.height +1 //(35*parent.height)/107 +1 height: parent.height anchors.left: parent.left source: "qrc:/button/buttonLeft.png" fillMode:Image.Stretch } Image { id: image3 smooth: true height: parent.height anchors.right: image2.left anchors.rightMargin: -1 anchors.left: image1.right anchors.leftMargin: -1 source: "qrc:/button/buttonCenter.png" fillMode:Image.Stretch //fillMode: Image.TileHorizontally } Image { id: image2 smooth: true width: (image1.sourceSize.width*parent.height)/image1.sourceSize.height +1//(35*parent.height)/107 +1 height: parent.height anchors.right: parent.right source: "qrc:/button/buttonR.png" fillMode:Image.Stretch } states: [ State { name: "disable"; when: (rectangle.enabled == false); PropertyChanges { target: image1; source: "qrc:/button/buttonLeftDisabled.png" } PropertyChanges { target: image3; source: "qrc:/button/buttonCenterDisabled.png" } PropertyChanges { target: image2; source: "qrc:/button/buttonRightDisabled.png" } }, State { name: "clicked"; when: (mouseArea.pressed == true && rectangle.enabled == true); PropertyChanges { target: image1; source: "qrc:/button/buttonLeftPushed.png" } PropertyChanges { target: image3; source: "qrc:/button/buttonCenterPushed.png" } PropertyChanges { target: image2; source: "qrc:/button/buttonRightPushed.png" } }, State { name: "focused"; when: (rectangle.enabled && !mouseArea.pressed && rectangle.focus) PropertyChanges { target: image1; source: "qrc:/button/buttonLeftFocus.png" } PropertyChanges { target: image3; source: "qrc:/button/buttonCenterFocus.png" } PropertyChanges { target: image2; source: "qrc:/button/buttonRFocus.png" } } ] }