Is there any way to make a frame rotate around it’s anchor point? I have been searching for hours but I cant find anything that can help me
What have you tried so far? Also, what is the current anchor point of this frame?
I have tried making a frame the size of a single pixel inside of the frame i am trying to rotate, then subtracting it’s absolute position from the frame’s position, i have tried putting the frame inside of another frame and then rotating that frame, the second one worked, but it didn’t work in a way that i would be able to use with what im trying to do. the current anchor point is just 0,0
So you want it to rotate at the top left corner? Or do you want the frame to rotate wherever the anchor point is?
I want to rotate at the top left corner, i just thought anchor point would be better for explaining it
A little hacky, but you can create an invisible frame, make the size of UDim2.new(1, 0, 1, 0)
, make an anchor point of 0.5, 0.5, and position it at UDim2.new(0.5, 0, 0.5, 0)
. Finally make the frame you want rotated a child of the frame you just created, and place the top left corner of your frame at the anchor point (exact centre) of the frame that you just made. And for the rotation effect you desire, just rotate the transparent screen. Should work.
i have tried putting the frame inside of another frame and then rotating that frame, it worked, but it didn’t work in a way that i would be able to use with what im trying to do.
What are you using this for? What are you trying to attempt when trying to rotate the frame at it’s anchor point?
I am trying to make a combination of frames that (when clipping is added for rotated frames) will cover a face of a part, for a portal effect with a viewport frame
You can’t rotate anything around the Anchor Point without some kind of weird method that updates both rotation and position. The rotate property is intended to apply rotations centrally.
As for the solution to your question the answer involves just a little bit of trig. The process is as follows:
- Get the difference between the anchor point and the center as if the frame were unrotated
- Rotate this difference by the rotation amount
- Get the difference between the anchor point rotated and unrotated
- Add this difference to the position of the frame when you set its rotation
local anchorRotate = {};
anchorRotate.__index = anchorRotate;
function anchorRotate.new(frame)
local self = setmetatable({}, anchorRotate);
self.frame = frame;
self.absPosition = frame.AbsolutePosition;
return self;
end
function anchorRotate:Rotate(theta)
local size = self.frame.AbsoluteSize;
local topLeftCorner = self.absPosition - size*self.frame.AnchorPoint
local offset = size*self.frame.AnchorPoint;
local center = topLeftCorner + size/2
local nonRotatedAnchor = topLeftCorner + offset;
local cos, sin = math.cos(theta), math.sin(theta);
local v = nonRotatedAnchor - center;
local rv = Vector2.new(v.x*cos - v.y*sin, v.x*sin + v.y*cos);
local rotatedAnchor = center + rv;
local difference = nonRotatedAnchor - rotatedAnchor;
self.frame.Position = UDim2.new(0, nonRotatedAnchor.x + difference.x + offset.x, 0, nonRotatedAnchor.y + difference.y + offset.y);
self.frame.Rotation = math.deg(theta);
end
-- example
local frameRotation = anchorRotate.new(script.Parent);
local rotation = 0;
game:GetService("RunService").RenderStepped:Connect(function(dt)
rotation = rotation + 1;
frameRotation:Rotate(math.rad(rotation));
end)
Now all that being said… As you know (since you mentioned it yourself) rotated objects don’t work with clipping. Instead a more immediate method you could use is 2D triangle drawing. I detail the math out here if you are interested. The optimizations are further/better explained in the 3D triangle article in the same github project.
Hope that helped!