[FREE PLUGIN] Dynamic ScrollingFrames - Curved and Looping ScrollingFrames

Help and Feedback Creations Feedback
, ,
1

PluginBanner
PluginBanner1500×750 278 KB

Get the plugin here

DynamicScrollingFrames lets you turn a normal ScrollingFrame into a curved, diagonal, or looping interface without building the system manually.

Select your ScrollingFrame, customize the effect in the plugin, preview it, and press Apply. The plugin prepares the hierarchy, scrolling properties, and runtime controller for you.

image
image314×716 21.7 KB

What can the plugin do?

Curve presets

Choose from several ready-to-use shapes:

  • Centered

  • Soft center

  • Diagonal

  • Reverse diagonal

  • Top bend

  • Bottom bend

The curve is calculated from each item’s position inside the visible viewport, so the effect updates continuously while you scroll.

image
image305×449 13.6 KB

Full geometry control

You can adjust:

  • Curve strength

  • Base offset

  • Curve start and end

  • Main UIListLayout padding

  • Curve direction and alignment

  • Vertical or horizontal scrolling

All numeric controls support dragging, direct value input, and holdable + / - buttons.

Scale and padding modes

DynamicScrollingFrames includes two animation methods:

  • Scale grows an invisible CurveSpacer on the cross-axis.

  • Padding changes the generated item’s UIListLayout.Padding.

Scale mode also includes a Show spacers option, making it easy to see how the generated boxes push the real content into a curve.

Smooth infinite looping

Infinite loop mode continuously wraps your real UI items after they move fully offscreen.

It does not require an item table, replacement tabs, or cloned content. Your existing UI instances and button connections remain intact. Looping supports both vertical and horizontal ScrollingFrames.

For a seamless result, the complete item cycle needs to be longer than the visible viewport.

Loop

Studio previews

Use Live preview to inspect the curve while editing.

The Run scroll preview button moves the canvas from start to end once,

letting you check the full effect again whenever you press it.

Automatic setup

When you apply the effect, the plugin automatically configures:

  • ScrollingDirection

  • AutomaticCanvasSize

  • The main UIListLayout

  • Main layout padding

  • ScrollBarThickness

  • Generated item wrappers

  • Runtime attributes and controller

The original items are kept inside wrappers as ActualContent.

Quick setup

Create a ScrollingFrame with a direct UIListLayout, then place every itemdirectly inside it:


ScrollingFrame

|-- UIListLayout

|-- Item1

|-- Item2

`-- Item3

image
image237×144 3.03 KB

Select the ScrollingFrame, open DynamicScrollingFrames, choose your settings, and press Apply. Enter Play mode to test the final runtime animation.

After applying, each item uses this generated structure:


DynamicItem_Item1

|-- CurveItemLayout

|-- CurveSpacer

`-- ActualContent

Updating and restoring

Select an already configured ScrollingFrame to load its current values. Change the settings and press Update curve to apply them again.

Press Restore to remove the generated structure and return the original UI items, layout settings, canvas properties, and hierarchy.

Important notes

  • The ScrollingFrame must contain a direct UIListLayout.

  • Direct UI items must be GuiObject instances.

  • UIGridLayout is not supported.

  • Applying the plugin changes direct hierarchy paths because each item becomes

ActualContent inside a generated wrapper.

  • Infinite looping stays inactive when there is not enough content to loop without showing the same real item twice.

  • Do not place UIAspectRatioConstraint inside of the ScrollingFrames or it will break

Feedback

DynamicScrollingFrames is free, and I plan to continue improving it based on real UI workflows.

For suggestions, questions, or bug reports, contact me.

Special credits to @Duciio for giving me the idea of this plugin.

23 Likes