Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG][iOS] Maui 8.0.10+ - CarouselView - Previous item content disappears after scrolling to next item #22015

Open
RedZone908 opened this issue Apr 23, 2024 · 5 comments · May be fixed by #22280
Assignees
Labels
area-controls-collectionview CollectionView, CarouselView, IndicatorView area-xaml XAML, CSS, Triggers, Behaviors i/regression This issue described a confirmed regression on a currently supported version p/0 Work that we can't release without partner/cat 😻 Client CAT Team platform/iOS 🍎 s/triaged Issue has been reviewed s/verified Verified / Reproducible Issue ready for Engineering Triage t/bug Something isn't working
Milestone

Comments

@RedZone908
Copy link

RedZone908 commented Apr 23, 2024

Description

In iOS, starting from Maui 8.0.10 and continuing in 8.0.14 and 8.0.20, when you scroll from one item in a CarouselView to the next item, and then go back to the previous item, that item will be blank. Items before the previous item will not be blank. Specifically the last item you were on before scrolling to some other item (in either direction) will end up blank when you return to it. When you loop through the end of the set, all items' content is properly restored.

carousel_issue_ios.mp4

This does not happen in 8.0.3 and 8.0.7, and in Android it doesn't happen in any 8.0.x version so far.

Steps to Reproduce

  1. Create a new MAUI app
  2. Set up some images in your Resources/Images folder
  3. Make a class with a string member for an image path, and make a list of that type on your view
  4. Make a carousel view bound to the list
  5. Debug the app
  6. Scroll to the second item in the carousel
  7. Scroll back to the first item and it will now be blank
  8. Scroll back to the second item and it will also be blank now

Link to public reproduction project repository

https://github.com/RedZone908/Maui8_0_20_iOS_CarouselViewIssueRepro/tree/main

Version with bug

8.0.10 SR3, 8.0.14 SR3.1, 8.0.20 SR4

Is this a regression from previous behavior?

Yes, this used to work in .NET MAUI

Last version that worked well

8.0.7 SR2

Affected platforms

iOS

Affected platform versions

iOS 17+ (maybe earlier)

Did you find any workaround?

No response

Relevant log output

No response

@RedZone908 RedZone908 added the t/bug Something isn't working label Apr 23, 2024
@PureWeen PureWeen added the potential-regression This issue described a possible regression on a currently supported version., verification pending label Apr 23, 2024
@RedZone908 RedZone908 changed the title iOS, Maui 8.0.10+ - CarouselView - Previous item content disappears after scrolling to next item [BUG][iOS] Maui 8.0.10+ - CarouselView - Previous item content disappears after scrolling to next item Apr 23, 2024
@PureWeen PureWeen added i/regression This issue described a confirmed regression on a currently supported version and removed potential-regression This issue described a possible regression on a currently supported version., verification pending labels Apr 23, 2024
@PureWeen PureWeen added this to the .NET 8 SR5 milestone Apr 23, 2024
@PureWeen PureWeen added platform/iOS 🍎 area-controls-collectionview CollectionView, CarouselView, IndicatorView labels Apr 23, 2024
@ninachen03 ninachen03 added s/verified Verified / Reproducible Issue ready for Engineering Triage s/triaged Issue has been reviewed labels Apr 24, 2024
@ninachen03
Copy link
Collaborator

Verified this issue with Visual Studio 17.10.0 Preview 4 (8.0.7 & 8.0.20).I can repro this issue

@mikeparker104 mikeparker104 added the partner/cat 😻 Client CAT Team label May 1, 2024
@BrandanN21
Copy link

I have noticed a small issue similar to this but on android, it only happens when I navigate backwards from a frame in the carousel view. Going from Frame 5 -> Frame 4 will cause portion of the carousel to render incorrectly. If I continue to swipe all the way back to frame 1 and go back to Frame 4 the view renders fine, again go to Frame 5 -> Frame 4 and I will see the issue again.

No issue when doing this on iOS.

@dfausz-ebsco
Copy link

Our MAUI app's main feature has a very prominent use of the CarouselView control and we ran into this issue in the process of converting our app from Xamarin to MAUI, so finding a solution or work around has been a high priority item for us.

I did some investigation and came up with one minimal example where the carousel worked perfectly. However, I then pulled down this repro repo and was able to replicate the issue. After comparing the two instances of the CarouselView I noticed that the example that worked did not use any data binding for the UI components while the repro example exclusively uses data binding for the image source.

This lead me to believe that it is specifically an issue with the BindingContext of the off-screen left item not getting set properly when the views are cycled. We were able to create a work around by overriding the OnBindingContextChanged method of the top level layout of the item template for our CarouselView, saving a cached instance of the previously set not-null model, and, within the same method if the BindingContext would be set to null, then instead set it to the cached model.

Also, I forked the repro example repo and added some text on top of the picture as a proof of concept.

Hope this helps!

Forked repo: https://github.com/dfausz-ebsco/Maui8_0_20_iOS_CarouselViewIssueRepro

Simulator Screen Recording - iPhone 15 Pro Max - 2024-05-03 at 18 16 36

@jsuarezruiz jsuarezruiz added the area-xaml XAML, CSS, Triggers, Behaviors label May 7, 2024
@rmarinho rmarinho self-assigned this May 7, 2024
@rmarinho rmarinho linked a pull request May 7, 2024 that will close this issue
@rmarinho
Copy link
Member

rmarinho commented May 7, 2024

Good catch @dfausz-ebsco seems it was with this change #14619

@PureWeen
Copy link
Member

Unfortunately, the proposed PR needs a bit more review so this isn't going to make it for SR5

@PureWeen PureWeen modified the milestones: .NET 8 SR5, .NET 8 SR6 May 10, 2024
@PureWeen PureWeen added the p/0 Work that we can't release without label May 24, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area-controls-collectionview CollectionView, CarouselView, IndicatorView area-xaml XAML, CSS, Triggers, Behaviors i/regression This issue described a confirmed regression on a currently supported version p/0 Work that we can't release without partner/cat 😻 Client CAT Team platform/iOS 🍎 s/triaged Issue has been reviewed s/verified Verified / Reproducible Issue ready for Engineering Triage t/bug Something isn't working
Projects
Status: In Progress
Development

Successfully merging a pull request may close this issue.

8 participants