My scrollingframe has rows in it and is sized to perfectly fit 2 rows. I want transitions between rows to be instant, without clipping, no animation, etc.
I can achieve this with UIPageLayout without using a scrollingframe, but I want to keep a functional scroll bar on the side which UIPageLayout does not have.
Ideally the scrollbar itself snaps to each row rather than a smooth drag from top to bottom. The scrolling needs to support mouse dragging as well as scrollwheel.
If I understand correctly, you want scrolling frames to scroll “row by row” and not “pixel by pixel” - I can think of a way to accomplish this
I would utilize RenderStepped in combination with a visual trick and 2 important properties of the scrolling frame
First, I would have a scrolling frame that is not visible - don’t turn the “Visible” property off, just make the color of it match the background or make it fully transparent. Make the scrolling frame stretch over where the real frame will be
For the real frame that will be visible, I would utilize just a regular frame with the ClipDescendants property on. Then put another frame inside of it which will have your list of rows parented to it. This frame will be what moves up and down visually. You could also have a fake scrollbar on the side which will just be one long frame representing the area that the bar (which will just be a smaller frame parented to it) can be positioned up and down on
Now for the code: use a RenderStepped function in combination with the CanvasPosition and AbsoluteCanvasSize properties. Let’s say you have 10 rows in this list you want to be able to scroll through. You can have it check the CanvasPosition.Y value every frame. You will want to go off of percentages - if the Y value is, say, 20% of the value of the AbsoluteCanvasSize’s Y value, you can have it set the position of the real list to UDim2.new(0, 0, .2, 0). If you don’t know how you would get the percentage, take the CanvasPosition.Y value and divide it by the AbsoluteCanvasSize.Y value then multiply it by 100. This gives you a percent from 0 to 100.
Essentially, you’re having your code constantly monitor the position of the canvas in the real but invisible scroll frame and then ONLY moving the visible frame up and down when the position crosses a 10% threshold. This will give the impression of a “snapping” scroll but you’ll still keep the reactiveness and cross-platform portability of the real scrolling frame’s scrollbar
If anyone knows some magical 10-liner code trick that is far simpler than this, please chime in, but this should 100% work