vcs.maemo.org Git - ubi/blob - qml/ubi/components/ButtonNew.qml

   1 import QtQuick 1.0 // to target S60 5th Edition or Maemo 5
   2 import "../UIConstants.js" as Const
   3
   4 Item {
   5     id: root
   6     property string label
   7     property bool disabled: false
   8     property int maxSize: 27
   9     property string iconSource
  10
  11     state: mouseArea.pressed && !root.disabled ? "pressed" : "unpressed"
  12
  13     signal buttonClicked(string label)
  14
  15     Rectangle {
  16         id: shadow
  17         width: box.width
  18         height: box.height
  19         color: Const.SHADOW_COLOR;
  20         radius: 10
  21     }
  22
  23     Rectangle {
  24         id: box
  25         color: root.disabled ? Const.COOL_GREY_COLOR : "black"
  26         height: root.height
  27         width: root.width
  28         radius: 10
  29     }
  30
  31     Rectangle {
  32         width: box.width
  33         height: box.height
  34         x: box.x
  35         y: box.y
  36         color: Const.WARM_GREY_COLOR
  37         radius: 10
  38         visible: root.state == "pressed"
  39     }
  40
  41     onLabelChanged: {
  42         if(root.label.length>root.maxSize) {
  43             textbox.text = root.label.substring(0,root.maxSize-3)+"...";
  44         } else {
  45             textbox.text = root.label;
  46         }
  47     }
  48
  49     Row {
  50         anchors.centerIn: box
  51         spacing: Const.DEFAULT_MARGIN
  52         Image {
  53             id: icon
  54             width: 40
  55             height: 40
  56             source: root.iconSource == "" ? "" : "../" + root.iconSource
  57             sourceSize.width: width
  58             sourceSize.height: height
  59             visible: root.iconSource!=""
  60         }
  61
  62         Text {
  63             id: textbox
  64             font.pixelSize: 30
  65             color: root.disabled ? "gray" : "white"
  66         }
  67     }
  68
  69     MouseArea {
  70         id: mouseArea
  71         width: box.width
  72         height: box.height
  73         onClicked: root.buttonClicked(root.label)
  74         enabled: !root.disabled
  75     }
  76
  77     states: [
  78         State {
  79             name: "unpressed"
  80             PropertyChanges {target: shadow; x: Const.SHADOW_OFFSET}
  81             PropertyChanges {target: shadow; y: Const.SHADOW_OFFSET}
  82             PropertyChanges {target: box; x: 0}
  83             PropertyChanges {target: box; y: 0}
  84         },
  85         State {
  86             name: "pressed"
  87             PropertyChanges {target: shadow; x: Const.SHADOW_OFFSET}
  88             PropertyChanges {target: shadow; y: Const.SHADOW_OFFSET}
  89             PropertyChanges {target: box; x: Const.SHADOW_OFFSET}
  90             PropertyChanges {target: box; y: Const.SHADOW_OFFSET}
  91         }
  92     ]
  93 }
  94
  95
  96