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

How do I make advanced Team Change GUIs for a group?

Asked by 6 years ago
Edited 6 years ago

Ok, so I know basic tween position and rotation, but I am wanting to make bigger and better GUIs on Roblox. I want something like the video Link below, where it slowly comes in, lifts a gray layer of the GUI, shows a Logo and Loads in the title, then slides away and lists teams an individual player can join, and it is different for each player. It also gets larger when you hover over certain parts of the GUI. I especially want to know how it lists each team in order and is different depending on what teams you are on, and the fact that they stay in order no matter what, and do not just stay in one position at all times. I also want to know how it makes a scroll bar if there are a lot of teams there. I know this is a lot to ask, but the wiki doesn't have very many examples on how to do an advanced GUI. If you know any part of the question please respond. The example link is here: youtu.be/f6xP4JgEJsk Thanks, Jhun.

0
A lot of the "more advanced" stuff is just creative ways to use the easy stuff and the usage of images / GIFs RockerCaleb1234 282 — 6y

1 answer

Log in to vote
0
Answered by 6 years ago
Edited 6 years ago

For the Gui you are looking at, you actually have most of the tools you need to make something like that. As rockerCaleb said, it's just creative stuff, but actually no gifs are needed!

THINGS FOR YOU TO LEARN: Rotation property of gui, Transparency Property, Visible property, mouse1buttondown event, input began and ended event, and while loops

Using these things, and tweening, you can recreate this! I will explain how they made this gui in FULL DETAIL (get ready).

So, he created a special "background" by stackingbiger and bigger frames behind eachother using z indexing.

He put all the boxes into one big frame, (mabye the biggest box in the back) and tweened it in.

Now, to do the gear coming in , he did this.

In the very gray part of the background,, ( the first frame, smallest one, one that covers most area on screen) he put a frame that was also the same color so it blends in ( i will call in cover frame). BEhind this frame, was the gear( an image). He simple tweened this frame down while reducing its height to slowly reveal the gear, like something behind a curtain appearing as the curtain moves away.

Now , the text and spinning. For the text, it was there all along in front of the cover frame, just invisible by it's transparency property being zero (also that wierd bar). He used a while loop to slowly increase its transparency, and tweened the bar's size to make it look like it is expanding horizontally. The gear was spun by using a while loop to slowly increase it's rotation property. The gear also was slowly faded by using a while loop to reduce its transparency.

For that light grey frame that falls down, he put a infinitely thin frame and the top, and tweend its size to come down. The frames z-index is higher than the gears, so that it covers the gear.

What i havent told you yet is that the team changing buttons (made of text buttons and images) were there all along, just that their visible property was false(their z inedex, is higher than the cover frames. Now, when the light grey frame comes down, he makes all the frames visible, then brings the grey frame back up along with the text.

The text buttons use mouse 1 down event to change the players teams once clicked, and uses the input began and ended events to enlarge the buttons when hovered on.

Now, i could continue on forever, but i think you got the point now

0
Thanks, I never knew about Z Indexing before. jhunlzeus4 20 — 6y
Ad

Answer this question