1. #1
    Sencha Premium Member
    Join Date
    Aug 2008
    Posts
    209
    Vote Rating
    4
    squarefan is on a distinguished road

      1  

    Default Change Carousel Item with fade animation

    Change Carousel Item with fade animation


    Running into an issue and not quite sure how to solve it.

    I am using a normal carousel (no card layout) that behaves as expected. What I want to do is to quick jump to specific items and do that with a 'fade' animation instead of the just the plain jump directly there.

    in Touch 1 i used:

    Code:
    setActiveItem(position, 'fade');
    which worked great. Looking in the docu I saw that this should be done now with:

    Code:
    animateActiveItem(position, {type: 'fade'})
    Unfortunately that doesn't work as well. First for it to work I have to change the layout of the carousel to 'card' which results in flickering and slow/delayed loading of images while going back and forth between the different cards (which wihtout the layout set to card works perfectly fine).
    If I don't set the layout to card though, the animation itself will not work.

    Is there a way to let the carousel behave normally (slide left/right) and somehow get the same functionality as with setActiveItem in Touch 1 where I can just pass the 'fade' property?

    thanks!

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,220
    Vote Rating
    859
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    The carousel has a next and previous methods on it.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha Premium Member
    Join Date
    Aug 2008
    Posts
    209
    Vote Rating
    4
    squarefan is on a distinguished road

      0  

    Default


    Hi, thanks for the reply.

    Unfortuantely thats not exactly what I was looking for. I knew about next/previous but that just brings you to the next/previous slide. What I want to do is having e.g. 15 slides/cards in the carousel jump from no1 to 10 etc. and that jump should be done with a fade animation (as mentioned in my first post I did that with setActiveItem under Touch 1 and that worked great).

    Is there anything else I can do?

  4. #4
    Sencha User
    Join Date
    Nov 2010
    Posts
    392
    Vote Rating
    6
    gkatz is on a distinguished road

      0  

    Default


    in ST2 this can be done via animateActiveItem
    http://docs.sencha.com/touch/2-0/#!/...mateActiveItem

  5. #5
    Sencha Premium Member
    Join Date
    Aug 2008
    Posts
    209
    Vote Rating
    4
    squarefan is on a distinguished road

      0  

    Default


    @gkatz

    thanks for your response. As mentioned in my first post there are several issues when using animateActiveItem.

  6. #6
    Sencha Premium Member
    Join Date
    Aug 2008
    Posts
    209
    Vote Rating
    4
    squarefan is on a distinguished road

      0  

    Default


    is there any fix for that yet. 2.0.1.1 seems to be a pretty broken release with several things not working for me and I am looking for a workaround in 2.0.0 for this?

    anybody stumbled over this already?

    cheers,

Thread Participants: 2