Scripting Helpers is winding down operations and is now read-only. More info→
Ad
Log in to vote
0

How to make an image a Gui border?

Asked by 6 years ago

I asked this a few days ago but didn't get a good response, basically what I'm trying to do is create a Gui frame and have it's border a wooden decal. Would I have to make individual images for each corner/sides?

0
Place the decal behind the gui frame and make it slightly bigger so its only visible on the edges and looks like a border? Amiaa16 3227 — 6y
0
Yeah but that would overlap the frame ExtremeNyanCat123 32 — 6y

1 answer

Log in to vote
2
Answered by
Zafirua 1348 Badge of Merit Moderation Voter
6 years ago

Would I have to make individual images for each corner/sides?

No. Of course not.

Manipulating and using Z-Index

What is ZIndex?

ZIndex is a Graphic User Interface feature that allows the programmer to determine the order in which the Gui will be shown. The ZIndex takes in values from 1-10 with 10 being in the front and 1 being in the back.

How to implement ZIndex?

I am assuming you already have your image in the ScreenGui

  • Make your WoodenImage size bigger than the regular frame.
  • Place the regular frame anywhere you like. You can even put it inside the WoddenImage.
  • Click on the Gui and head over to its Properties
  • Scroll down till you see ZIndex

Now this is the actual part.

  • The WoodenImage is to have a ZIndex of 1
  • The OtherFrame is to have a ZIndex of 10

Explanation

What I am doing above is that I am setting the WoodenImage's ZIndex to 1 which will essentially place the Image all the way to the back whereas with the OtherFrame, I am setting it to 10 which will result in the OtherFrame becoming in front of the WoodenImage.

[Side-Note] Instead of using ZIndex itself, you can also however place the OtherFrame inside of the WoodenImage. However if that is not your goal, then ZIndex is the best option for you.

Should you have any questions, feel free to comment below.

Ad

Answer this question