Results 1 to 4 of 4

Thread: Carousel twitch/glitch

  1. #1
    Sencha User
    Join Date
    Jul 2013
    Posts
    29
    Answers
    2

    Default Answered: Carousel twitch/glitch

    Hi all,

    I've a question about the carousel. I've created an extension on the basic carousel that enables me to create carousels based on my store which dynamically loads cards in the carousel in front and after the current card enabling the user to swipe his way through a store.

    The carousel is created when a user does an itemtap in a list and the detailpage of that item should be shown. I want the user to be able to swipe his way through all the detailpages.

    This all works fine, but because i fill the carousel dynamically based on which item was tapped and then add the carousel to an empty existing tabPanel, the rendering glitches the first X ms.

    The problem is that when i add the three cards (0, 1, 2) and set 1 as the active item, when the carousel is added to panel and the panel is visible to the user, for an instant, you see the first (0) card and then the second (1, correct one). Afterwards everything works well, but for a split second you see the cards glitch. When adding the cards to the carousel i immediately set the middle card as the active item (not on showing the carousel).
    Because all cards have an image at the top, the glitch is very noticeable.
    (the glitch with overlapping cards is fixed by setting the background color per card).

    I've tried setting a timeout between the creation of the carousel and the actual adding to the card and the adding of the carousel to the panel to allow the rendering to be done offscreen, but no luck.

    Anyone else had this issue, or sees something wrong with my approach? Or anyone know anything i could try?

    Any help is appreciated!

  2. You'll always see this happens... I've seem to fixed the issue. To fill the carousel what i used to do was create an array of detail-pages and added them to the carousel via carousel.setItems() after which i called carousel.setActiveItem() to view the middle item. This gave the twitch.
    What i've changed is that i no longer create an array of items and set the active item, i now call carousel.insert(i, (the instantiated panel)); That way you immediately say in which order the items should be shown.
    For some (dark) reason, this fixed the issue for me. I've no idea why though, but if anyone comes here through google...

  3. #2
    Sencha User
    Join Date
    Feb 2013
    Location
    California
    Posts
    11,985
    Answers
    506

    Default

    I couldn't find any existing reports of this. Are you able to recreate it in a test case?
    https://fiddle.sencha.com/#home

  4. #3
    Sencha User
    Join Date
    Jul 2013
    Posts
    29
    Answers
    2

    Default

    You'll always see this happens... I've seem to fixed the issue. To fill the carousel what i used to do was create an array of detail-pages and added them to the carousel via carousel.setItems() after which i called carousel.setActiveItem() to view the middle item. This gave the twitch.
    What i've changed is that i no longer create an array of items and set the active item, i now call carousel.insert(i, (the instantiated panel)); That way you immediately say in which order the items should be shown.
    For some (dark) reason, this fixed the issue for me. I've no idea why though, but if anyone comes here through google...

  5. #4
    Sencha User
    Join Date
    Feb 2013
    Location
    California
    Posts
    11,985
    Answers
    506

    Default

    Thanks for sharing your solution with the community.

Similar Threads

  1. Nothing will shop up - Glitch?
    By alejandroNNU in forum Sencha Architect 2.x: Help & Discussions
    Replies: 10
    Last Post: 24 Oct 2013, 10:54 AM
  2. [OPEN] Carousel item layout "glitch", ST 2.1.1 (regression from 2.0.1)
    By skmp in forum Sencha Touch 2.x: Bugs
    Replies: 3
    Last Post: 27 Feb 2013, 3:02 PM
  3. [CLOSED] [RC2] css glitch in form
    By olouvignes in forum Sencha Touch 2.x: Bugs
    Replies: 2
    Last Post: 2 Mar 2012, 1:54 PM
  4. Tabpanel IE7 glitch
    By napolux in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 28 May 2009, 2:03 AM
  5. fadeOut glitch in IE7
    By krukow in forum Ext 1.x: Bugs
    Replies: 2
    Last Post: 28 Jul 2007, 3:33 AM

Tags for this Thread

Posting Permissions

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