For practice, I’ve decided to try doing some basic GUI Script, having no knowledge at all on how to deal with GUI. Quite simple concept;
Pressing “M” would open up four icons (TextButtons) on the lower-right, and clicking each of them would open a different Frame on the screen center.
To go easier on me, I’ve broken down that concept into more, but simpler steps;
- Position all the GUI elements (a Frame with four TextButtons within it)
- Hide the GUI elements
- Condition to make the Frame visible again (UserInputService)
- Turn the Frame’s “Visible” property “true” if the previous conditions are met (and of course, turning it “false” if Visible was “true” in the first place)
Doing that was rather easy, even though there’s definitely a better way of achieving it that I don’t know of. Well, after succeeding with the first part of the “simple GUI concept”, all that was left was opening a different panel for every TextButton clicked.
Of course, with me being a beginner that had never touched GUI, my first line of though was hard-coding my way through that. If “Button One” is clicked on, open up “Panel One”, if “Button Two” is clicked on, open up “Panel Two” and so on. Now, that sounds absurdly impractical; what if there were one hundred icons? I wouldn’t enjoy manually programming each icon to do the same thing.
My first though on a better approach was making a table containing all the four TextButtons within that Frame (even though I’m not sure myself on how to do that) and using an
in pairs loop in which for “Button One”, if clicked on, would open up “Panel One”, and so on until “Button Four”, though with my limited knowledge of
in pairs loops, which I have never actually used, I wouldn’t be able to, for example, open the first Panel, then straight up open the Fourth without opening either the Second nor Third. I’d be forced to open them in order, which if it were to be used for any menu, wouldn’t really be practical.
So, how am I supposed to approach that sort of GUI hierarchy? How am I supposed to make a GUI element only be accessible from having first selected another element?
Some examples of what I’m trying to achieve (though, obviously, with no polishing as it is entirely for practice);
Grand Piece Online
World // Zero