vcs.maemo.org Git - mdictionary/blob - src/mdictionary/qml/ComboBox.qml

   1 import Qt 4.7
   2
   3 Rectangle {
   4     id: rectangle1
   5     radius: 10
   6     border.color: "#000666";
   7     property alias value:text1.text
   8     property alias index: list1.currentIndex
   9     property alias model: list1.model
  10     property bool expanded: false
  11     property bool disabled: false
  12     property int expandedHeight
  13     property int basicHeight
  14     property string startValue
  15     height: 20
  16
  17     property variant parentField : rectangle1
  18
  19     function show(Boolean){
  20         expanded = Boolean
  21     }
  22
  23     function setStartValue(val, idx){
  24         startValue = val
  25         list1.currentIndex = idx
  26     }
  27
  28     signal valueSelected(string selected);
  29
  30    /* Keys.onPressed: {
  31         console.log("tu ----");
  32         if (event.key == Qt.Key_Escape)
  33             rectangle1.expanded=false;
  34         else if (event.key == Qt.Key_Space)
  35             rectangle1.expanded=true;
  36         else if (event.key == Qt.Key_Return){
  37             rectangle1.expanded=false;
  38             console.log("tu enter "+list1.content);
  39         }
  40     }
  41     */
  42
  43     Text {
  44         id: text1
  45         width: rectangle1.width-15
  46         height: rectangle1.height*0.6;
  47         text: list1.selected
  48         anchors.centerIn: parent
  49         font.pixelSize: rectangle1.height * .5;
  50         onTextChanged: { rectangle1.valueSelected(text) }
  51         z: expanded?0:1;
  52     }
  53
  54     Rectangle {
  55         id: shadeDisable
  56         width:  parent.width;
  57         height: parent.height;
  58         anchors.centerIn: parent;
  59         radius: parent.radius
  60         color: "grey";
  61         opacity: 0.5
  62     }
  63
  64     Image {
  65         id: imageDown
  66         z:15;
  67         width: 11;
  68         height: 0.5 * rectangle1.height;
  69         anchors.top: parent.top
  70         anchors.right: parent.right
  71         anchors.topMargin: 4
  72         anchors.rightMargin: 6
  73         anchors.bottomMargin: 4
  74         source: "qrc:/button/down_enable.png";
  75
  76         MouseArea{
  77             id: imgMouseArea
  78             anchors.fill: parent
  79             onClicked: {
  80                 rectangle1.show(!rectangle1.expanded)
  81             }
  82         }
  83     }
  84
  85     MouseArea{
  86         id: topMouseArea
  87         z: 5
  88         anchors.fill: parent
  89         onClicked: {
  90             rectangle1.show(!rectangle1.expanded)
  91         }
  92     }
  93
  94     ElementsListView{
  95         id: list1
  96         visible: false
  97         property string selected: rectangle1.startValue
  98
  99         function selectedValue(nr, value) {
 100             currentIndex = nr
 101             selected = value
 102             rectangle1.show(false)
 103         }
 104
 105         anchors.rightMargin: 5
 106         anchors.leftMargin: 5
 107         anchors.bottomMargin: 10
 108         anchors.topMargin: 10
 109         anchors.fill: parent
 110
 111         highlightResizeSpeed: 1000
 112         delegate: Component{
 113             id: list1Delegate
 114             Item {
 115                 width: rectangle1.width
 116                 height: contentText.height
 117
 118                 MouseArea{
 119                     id: listMouseArea
 120                     anchors.fill: parent
 121                     z: 1
 122                     onClicked: {
 123                         list1.selectedValue(number, content)
 124                     }
 125                     hoverEnabled: true
 126                     onEntered: {
 127                         list1.currentIndex = number
 128                     }
 129                 }
 130
 131                 Row{
 132                     anchors.fill: parent
 133
 134                     Text{
 135                         id: contentText
 136                         anchors.verticalCenter: parent.verticalCenter
 137                         anchors.leftMargin: 5
 138                         elide: Text.ElideRight;
 139                         text: content
 140                     }
 141                 }
 142             }
 143         }
 144
 145     }
 146
 147     states: [
 148         State {
 149             name: "basic";
 150             when: (rectangle1.expanded == false && rectangle1.disabled == false)
 151             PropertyChanges { target: list1; z: 0; visible: false }
 152             PropertyChanges { target: text1; z: 0; visible: true }
 153             PropertyChanges { target: rectangle1; border.width: 1}
 154             PropertyChanges { target: rectangle1; height: rectangle1.basicHeight}
 155             PropertyChanges { target: imageDown; height: 0.5 * rectangle1.basicHeight}
 156             PropertyChanges { target: shadeDisable; visible: false; z:-1}
 157         },
 158         State {
 159             name: "expanded"
 160             when: (rectangle1.expanded == true && rectangle1.disabled == false)
 161             PropertyChanges { target: list1; z: 10; visible: true }
 162             PropertyChanges { target: text1; z: 10; visible: false }
 163             PropertyChanges { target: rectangle1; border.width: 1}
 164             PropertyChanges { target: rectangle1; height: rectangle1.expandedHeight}
 165             PropertyChanges { target: imageDown; height: 0.5 * rectangle1.basicHeight}
 166             PropertyChanges { target: shadeDisable; visible: false; z: -1}
 167             PropertyChanges { target: rectangle1; anchors.fill: parentField}
 168         },
 169         State {
 170             name: "disabled";
 171             when: rectangle1.disabled == true
 172             PropertyChanges { target: list1; z: 0; visible: false }
 173             PropertyChanges { target: text1; z: 0; visible: true }
 174             PropertyChanges { target: rectangle1; border.width: 1}
 175             PropertyChanges { target: rectangle1; expanded: false}
 176             PropertyChanges { target: rectangle1; height: rectangle1.basicHeight}
 177             PropertyChanges { target: imageDown; visible: true}
 178             PropertyChanges { target: shadeDisable; visible: true; z:10}
 179         }
 180     ]
 181
 182 }
 183