How to make a gui object rise when clicked

Help and Feedback Scripting Support
#1

I am currently making a radio and when clicked I want it to rise onto the players screen and then when it is on the screen and clicked, go down again.

This is what I want to happen:

Closed (not clicked): Screenshot by Lightshot
Open (clicked): Screenshot by Lightshot (and then clicked again it will go down to closed again)

#2

Use TweenPosition to smoothly move the Image up and down. You will also need to make a bool variable to determine if it’s open or closed. Example, say this is in a localscript inside of that image

local image = script.Parent

local open = false

local closePos = --UDim2 of where the image should go when closed
local openPos = --UDim2 of where the image should go when opened

image.MouseButton1Click:Connect(function()
	local chosenPos = open and closePos or openPos
	image:TweenPosition(chosenPos, Enum.EasingDirection.InOut, Enum.EasingStyle.Linear, 0.5, true)
	open = not open
end)

Assuming it is an ImageButton of course

#3

You will need to set the UI Object’s UDim2 position, ideally with a Tween.

For example:

local TweenService = game:GetService("TweenService")

local RadioImageButton = MyScreenGui.RadioImageButton
local RadioUpTween = TweenService:Create(
    RadioImageButton,
    TweenInfo.new(0.5,Enum.EasingStyle.Linear,Enum.EasingDirection.InOut),
    {
        Position = UDim2.new(0.7,0,0,0)
    }
)
local RadioDownTween = TweenService:Create(
    RadioImageButton,
    TweenInfo.new(0.5,Enum.EasingStyle.Linear,Enum.EasingDirection.InOut),
    {
        Position = UDim2.new(0.9,0,0,0)
    }
)

Then you would simply call RadioUpTween:Play() and RadioDownTween:Play() whenever you wished to move it up or down.

#4

How do I find the UDim2? I’m not very good at scripting.

#5

Answered in the reply above! Just click on the link there. :slight_smile:

#6

Basically just move the RadioImage where you want, go into its properties and in the Position property, there are 4 numbers, those are the 4 values t o put into an UDim2. Say you want it go up at 0.5 on the Y scale and 0.2 on the X scale, just do

local openPos = UDim2.new(0.2,0,0.5,0)
#7

image
image719Ă—403 14 KB

#8

You need to replace ScreenGui with a reference to your actual screengui object. E.g. if the code is pasted in a LocalScript that’s parented to a screengui object, you would do script.Parent.

If you’re not sure about what a “reference to an object” is, this resource here might be of use to you : Learn Roblox

#9

Did you put it so that the Radio image starts off closed? If so, you could try this out

local image = script.Parent

local open = false

local pos = image.Position

local closePos = pos
local openPos = UDim2.new(pos.X.Scale,pos.X.Offset,pos.Y.Scale - 0.1, pos.Y.Offset)

image.MouseButton1Click:Connect(function()
	local chosenPos = open and closePos or openPos
	image:TweenPosition(chosenPos, Enum.EasingDirection.InOut, Enum.EasingDirection.Linear, 0.5, true)
	open = not open
end)

So it makes the closePos the original position of the radio and the openPos the position of the radio but with a decrease so it goes up as an example

Again, localscript inside of that radio ImageLabel, you will need to convert the ImageLabel to an ImageButton for this to work, there should be a plugin to easily convert that for you, such as

#10

its in a script where should i place it

#11

It depends on where your script is located and where your ScreenGui object is located. This tutorial here (Learn Roblox) is a good place to learn the basics of referencing objects in your game while also manipulating them, through code.

#12

That’s not working still, it’s an ImageButton and the script is a LocalScript inside the ImageButton, what have I done wrong?

#13

What’s happening when you press it?

1 Like
#14

Absolutely nothing

onlythirtycharacters

#15

@EmbatTheHybrid pls help, its not working

#16

Did you remember to put it in the Button itself? Are you getting any errors?

#17

It’s in the button, I get a black cursor saying it is clickable but nothing happens when I click it

#18

Is the output displaying any error?

#19

10:14:47.222 Linear is not a valid member of “Enum.EasingDirection” - Client - LocalScript:12

#20

My bad! Change it to this

local image = script.Parent

local open = false

local pos = image.Position

local closePos = pos
local openPos = UDim2.new(pos.X.Scale,pos.X.Offset,pos.Y.Scale - 0.1, pos.Y.Offset)

image.MouseButton1Click:Connect(function()
	local chosenPos = open and closePos or openPos
	image:TweenPosition(chosenPos, Enum.EasingDirection.InOut, Enum.EasingStyle.Linear, 0.5, true)
	open = not open
end)
1 Like