Results 1 to 4 of 4

Thread: Listening for end of animation on accordion layout

  1. #1
    Sencha Premium Member
    Join Date
    Jul 2012
    Posts
    74
    Answers
    4
    Vote Rating
    1
      0  

    Default Unanswered: Listening for end of animation on accordion layout

    How would I go about listening for the end of the default animation when an item is added to an accordion panel is completed? See the code below:

    Code:
    Ext.define('App.view.AccordionView', {   extend: 'Ext.panel.Panel',
         layout: {
            type: 'accordion',
    animate: true
    } });

  2. #2
    Sencha - Support Team slemmon's Avatar
    Join Date
    Mar 2009
    Location
    Boise, ID
    Posts
    6,154
    Answers
    501
    Vote Rating
    247
      0  

    Default

    Code:
    Ext.create('Ext.panel.Panel', {
        title: 'Accordion Layout',
        width: 300,
        height: 300,
        defaults: {
            // applied to each contained panel
            bodyStyle: 'padding:15px'
        },
        layout: {
            // layout-specific configs go here
            type: 'accordion',
            titleCollapse: false,
            animate: true,
            activeOnTop: true
        },
        items: [{
            title: 'Panel 1',
            html: 'Panel content!'
        },{
            title: 'Panel 2',
            html: 'Panel content!'
        },{
            title: 'Panel 3',
            html: 'Panel content!'
        }],
        renderTo: Ext.getBody()
        , expandCollapse: function () {
            console.log('expand - collapse');
        }
        , listeners: {
            afterrender: function (p) {
                Ext.each(p.items.items, function (item) {
                    item.on({
                        expand: p.expandCollapse
                        , collapse: p.expandCollapse
                    });
                });
            }
        }
    });

  3. #3
    Sencha Premium Member
    Join Date
    Jul 2012
    Posts
    74
    Answers
    4
    Vote Rating
    1
      0  

    Default

    thanks slemmon, but that doesn't do what I need. In my application, the accordion container's contents changes dynamically and each time an item is added, it is given its own animation (by default) as it is added to the accordion. The code you gave me simply refers to the expand/collapse event and not the animation itself. What I need is a way to know when the animation on the screen has actually completed.

  4. #4
    Sencha Premium Member
    Join Date
    Jul 2012
    Posts
    74
    Answers
    4
    Vote Rating
    1
      0  

    Default

    It's like some kind of animation queue. For each panel added, it plays an animation in sequence without stepping on the animation of another item. I need to know when the last one is finished playing.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •