How Would I Make a TextButton That Shows an Image When Pressed?

[SIeepGoodTonight (SleepingDev)]

Hey Developers! I am trying to make a Gui where when you click the TextButton “Small Backpack” (for example) pops up an image. How would I go about doing this?

[lV0rd (Tin)]

local frame = --the menu
local button = script.Parent

button.Activated:Connect(function()
     frame.Visible = not frame.Visible
end)

[recleun (レクリユン)]

I’m assuming you want the image to appear on the right side of the frame. You’ll want to have the images for each button scaled and positioned to where you want them to appear. Then in a local script put the following code:

local button = script.Parent
local image = script.Parent.Image -- change this to where your image is

button.MouseButton1Click:Connect(function()
    image.Visible = true
end)

This script should be parented by each button, but keep in mind that there is no way to hide the images again, so it can be a bit weird. If you don’t want that to happen then you can do something like:

local button1 = script.Parent.button1 -- change to first button
local button2 = script.Parent.button2 -- change to second button

local currentImage = nil

button1.MouseButton1Click:Connect(function()
    if currentImage ~= button1.image then
        currentImage.Visible = false
    end
    button1.image.Visible = true -- make sure that the image is parented by the button
    currentImage = button1.Image
end)

button2.MouseButton1Click:Connect(function()
    if currentImage ~= button2.image then
        currentImage.Visible = false
    end
    button2.image.Visible = true -- make sure that the image is parented by the button
    currentImage = button2.Image
end)

You can have as many buttons as you want, just define the variable for the button and copy-paste the event.