Based on specs: https://m3.material.io/components/carousel/overview
The simplest solution is possibly a SpotlightModel + a new MotionController derived from SpotlightSlider that has a sliding window mechanism:
windowSize = 3 or 4 based on design specs, but should be a constructor argleft, right indices are maintained to be windowSize apartleft, right indices are maintained to be pushed around by scrollX – i.e. if the scrollX value would go beyond the values stored in left or right, both of them move in that direction, maintaining their distance = this way the window can be "pushed around" automatically, but the active element can move around within the window bounds- ui element target picking is done in 2 phases:
- 1st phase:
windowSize elements are picked from the overall list, with the condition that their index is within left, right
- 2nd phase: each element in the window is compared against
activeIndex to pick the right TargetUiState (small, medium, large)
- all other elements transition towards a TargetUiState
hidden
Based on specs: https://m3.material.io/components/carousel/overview
The simplest solution is possibly a
SpotlightModel+ a newMotionControllerderived fromSpotlightSliderthat has a sliding window mechanism:windowSize= 3 or 4 based on design specs, but should be a constructor argleft,rightindices are maintained to bewindowSizeapartleft,rightindices are maintained to be pushed around byscrollX– i.e. if thescrollXvalue would go beyond the values stored inleftorright, both of them move in that direction, maintaining their distance = this way the window can be "pushed around" automatically, but the active element can move around within the window boundswindowSizeelements are picked from the overall list, with the condition that their index is withinleft,rightactiveIndexto pick the right TargetUiState (small,medium,large)hidden