Hovering TextButton, Or Image Label Cursor Solution - Tutorial

Resources Community Tutorials
#1

Hello developers!, i wanted to make a tutorial on how to fix the problem that when you change the mouse Icon using:

mouse.Icon = "rbxassetid//:00000000"

when you hover over a gui button our mouse icon that we stated above changes instantly to default, i have a simple solution to keep this clear and minimal:

First things first we use our chosen cursor and then we just add it with custom size and aswelll as an image label

Second step would be add a local script into the cursor that we have prior to this step as an imagelabel

Third Step

we move on writing some code! Exciting right?

-- state the runservice variable to start the code
local runservice = game:GetService("RunService")

then we add other variable that gets the player mouse so we can disable the default thing

local mouse = game.players.localplayer:GetMouse()

okay so 2 lines of code are going to be crucial with the next line

game:GetService("UserInputService").MouseIconEnabled = false

excellent!, these 3 lines of code will make future on our thing so lets just move ahead and add a simple function to change the mouse and get the mouse position andd replacing the disabled thing with our imagelabel (the imagelabel always has to be visible tho).

runservice.RenderStepped:Connect(function()
      script.parent.position = UDim2.new(0,mouse.X,0,mouse.Y)
end)

now having our entire thing it would be something like this:

local RunService = game:GetService("RunService")
local mouse = game.Players.LocalPlayer:GetMouse()

 game:GetService("UserInputService").MouseIconEnabled = false

RunService.RenderStepped:Connect(function()
  script.Parent.Position = UDim2.new(0,mouse.X,0,mouse.Y)
end)

Remember that the hierarchy of the stuff should be something like:
image

Alright, i hope this tutorial worked for most of you guys, any problem or stuff make sure to hit my dms and i will be up to helping you guys!, see ya!, if you guys want more tutorials and stuff ill make sure to add them for this epic community!!, Cheers!!

  • Karmak/Programmer
7 Likes
Removing the defalut "ArrowCursor" when hovering over a button
#2

this is a life saver for me since I am coding something similar to this, very helpful resource thank you!

also by the way what does MouseIconEnabled do?

1 Like
#3

It makes the main mouse invisible.

#4

Just so you know, UserInputService has a single event which can handle all of this:

local UserInputService = game:GetService("UserInputService")
local Cursor = script.Parent

-- Remove the cursor icon
UserInputService.MouseIconEnabled = false

-- Listen for user input changes
UserInputService.InputChanged:Connect(function(input)
    -- Determine if user input is mouse movement
    if input.UserInputType == Enum.UserInputType.MouseMovement then
        -- Get the current position of the cursor
        local position = input.Position

        -- Translate the cursor position into a UDim2 for the cursor image
        Cursor.Position = UDim2.fromOffset(position.X, position.Y)
    end
end)
2 Likes
#5

i wanted to keep it more short but to the point thanks eitherway

#6

no problem!, im glad it helped you on your game or project development :), cheers!

1 Like
#7

How do I fix the position of the cursor?

I know this was made very long ago but I cannot find anything to fix this… :frowning:

image

image

Script I used:

local mouse = game.Players.LocalPlayer:GetMouse()

-- game:GetService("UserInputService").MouseIconEnabled = false

RunService.RenderStepped:Connect(function()
	script.Parent.Parent.Cursor.Position = UDim2.new(0,mouse.X,0,mouse.Y)
end)
#8

anchor point, set the anchor point

#9

ive already tried setting the anchor point… Maybe im just setting it to the wrong point but i set it to
(0.5, 0.5) but all it does is set it above, could you be more specific since i cant put anchor point in the negatives

image

image

#10

turn on ignore screen insets

#11

like on the screen gui? all the insets are turned off

image
image

#12

turn it off

#13

i guess that works i just tried adding the imageLabel to one with other things, i’ll just need to find the perfect one

#14

center the point of the fake cursor to the exact center of the image label

#15

looks nearly perfect but i’ll try more, thanks btw (0.39, 0.39) or (0.4, 0.4) if you were wondering

image