tests/auto/declarative/qmlvisual/animation/easing/easing.qml

   1 import QtQuick 1.0
   2 /* This test just animates y of a block with every easing curve*/
   3
   4 Rectangle {
   5     id: item
   6     height: 300
   7     width: layout.width
   8     color: "white"
   9     resources: [
  10         ListModel {
  11             id: easingtypes
  12             ListElement {
  13                 type: "Linear"
  14             }
  15             ListElement {
  16                 type: "InQuad"
  17             }
  18             ListElement {
  19                 type: "OutQuad"
  20             }
  21             ListElement {
  22                 type: "InOutQuad"
  23             }
  24             ListElement {
  25                 type: "OutInQuad"
  26             }
  27             ListElement {
  28                 type: "InCubic"
  29             }
  30             ListElement {
  31                 type: "OutCubic"
  32             }
  33             ListElement {
  34                 type: "InOutCubic"
  35             }
  36             ListElement {
  37                 type: "OutInCubic"
  38             }
  39             ListElement {
  40                 type: "InQuart"
  41             }
  42             ListElement {
  43                 type: "OutQuart"
  44             }
  45             ListElement {
  46                 type: "InOutQuart"
  47             }
  48             ListElement {
  49                 type: "OutInQuart"
  50             }
  51             ListElement {
  52                 type: "InQuint"
  53             }
  54             ListElement {
  55                 type: "OutQuint"
  56             }
  57             ListElement {
  58                 type: "InOutQuint"
  59             }
  60             ListElement {
  61                 type: "OutInQuint"
  62             }
  63             ListElement {
  64                 type: "InSine"
  65             }
  66             ListElement {
  67                 type: "OutSine"
  68             }
  69             ListElement {
  70                 type: "InOutSine"
  71             }
  72             ListElement {
  73                 type: "OutInSine"
  74             }
  75             ListElement {
  76                 type: "InExpo"
  77             }
  78             ListElement {
  79                 type: "OutExpo"
  80             }
  81             ListElement {
  82                 type: "InOutExpo"
  83             }
  84             ListElement {
  85                 type: "OutInExpo"
  86             }
  87             ListElement {
  88                 type: "InCirc"
  89             }
  90             ListElement {
  91                 type: "OutCirc"
  92             }
  93             ListElement {
  94                 type: "InOutCirc"
  95             }
  96             ListElement {
  97                 type: "OutInCirc"
  98             }
  99             ListElement {
 100                 type: "InElastic"
 101             }
 102             ListElement {
 103                 type: "OutElastic"
 104             }
 105             ListElement {
 106                 type: "InOutElastic"
 107             }
 108             ListElement {
 109                 type: "OutInElastic"
 110             }
 111             ListElement {
 112                 type: "InBack"
 113             }
 114             ListElement {
 115                 type: "OutBack"
 116             }
 117             ListElement {
 118                 type: "InOutBack"
 119             }
 120             ListElement {
 121                 type: "OutInBack"
 122             }
 123             ListElement {
 124                 type: "OutBounce"
 125             }
 126             ListElement {
 127                 type: "InBounce"
 128             }
 129             ListElement {
 130                 type: "InOutBounce"
 131             }
 132             ListElement {
 133                 type: "OutInBounce"
 134             }
 135         }
 136     ]
 137     Row {
 138         id: layout
 139         anchors.top: item.top
 140         anchors.bottom: item.bottom
 141         Repeater {
 142             model: easingtypes
 143             Component {
 144                 Rectangle {
 145                     id: block
 146                     Text {
 147                         text: type
 148                         anchors.centerIn: parent
 149                         font.italic: true
 150                         color: index & 1 ? "black" : "white"
 151                         opacity: 0 // 1 for debugging
 152                     }
 153                     width: 15
 154                     height: 30
 155                     color: index & 1 ? "red" : "blue"
 156                     states: [
 157                         State {
 158                             name: "from"
 159                             when: !mouse.pressed
 160                             PropertyChanges {
 161                                 target: block
 162                                 y: 0
 163                             }
 164                         },
 165                         State {
 166                             name: "to"
 167                             when: mouse.pressed
 168                             PropertyChanges {
 169                                 target: block
 170                                 y: item.height-block.height
 171                             }
 172                         }
 173                     ]
 174                     transitions: [
 175                         Transition {
 176                             from: "*"
 177                             to: "to"
 178                             reversible: true
 179                             NumberAnimation {
 180                                 properties: "y"
 181                                 easing.type: type
 182                                 duration: 1000
 183                             }
 184                         }
 185                     ]
 186                 }
 187             }
 188         }
 189     }
 190     MouseArea {
 191         id: mouse
 192         anchors.fill: layout
 193     }
 194 }