Sencha Touch Cookbook

Animate me!

A Sencha Touch application is built using the elements, represented by Ext.Element , and every element of it can be animated. In this recipe, we will see how to animate an element, what are the available types of animations, and how to change the animation properties.

Getting ready

Make sure that you have set up your development environment by following the recipes outlined in Chapter 1.

Create a new folder named ch07 in the same folder where we had created ch01 and ch02 folders. We will be using this new folder to keep the code.

How to do it...

Carry out the following steps:

1. Create and open a new file named ch07_01.js and paste the following code into it:

   Ext.setup({ onReady: function() { var pnl = new Ext.Panel({ renderTo: Ext.getBody(), ...