1. #1
    Sencha User
    Join Date
    Aug 2011
    Posts
    36
    Answers
    4
    Vote Rating
    2
    bjudson is on a distinguished road

      0  

    Default Answered: Ext.Anim 'after' callback?

    Answered: Ext.Anim 'after' callback?


    I'm seeing in several applications an 'after' config option for Ext.Anim that allows one to define a callback to fire once the animation is complete. This is not mentioned in the Sencha Touch API, and the Sencha 4 API has a different config option called 'callback'. When I look at the Sencha Touch source, it appears to reference an after config option:

    Code:
        run:function(el, config){
            el =Ext.get(el);
            config = config ||{};
    
    
            var me =this,
                style = el.dom.style,
                property,
                after = config.after;
    
            if(me.running[el.id]){
                me.onTransitionEnd(null, el,{
                    config: config,
                    after: after
                });
            }
    But including this as a config doesn't seem to do anything:

    Code:
            new Ext.Anim({
               from: {'opacity': 1},
               to: {'opacity': 0},
               duration: 500,
               after: function () {
                   console.log('after');
               }
            }).run(item.target);
    This will run the animation, but will not run the 'after' function. What is the appropriate way to define a callback for Ext.Anim?

  2. Hi bjudson.
    If you want to add a callback function to be called at your animation end, you can simply write your code in the following way:

    Code:
    //Define your animation
    var animation = new Ext.Anim({
           easing: 'easeIn',
           duration: 500,
           autoClear: false,
           from: {
               opacity: 1
           },
            to: {
                opacity: 0
           }
    });
            
    //Run the animation
    animation.run(item.target, {
       after: function(){
             console.log('after');
        }
    });
    Hope this helps.

  3. #2
    Sencha - Services Team AndreaCammarata's Avatar
    Join Date
    Jun 2009
    Posts
    1,394
    Answers
    148
    Vote Rating
    22
    AndreaCammarata has a spectacular aura about AndreaCammarata has a spectacular aura about

      0  

    Default


    Hi bjudson.
    If you want to add a callback function to be called at your animation end, you can simply write your code in the following way:

    Code:
    //Define your animation
    var animation = new Ext.Anim({
           easing: 'easeIn',
           duration: 500,
           autoClear: false,
           from: {
               opacity: 1
           },
            to: {
                opacity: 0
           }
    });
            
    //Run the animation
    animation.run(item.target, {
       after: function(){
             console.log('after');
        }
    });
    Hope this helps.
    Sencha Inc
    Andrea Cammarata, Solutions Engineer
    CEO at SIMACS

    @AndreaCammarata
    www.andreacammarata.com
    github: https://github.com/AndreaCammarata

    TUX components bundle for Sencha Touch 2.x.x
    http://www.tux-components.com/


  4. #3
    Sencha User
    Join Date
    Aug 2011
    Posts
    36
    Answers
    4
    Vote Rating
    2
    bjudson is on a distinguished road

      0  

    Default Thanks!

    Thanks!


    Just what I was looking for...

  5. #4
    Sencha - Services Team AndreaCammarata's Avatar
    Join Date
    Jun 2009
    Posts
    1,394
    Answers
    148
    Vote Rating
    22
    AndreaCammarata has a spectacular aura about AndreaCammarata has a spectacular aura about

      0  

    Default


    Quote Originally Posted by bjudson View Post
    Just what I was looking for...
    You are welcome
    Sencha Inc
    Andrea Cammarata, Solutions Engineer
    CEO at SIMACS

    @AndreaCammarata
    www.andreacammarata.com
    github: https://github.com/AndreaCammarata

    TUX components bundle for Sencha Touch 2.x.x
    http://www.tux-components.com/


  6. #5
    Ext JS Premium Member makiss's Avatar
    Join Date
    Jun 2008
    Location
    NYC
    Posts
    27
    Vote Rating
    0
    makiss is on a distinguished road

      0  

    Default


    Would be bloody nice if someone put "after" in the docs

    http://docs.sencha.com/touch/1-1/#!/api/Ext.Anim



  7. #6
    Sencha User
    Join Date
    Apr 2013
    Posts
    1
    Vote Rating
    0
    alex90 is on a distinguished road

      0  

    Default


    If you want to add an callback you can do like this:

    Code:
    Ext.Anim.run( 
            element.target, 
            'fade', 
            { 
               duration: 1500, 
               autoClear: false, 
               easing: 'ease-in', 
               from: { 
                   opacity: 1 
               }, 
               to: { 
                  opacity: 0 
               }, 
                after: function(el){ 
                   //do what you want 
                   Ext.get(el).destroy(); 
               } 
            } 
    )

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi