1 import Qt 4.6

     2 

     3 //Implementation of the dialButton control.

     4 Item {

     5     id: dialButton

     6     width: 50

     7     height: 50

     8     property alias buttonText: innerText.text;

     9     property alias color: rectangleButton.color

    10     property color hoverColor: "lightsteelblue"

    11     property color pressColor: "slategray"

    12     signal clicked

    13 

    14     Rectangle {

    15         id: rectangleButton

    16         anchors.fill: parent

    17         radius: 5

    18         color: "steelblue"

    19         border.width: 3

    20         border.color: "black"

    21 

    22         Text {

    23             id: innerText

    24             font.pointSize: 20

    25             anchors.centerIn: parent

    26         }

    27     }

    28    

    29     states: [

    30         State {

    31             name: "Hovering"

    32             PropertyChanges {

    33                 target: rectangleButton

    34                 color: hoverColor

    35             }

    36         },

    37         State {

    38             name: "Pressed"

    39             PropertyChanges {

    40                 target: rectangleButton

    41                 color: pressColor

    42             }

    43         }

    44     ]

    45    

    46    

    47     transitions: [

    48         Transition {

    49             from: ""; to: "Hovering"

    50             ColorAnimation { duration: 100 }

    51         },

    52         Transition {

    53             from: "*"; to: "Pressed"

    54             ColorAnimation { duration: 10 }

    55         }

    56     ]

    57    

    58     MouseRegion {

    59         hoverEnabled: true

    60         anchors.fill: dialButton

    61         onEntered: { dialButton.state='Hovering'}

    62         onExited: { dialButton.state=''}

    63         onClicked: { dialButton.clicked();}

    64         onPressed: { dialButton.state="Pressed" }

    65         onReleased: {

    66             if (containsMouse)

    67             dialButton.state="Hovering";

    68             else

    69             dialButton.state="";

    70         }

    71     }

    72 }