BB10 Cascades Animation Easy Tutorial

khalsa labs

Hi, here we got the BB10 Cascades Animation Easy Tutorial , for learn the animation using cascades UI in easy way. The small lines of code make it easy to feel like developer..

As the blackberry 10 cascade development are very easy to learn, blackberry itself provides many tutorials for that ,we are also trying to make ease for beginners at BB10 development. Here the code for animate an image.


import bb.cascades 1.0
Page {
 id: detail
Container {

Label : {
text: qsTr("click on image")
}
 ImageView {
 id: imageview
 imageSource: "asset:///images/singhs.jpg"
 preferredHeight: 300
 onTouch: {
 if(event.isDown())
     {
       animTest.play()
     }
 }
         }

 animations: [
 TranslateTransition {
 id: animTest
 fromX: 20
 fromY: 10
 toX: HorizontalAlignment.Center
 toY: 300
 } ]

}
}

 

In above code,Translate animation is used.. you can use other animations same like this. The other animation supported are:

  • FadeTransition
  • RotateTransition
  • ScaleTransition
  • TranslateTransition