View Full Version : animating bars from left to right

23 Sep 2010, 10:43 AM

sorry for another newbie question but didn't find an example. How can I animate 4 bars in one graph from the left to the right? I've no code so far and this should happen in an extra card or a floating panel. Any hints that lead me in the right direction?

Thanks in advance ...

23 Sep 2010, 1:36 PM
What do you mean "bars"? Sencha Touch doesn't have charts or graphs.

23 Sep 2010, 11:53 PM
Yes, a chart is what i ment, something like this:


And the four bars should be animated from the left to the right. What about the animation techniques of ext.element? I'm not sure how to use them and i didn't find any example. Can anybody help me?

23 Sep 2010, 11:58 PM
tabletStartupScreen: 'tablet_startup.png',
phoneStartupScreen: 'phone_startup.png',
icon: 'icon.png',
glossOnIcon: false,
onReady: function(){

var el = Ext.getBody().createChild({
style: 'background-color: red; width: 0px; height: 20px;'

var opts = Ext.apply({
autoClear: false,
before: function(el){
this.to = {
'width': '200px'
new Ext.Anim(opts).run(el);

24 Sep 2010, 12:47 AM
Hi evant,

thanks a lot for your quick reply, that helps me going on.

But without examples like this it is really hard to learn. For example why do the docs only allow to search for classes? It would be extremely helpful if you could search for any expression. Or, to come back to this example, how should i know that i need this line of code:

Ext.select('.x-body-stretcher').remove();And 'Ext.Anim' in the docs tell me that they are '... to be used for transitions.' That's why i looked for other possibilities and found the animation techniques of ext.element. But what are the differences now?

Sorry, but i'm still confused and learning ...