X-Git-Url: http://git.maemo.org/git/?a=blobdiff_plain;f=qml%2Fubi%2Fcomponents%2FButtonNew.qml;fp=qml%2Fubi%2Fcomponents%2FButtonNew.qml;h=fe9d6e7babe6afbd803def4757ef7923aca714b0;hb=91a77e559e2a6ca0ea5d1263392c845d2f856f91;hp=0000000000000000000000000000000000000000;hpb=0aa75d0b12f662d3416f9aaa3e3f6e867a96e0a1;p=ubi diff --git a/qml/ubi/components/ButtonNew.qml b/qml/ubi/components/ButtonNew.qml new file mode 100644 index 0000000..fe9d6e7 --- /dev/null +++ b/qml/ubi/components/ButtonNew.qml @@ -0,0 +1,106 @@ +import QtQuick 1.0 // to target S60 5th Edition or Maemo 5 +import "../UIConstants.js" as Const + +Item { + id: root + property string label + property bool disabled: false + property int maxSize: 27 + property string iconSource + + state: mouseArea.pressed && !root.disabled ? "pressed" : "unpressed" + + //width: box.width + //height: box.height + + signal buttonClicked(string label) + + Rectangle { + id: shadow + width: box.width + height: box.height + color: Const.SHADOW_COLOR; + radius: 10 + } + + Rectangle { + id: box + color: root.disabled ? Const.COOL_GREY_COLOR : "black" + //height: textbox.height+20 + height: root.height + //width: textbox.width<100 ? 120 : textbox.width+20 + width: root.width + radius: 10 + } + + Rectangle { + width: box.width + height: box.height + x: box.x + y: box.y + color: Const.WARM_GREY_COLOR + radius: 10 + visible: root.state == "pressed" + //border.color: "black" + //border.width: Const.SHADOW_OFFSET + } + + Image { + id: icon + width: 40 + height: 40 + anchors.centerIn: box + source: root.iconSource == "" ? "" : "../" + root.iconSource + sourceSize.width: width + sourceSize.height: height + } + + onLabelChanged: { + if(root.label.length>root.maxSize) { + console.log("root.label: "+root.label) + console.log("root.label.length: "+root.label.length) + console.log("root.maxSize: "+root.maxSize) + textbox.text = root.label.substring(0,root.maxSize-3)+"..."; + } else { + textbox.text = root.label; + } + } + + Text { + id: textbox + //x: 10 + //y: 10 + font.pixelSize: 30 + color: root.disabled ? "gray" : "white" + anchors.centerIn: box + visible: root.iconSource == "" + } + + MouseArea { + id: mouseArea + width: box.width + height: box.height + onClicked: root.buttonClicked(root.label) + enabled: !root.disabled + } + + states: [ + State { + name: "unpressed" + PropertyChanges {target: shadow; x: Const.SHADOW_OFFSET} + PropertyChanges {target: shadow; y: Const.SHADOW_OFFSET} + PropertyChanges {target: box; x: 0} + PropertyChanges {target: box; y: 0} + }, + State { + name: "pressed" + PropertyChanges {target: shadow; x: Const.SHADOW_OFFSET} + PropertyChanges {target: shadow; y: Const.SHADOW_OFFSET} + PropertyChanges {target: box; x: Const.SHADOW_OFFSET} + PropertyChanges {target: box; y: Const.SHADOW_OFFSET} + } + ] +} + + +