[Windows] Fixed ItemSpacing doesn't work in Carousel View #30014
Conversation
|
Hey there @@SubhikshaSf4851! Thank you so much for your PR! Someone from the team will get assigned to your PR shortly and we'll get it reviewed. |
dotnet-policy-service
bot
added
the
partner/syncfusion
jsuarezruiz
added
platform/windows
area-controls-collectionview
|
/azp run MAUI-UITests-public |
|
Azure Pipelines successfully started running 1 pipeline(s). |
|
/azp run MAUI-UITests-public |
|
Azure Pipelines successfully started running 1 pipeline(s). |
There was a problem hiding this comment.
Pull Request Overview
This PR enables ItemSpacing for CarouselView on Windows by applying an ItemContainerStyle and adjusting item size calculations, and adds a UI test to verify the fix.
- Added a host app page and shared UI test for Issue 29772
- Updated
CarouselViewHandler.Windowsto set container padding and account forItemSpacingwhen measuring items
Reviewed Changes
Copilot reviewed 3 out of 6 changed files in this pull request and generated 3 comments.
| File | Description |
|---|---|
| src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue29772.cs | Added a UI test for ItemSpacing but gated to iOS/Catalyst only |
| src/Controls/tests/TestCases.HostApp/Issues/Issue29772.cs | Host app page with a CarouselView setup, binding, and automation ID for testing ItemSpacing |
| src/Controls/src/Core/Handlers/Items/CarouselViewHandler.Windows.cs | Applied ItemContainerStyle and updated GetItemWidth/GetItemHeight to subtract spacing |
| if (CarouselItemsLayout.Orientation == ItemsLayoutOrientation.Horizontal) | ||
| { | ||
| itemWidth = ListViewBase.ActualWidth - ItemsView.PeekAreaInsets.Left - ItemsView.PeekAreaInsets.Right; | ||
| if (ItemsView.PeekAreaInsets.Left > 0 || ItemsView.PeekAreaInsets.Right > 0) |
There was a problem hiding this comment.
ItemSpacing subtraction is gated on peek insets; spacing should be subtracted regardless of peek area to correctly space items.
| if (CarouselItemsLayout.Orientation == ItemsLayoutOrientation.Vertical) | ||
| { | ||
| itemHeight = ListViewBase.ActualHeight - ItemsView.PeekAreaInsets.Top - ItemsView.PeekAreaInsets.Bottom; | ||
| if (ItemsView.PeekAreaInsets.Left > 0 || ItemsView.PeekAreaInsets.Right > 0) |
There was a problem hiding this comment.
Vertical sizing logic checks Left/Right peek insets instead of Top/Bottom; it should use PeekAreaInsets.Top and PeekAreaInsets.Bottom for the vertical case.
| if (ItemsView.PeekAreaInsets.Left > 0 || ItemsView.PeekAreaInsets.Right > 0) | |
| if (ItemsView.PeekAreaInsets.Top > 0 || ItemsView.PeekAreaInsets.Bottom > 0) |
| @@ -0,0 +1,24 @@ | |||
| #if TEST_FAILS_ON_IOS && TEST_FAILS_ON_CATALYST // Open PR for iOS and Mac https://github.com/dotnet/maui/pull/27056 | |||
There was a problem hiding this comment.
The UI test is only enabled for iOS and Catalyst; it should also run on Windows to verify ItemSpacing for the Windows handler implementation.
2 participants
Note
Are you waiting for the changes in this PR to be merged?
It would be very helpful if you could test the resulting artifacts from this PR and let us know in a comment if this change resolves your issue. Thank you!
Root Cause:
CarouselView does not utilize the ItemSpacing property during layout styling
Description of Change
Added an item container style based on the horizontal or vertical orientation of the CarouselView, and applied a corresponding style to the ListViewBase
Issues Fixed
Fixes #29772
Tested the behaviour in the following platforms
Screenshot