Hello developers!
Greetings. As most of you know, UICorner was added to Beta Features recently. Please read this post to know how to enjoy this cool beta feature! Make sure to enable it before you continue moving on with this tutorial!
And a simple note, a lot of people will find it too easy to upload in #resources:community-tutorial. I would like to tell them that, I made this post for beginners. If you know everything about it, this post is not for you. Because it’s recently released, a lot of devs are gonna need to know it.
I will update this post once it’s released for everyone. And since it’s in beta, there might be some bug as well.
What’s UICorner?
UICorner is a recently added UI Design Object which might help the UI Designers upgrade their UI’s look. Most of us probably knows about Roundify plugin which helped you roundify some UI Items. Now, using UICorner does the same, and it also allows you to round corner of anyside of an Frame / ImageLabel / ImageButton / TextLabel / TextButton / ViewportFrame. You can also make circles by using it, by just making the corner radius really high.
How to use?
At first, make sure to enable it from beta features, read this post to know how to enable it.
Now, insert a ScreenGui. Inside ScreenGui, insert a Frame / ImageLabel / ImageButton / TextLabel / TextButton / ViewportFrame (which you want to roundify) . I will be using an ImageLabel as an example.
Configure the item as you want. This is what image I’m using:
Now, we’ll start the actual tutorial!
Insert a UICorner as a children, the parent is the item, of which you want to make the corners rounded. Like this:
Now, open properties of UICorner. This should look like this:
After Inserting, the image/text will be automatically changed. The corner radius set to default is 0,8. And it should look like this:
We’ll be working with CornerRadius. What is Corner Raidus? It is the “sharpness” of a corner. The corner is usually a right angle as shown in the figure below.
As you can see, CornerRadius is set to 0,8. Here 0 is scale, and 8 is offset.
What is offset and scale? When two datasets have been taken of essentially the same experiment, but perhaps with a difference of scaling, this command tries to estimate the scale factor between the two data sets. This process is complicated by signal independent noise such as film fog for film data and electronic noise in many other detectors. Ir estimates a signal independent offset and scale factor between two images (one in the memory). For this to be possible there must be a range of intensity values in both images.
If you want to change CornerRadius a little bit, use offset. Change the value of offset. Like 0, 15. Changing scale makes it rounded a lot. The difference is show below.
When the offset is 0, and scale is 5. (0, 5) It will look like this:
And when the offset is 5, and scale is 0. (5, 0) It will look like this:
And if both is the same, “scale” wont make any difference.
To make circles, set scale to 10 and make sure the image/text size is square.
That’s all. Hopefully this tutorial helped you! Feel free to tell me if I said anything wrong, or if i missed anything. Or if you have any problem! Also show some things you created using UICorner in replies 
My discord: Techy#9999
Some cool things I made using UICorner
