How to make scrolling frame force items to be at the bottom

Working on a custom chat system, the problem is, when I add new chats to a scrolling frame, they appear above the limits of the scrolling frame. I want the scroll bar to be at the bottom and allow the user to scroll up to see past messages (right now it’s forced to the top, in the image it cant go any higher).

Right now, the size of the scroll frame changes, but it will just create the space below the text so there is more space the scroll down

What do I do? Sorta scripting support & UI support


1 Like

If you’re using a UIListLayout you can adjust the canvas position to move to the bottom with this formula:

--Adjust UIListLayout and ScrollingFrame to link to the right instances
local CanvasPositionY = UIListLayout.AbsoluteContentSize.Y - ScrollingFrame.AbsoluteSize.Y
local CanvasPositionVector =, CanvasPositionY)

--Set the scrolling frames CanvasPosition to the calculated vector here 

You can create a function for this and connect it to a property changed signal listening for a change in the UIListLayouts AbsoluteContentSize property if you want the scrolling frame to move to the bottom automatically.

1 Like

You may want to play and experiment with ScroolingFrame.CanvasPosition property.

Tried this but it just pushes the position down but the problem still persists

Here in this video, you can see the chats go up, above the limits of the scrolling frame. They appear when I turn ClipDescendants off. I want them to fill the space below


This might be a problem with how your CanvasSize property is set up then. If you enable automatic canvas size scaling on the Y axis the CanvasSize defines the minimum size of the canvas. If you don’t want a minimum size you can set the CanvasSize on the Y axis to 0, which should fix your problem. Also to fix the issue you have with stuff going outside your scrolling frames bounds make sure the ClipsDescendants property is set to true.

1 Like

Well yes clip descendants will just hide the messages, but I want them to occupy the space of the expanded scrolling frame. I want it to automatically change size with the new messages, but the problem is they arent going where they are meant to be. How can I get the messages to display in the below empty space, rather the top of the scrolling frame. Just like the roblox chat system

Are you using the AutomaticCanvasSize property or AutomaticSize? Scrolling frames wont work properly if you use AutomaticSize. Aside from that double check that your UIListLayouts FillDirection is also set up correctly.

1 Like

AutomaticCanvasSize. FillDirection is vertical