Ionic2-Calendar icon indicating copy to clipboard operation
Ionic2-Calendar copied to clipboard

Slides looping

Open Manduro opened this issue 7 years ago • 4 comments

This is about the Swiper issue as noted in the readme:

This component updates the ion-slide dynamically so that only 3 looped slides are 
needed. The ion-slide in Ionic2 uses Swiper. It seems in the Swiper implementation, 
the next slide after the end of looped slide is a separate cached slide, instead of the 
first slide. I can't find out a way to force refresh that cached slide, so you will notice 
that when sliding from the third month to the forth month, the preview month is not 
the forth month, but the first month. Once the sliding is over, the slide will be forced 
to render the forth month.

It seems to be the exact same issue as this: https://github.com/driftyco/ionic/issues/6515, an issue when using NgFor on slides. Some options for workarounds are mentioned there, but I haven't succeeded implementing one so far. Did you already try something like it?

Manduro avatar Sep 23 '16 10:09 Manduro

This is such an irritating bug specially in day view.

I see there is an "observer" object on slider that apparently watches for changes on slider and then should autorefresh the cached slide - i havent been able to try it but maybe that is something you can see if you can get working...

observer boolean false Set to true to enable Mutation Observer on Swiper and its elements. In this case Swiper will be updated (reinitialized) each time if you change its style (like hide/show) or modify its child elements (like adding/removing slides) observeParents boolean false Set to true if you also need to watch Mutations for Swiper parent elements

ganySA avatar Nov 02 '16 04:11 ganySA

@twinssbc Can this be closed off or is this still an issue?

Upperfoot avatar Aug 31 '17 10:08 Upperfoot

@Upperfoot I think this behavior still presents. When you swipe from the 3rd slide to the 4th slide, since it's using a 3 slides loop, it will first display the original 1st slide, then quickly turn to the 4th slide.

twinssbc avatar Sep 01 '17 14:09 twinssbc

Hi. I use tabindex in monthviewDisplayEventTemplate for accessibility purposes (on web version). I don't use Tabindex in monthviewInactiveDisplayEventTemplate.

Using Tab from on the last day in monthview, the calendar automatically displays the first next date of the fourth month (4th slide (cached one)).

In the below screenshot the focus is visible on last day in current month. That's normal. current-month-focus -last-day

Then, when user press Tab the focus goes to the 4th cached slides has shown in the next screenshot (where we can see the 3rd slide and the first row of the 4th slide). ionic2-calendar-tabindex-4th-slide

And in backward (maj+tab), the first displayed month is 4th one (from cache) which has exactly the same look as 1st one. But the events are not handled because it's not the active month which is displayed.

I think that Tabindex should not be handled in cached slide... Is it a bug in Ionic2-calendar or Ionic ?

One more thing : I don't know why, but both weekview and dayview handle a tabindex, but not monthview. So it is possible to display inactive Weekview and Dayview slides (empty/blank) setting focus on inactive's ones. weekview-inactive-displayed-week

Titoch avatar Mar 26 '18 10:03 Titoch