PDA

View Full Version : Animating Card layout or tab panel in Extjs



leobarnabas
26 Jul 2012, 11:48 AM
Hi,
I want to apply fade in effect when the items of card or tab panel changes, i didn't find any relevant config item to add effect to the items on change. how can i achieve this ?

mitchellsimoens
28 Jul 2012, 12:19 PM
Ext JS 3 or 4 so I can move it to the appropriate forum?

leobarnabas
29 Jul 2012, 5:36 AM
ExtJS 4 it is.

scottmartin
29 Jul 2012, 9:57 PM
Can you be more specific on what would change to cause this effect and what is to fade?

Scott.

leobarnabas
30 Jul 2012, 1:35 AM
http://dev.sencha.com/playpen/ext-core-latest/examples/carousel/

The above link shows some effects like sliding, fade in/out .

I want the effects like them, when i set the active item in the layout.

scottmartin
30 Jul 2012, 6:35 AM
I understand you want to fade, but you have not described your layout.

Do you mean text fields, showing panel, etc.. Your comment is too generic.

Items can me a lot of things ;)

Scott

leobarnabas
30 Jul 2012, 6:40 AM
The items in card ot tab will be of form layout, each containing lot of textbox, combo, radio. Like,

layout:'card',
items:[
{
xtype:'myForm',
},
{
xtype:'myForm2',
}
............]

where items of myForm will be,

items:[

{
xtype:'combo'
},
{
xtype:'combo'
}
...]

greghaynes
30 Jul 2012, 8:15 AM
I am looking for something exactly like this. I am using a card layout and want similar animation like the carousel with sliding. Would like when the user clicks the Next button to have the current card begin to slideOut and the new card slideIn concurrently.

Right now I'm just calling the slideIn on the callback for the current card which looks bad since I want to them to be moving at the same time.

Is this possible?