ContextActionService changing the appearance of buttons when pressed

Help and Feedback Scripting Support
1

I’m attempting to make prettier ContextActionService buttons as the default ones are ugly and extremely small. To do so I returned the button properties and changed the image as well as some sizing options.

contextActionService:BindAction("Crouch", crouchModule.toggle, true, Enum.KeyCode.LeftShift)

contextActionService:SetPosition("Crouch", UDim2.new(0,0,.2))

contextActionService:SetTitle("Crouch", "Crouch")

local imgButton = contextActionService:GetButton("Crouch")

imgButton.Size = UDim2.new(.2,0,.2,0)

imgButton.Image = "rbxasset://textures/ui/Input/TouchControlsSheetV2.png"

imgButton.ImageColor3 = Color3.new()

imgButton.ImageRectSize = Vector2.new(144,144)

imgButton.ImageRectOffset = Vector2.new(1,1)

https://gyazo.com/21365855d0b0263a5150fbe81535f5ba

I have no code that changes the image when clicked but for some reason it does, I’m having a lot of issues with changing the appearance of these buttons if you know a good wiki page or post that would be extremely helpful.

2 Likes
2

ImageLabel.PressedImage

3

Looks like they’re trying to make it work with shift too. Like a pressed state that holds? Not sure if you can do that using PressedImage

4

There was nothing for the pressedimage value

5

That’s something you have to fill out on your own. That being said, after a brief look over your code and @BanTech’s post (which pointed out the binding), this isn’t a good property for you to use.

I’d suggest changing the image within the function itself. For example, you can do something like this to the function bound to your button:

local function boundFunction(actionName, userInputState)
    local button = ContextActionService:GetButton(actionName)
    if userInputState == Enum.UserInputState.Begin then
        button.Image = "press_img"
    else
        button.Image = "no_press_img"
    end

    -- Other code
end

Of course, if your function is coming from another script (such as a ModuleScript), ContextActionService will have to be defined as an upvalue or local variable so that the function can access it.

3 Likes
6

Little unclear on what this means, also because of the issue I decided to switch from ContextAction and just use GUI elements, is there any downside doing this?

7

It means creating a value either in the main scope or in the function itself. For example, say you have a module that contains the function you’re going to bind.

local module = {}

-- upvalue
local ContextActionService = game:GetService("ContextActionService")

function module.crouch(actionName, userInputState)
    -- local variable
    local ContextActionService = game:GetService("ContextActionService")
end

This way, your function determines the button image instead of the script that’s setting up the ContextActionService binding. It’d cover for touch taps on the button, clicks and bound inputs.

Nope. If that’s the implementation you want to roll with, that’s completely fine.

1 Like
8

I had some tests and the simple way I found it, could be like this:

ButtonImage:GetPropertyChangedSignal("Image"):Connect(function() 
	ButtonImage.Image = "rbxasset://0"
end)