UI grow and shrink depending on mouse Speed

You can write your topic however you want, but you need to answer these questions:

  1. What do you want to achieve?
    Basically I am trying to create a crosshair, which grows the faster your mouse is. Sort of like this.
    2023-12-06 23-54-26

  2. What is the issue?

I cannot figure out a way to overcome this obstacle, do you have any ideas? I would really appreciate some example as well!

This is my progress
image
image

  1. What solutions have you tried so far?
    As of now I’ve been ravaging throughout the internet, trying to find a solution. But haven’t found anything.

This is how I could calculate the speed of the mouse. (X pixels per 1/10th second)
“Found this in another dev forum”

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

local LastPosition = Vector2.new(0,0)

while wait(0.1) do
	
	print(math.floor((Vector2.new(Mouse.X, Mouse.Y) - LastPosition).Magnitude + 0.5))

	LastPosition = Vector2.new(Mouse.X, Mouse.Y)
end
1 Like

The speed itself can be used as distance, but maybe only use a fraction of it… there could also be more proper methods, but we don’t have much context, is this a first-person game or third-person over-the-shoulder style game?

--general idea 

imageDistance = mouseSpeed / 2 --play with this value.
NewBottomRightImagePosX = OriginalBottomRightImagePosX  + imageDistance
NewBottomRightImagePosY = OriginalBottomRightImagePosY  + imageDistance
--repeat for other images.
1 Like

You could use the AssemblyLinearVelocity of the character’s humanoidrootpart which returns the current vector3 direction the player is moving. Or you could use MoveDirection which is the vector3 direction that the player is TRYING TO MOVE IN.

For both properties you can write MoveDirection.Magnitude to return a value measures the value, essentially the hypotenuse of a pyramid

1 Like

Well I was thinking probably for third-person

Hey, I have a question… How would I go for the other ImageFrames? They are moving in the same direction.

(EDIT) I managed to achieve it by playing around with it for a while.

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

-- All image frames
local OriginalBottomRightImagePosX = script.Parent.BottomRight.Position.X.Scale
local OriginalBottomRightImagePosY = script.Parent.BottomRight.Position.Y.Scale


local OriginalBottomLeftImagePosX = script.Parent.BottomLeft.Position.X.Scale
local OriginalBottomLeftImagePosY = script.Parent.BottomLeft.Position.Y.Scale


local OriginalTopRightImagePosX = script.Parent.TopRight.Position.X.Scale
local OriginalTopRightImagePosY = script.Parent.TopRight.Position.Y.Scale


local OriginalTopLeftImagePosX = script.Parent.TopLeft.Position.X.Scale
local OriginalTopLeftImagePosY = script.Parent.TopLeft.Position.Y.Scale


local t = 0
local LastPosition = Vector2.new(0,0)



local currentCamera = workspace.CurrentCamera

local previousCFrame = currentCamera.CFrame




game:GetService("RunService").RenderStepped:Connect(function(dt)
	local cframe = currentCamera.CFrame

	local speed = (previousCFrame.Position - cframe.Position).Magnitude
	local _, rotation = (cframe * previousCFrame:Inverse()):ToAxisAngle()

	print(("Current movement speed of camera: %d"):format(speed))
	print(("Current rotation speed of camera: %d"):format(math.deg(rotation)))

	
	
	--t += dt
	--local oldPos = LastPosition
	--LastPosition = Vector2.new(Mouse.X, Mouse.Y)
	--local dist = (oldPos-LastPosition).Magnitude
	local mouseSpeed = math.deg(rotation)/15
		
	local imageDistance1 = mouseSpeed / 4 --play with this value.
	local imageDistance2 = mouseSpeed / -4 --play with this value.
	
	local NewBottomRightImagePosX = OriginalBottomRightImagePosX  + imageDistance1 -- Done
	local NewBottomRightImagePosY = OriginalBottomRightImagePosY  + imageDistance1 -- Done
	
	
	
	local NewBottomLeftImagePosX = OriginalBottomLeftImagePosX  + imageDistance1
	local NewBottomLeftImagePosY = OriginalBottomLeftImagePosY  + imageDistance1
	
	local NewTopRightImagePosX = OriginalTopRightImagePosX  + imageDistance1
	local NewTopRightImagePosY = OriginalTopRightImagePosY  + imageDistance1
	
	local NewTopLeftImagePosX = OriginalTopLeftImagePosX  + imageDistance2
	local NewTopLeftImagePosY = OriginalTopLeftImagePosY  + imageDistance2
	
	script.Parent.BottomRight:TweenPosition(UDim2.new(NewBottomRightImagePosX,0,NewBottomRightImagePosY,0),Enum.EasingDirection.Out,Enum.EasingStyle.Sine,0.1)
	script.Parent.TopLeft:TweenPosition(UDim2.new(NewTopLeftImagePosX,0,NewTopLeftImagePosY,0),Enum.EasingDirection.Out,Enum.EasingStyle.Sine,0.1)
	script.Parent.TopRight:TweenPosition(UDim2.new(NewTopRightImagePosX,0,-NewTopRightImagePosY,0),Enum.EasingDirection.Out,Enum.EasingStyle.Sine,0.1)
	script.Parent.BottomLeft:TweenPosition(UDim2.new(-NewBottomLeftImagePosX,0,NewBottomLeftImagePosY,0),Enum.EasingDirection.Out,Enum.EasingStyle.Sine,0.1)
	


	previousCFrame = cframe

end)

Might not be very effective, but this is my first prototype. I WILL improve this.

Hmm… I will give this a go. Thanks for the advice!

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.