-- Method to set the arrow position and rotation
function TutorialHandler:setArrow(position, rotation)
if self.arrowTween then
self.arrowTween:Cancel()
end
self.arrow.Position = position
self.arrow.Rotation = rotation
self.arrow.Visible = true
local upPosition, downPosition
if rotation == 180 then
upPosition = position - UDim2.new(0, 0, 0, 10)
downPosition = position + UDim2.new(0, 0, 0, 10)
elseif rotation == 90 then
upPosition = position - UDim2.new(0, 10, 0, 0)
downPosition = position + UDim2.new(0, 10, 0, 0)
end
local tweenInfo = TweenInfo.new(0.5, Enum.EasingStyle.Quad, Enum.EasingDirection.InOut, -1, true)
self.arrowTween = _L.Services.TweenService:Create(self.arrow, tweenInfo, {Position = downPosition})
self.arrowTween:Play()
end
So because it has UIAspectRatioConstraint (its a ImageLabel) it goes off the position where its supposed to be, its using Scale, no offset.
You shouldn’t have to use code to change the position of the arrow.
Here’s a quick demo:
In this example below, I set the Arrows Position to (0, 0, .5, 0) and It’s anchor point to (1, .75)
And it’s always in the same place.
If you wanted the lower button to be pointed at you would set the anchor point to .25. (In this example anyway.)
My previous example is wrong, here’s the correct example. Example.rbxm (9.0 KB)
Here’s the hierarchy.
and what it looks like (Regardless of size)
You want the arrow’s parent to be the same position and size as the target parent.
If you have a UIGridLayout like I do in my new example, then create a copy of the “Side” Frame and parent it to the same Frame, call it whatever.
Since you want the arrow to be in the middle of a button, what you want to do is set the anchor point to Vector2.new(1,0.5) and the position to be UDim2.new(1, 0, (Button.AbsolutePosition + Button.AbsoluteSize/2)/Button.Parent.AbsoluteSize, 0), Course that’s only if the arrow’s parent is a copy or the exact parent of the button.
How would I just make it stick to the same location regardless of what im pointing it to, thats what I want. I see you made two of the same frames thus it works, but in my case I can’t do that.
function TutorialHandler:setArrow(locationData)
if self.arrowTween then
self.arrowTween:Cancel()
end
local position = locationData.Position
local rotation = locationData.Rotation
self.arrow.Position = position
self.arrow.Rotation = rotation
self.arrow.Visible = true
Since I am setting the position via a saved Udim2 like this:
local arrowLocations = {
BuildMode = {
Position = UDim2.fromScale(0.137,-1.05),
Rotation = 180
},
end
Then run the calculation using the .Object property.
That way you can easily set up the arrow to go to UI objects instead of having to manually put in the position everytime.
-- Method to set the arrow position and rotation
function TutorialHandler:setArrow(button, locationData)
if self.arrowTween then
self.arrowTween:Cancel()
end
local rotation = locationData.Rotation
local ArrowPosition = UDim2.new( (button.AbsolutePosition.X - self.arrow.Parent.AbsolutePosition.X)/self.arrow.Parent.AbsoluteSize.X, -5, (button.AbsolutePosition.Y + button.AbsoluteSize.Y/2 - self.arrow.Parent.AbsolutePosition.Y)/self.arrow.Parent.AbsoluteSize.Y, 0)
self.arrow.Position = ArrowPosition
self.arrow.Rotation = rotation
self.arrow.Visible = true
local upPosition, downPosition
if rotation == 180 then
upPosition = self.arrow.Position - UDim2.new(0, 0, 0, 10)
downPosition = self.arrow.Position + UDim2.new(0, 0, 0, 10)
elseif rotation == 90 then
upPosition = self.arrow.Position - UDim2.new(0, 10, 0, 0)
downPosition = self.arrow.Position + UDim2.new(0, 10, 0, 0)
end
local tweenInfo = TweenInfo.new(0.5, Enum.EasingStyle.Quad, Enum.EasingDirection.InOut, -1, true)
self.arrowTween = _L.Services.TweenService:Create(self.arrow, tweenInfo, {Position = downPosition})
self.arrowTween:Play()
end
I believe it will be far more optimal to use the original code I provided before but apply some kind of formula to keep the same position relative to the screen
This should only be calculated once, before you use :setArrow() same with upPosition and downPosition.
And the reason why it might be slightly off is because I made the arrowposition calculation have -5 offset automatically.
Could I also see the code that calls this function?
:setArrow() is triggered just by mouse button clicks, removing the -5 offset is still very off, the formula is only being ran once, afterwards it just moves the arrow (animation) on a loop
Is self.arrow a frame or the image label that has a UIAspectRatioConstraint?
If it’s a frame, then that’s the reason. make self.arrow the image label.
