1 import Qt 4.6

     2 

     3 Rectangle {

     4     color: "white"

     5 

     6     Rectangle {

     7         x: 20

     8         y: 10

     9         width: 60

    10         height: 10

    11         color: "black"

    12     }

    13 

    14     Rectangle {

    15         x: 10

    16         y: 20

    17         width: 80

    18         height: 200

    19         color: "black"

    20     }

    21 

    22     Rectangle {

    23         //! [1]

    24         id: visualCharge

    25         x: 12

    26         y: 22 + 196 - height

    27         width: 76

    28         height: 196 * batteryCharge.value / 100

    29         clip: true

    30         color: "green"

    31         //! [1]

    32 

    33         Particles {

    34             id: bubbles

    35             width: parent.width

    36             anchors.bottom: parent.bottom

    37             source: "bubble.png"

    38             count: 0

    39             velocity: 30

    40             velocityDeviation: 10

    41             angle: -90

    42             //lifeSpan: parent.height * 1000 / (velocity + velocityDeviation / 2)

    43             lifeSpan: parent.height * 1000 / (30 + 10 / 2)

    44         }

    45 

    46         states: [

    47         //! [3]

    48         State {

    49             name: "charging"

    50             when: batteryCharging.value

    51             PropertyChanges {

    52                 target: bubbles

    53                 count: batteryCharge.value / 5

    54                 emissionRate: 5

    55             }

    56         },

    57         //! [3]

    58         //! [2]

    59         State {

    60             name: "low"

    61             when: batteryCharge.value < 25 && !batteryCharging.value

    62             PropertyChanges {

    63                 target: visualCharge

    64                 color: "red"

    65             }

    66         }

    67         //! [2]

    68         ]

    69 

    70         transitions: [

    71         Transition {

    72             from: "*"

    73             to: "low"

    74             reversible: true

    75             ColorAnimation {

    76                 duration: 200

    77             }

    78         }

    79         ]

    80     }

    81 

    82     //! [0]

    83     ValueSpaceSubscriber {

    84         id: batteryCharge

    85         path: "/power/battery/charge"

    86     }

    87     ValueSpaceSubscriber {

    88         id: batteryCharging

    89         path: "/power/battery/charging"

    90     }

    91     //! [0]

    92 }