Jump to content
View in the app

A better way to browse. Learn more.

Forge Forums

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Featured Replies

Posted

Since this isn't a coding question I thought it would do better inGeneral:

 

Are there any "best practices" when designing a GUI?

 

I spent some time learning how to program a GUI but it looks bad. In other languages I've been spoiled with a "form designer" that lets you simply add the controls you need from a "toolbox" and then write the code underneath.

 

In Minecraft, I seem to have the most trouble positioning the controls on the screen. My GUI isn't really complex but it's got enough to be annoying:

 

  • 3 Input fields (text)
  • 3 Labels (next to each text box)
  • 1 Yes / No
  • 2 Buttons

When you design a GUI, what workflow do you use? Do you use something like Photoshop to draw a background with cutouts for each control? Do you "bake" the text onto a background (ie: text tool in Photoshop) rather than use font rendering in the game? Do you just render rectangles in Minecraft and skip the background completely?

 

I'm just gathering information as to what would be the easisest way to position the controls properly while leaving room for modifications in the future.

 

 

Thanks!

 

When I make a GUI I begin mostly by just copying one of the minecraft GUI's (for example dispenser.png).

After that I gray out everything that I don't need so that I have a nearly blank GUI.

Then I add everything that will later be static directly with the image editing program on the GUI.

Every other stuff I place somethere in the unused transparent area of the picture and place them later right with rectangles.

For finding out pixel coordinates and sizes for rectangles I use something like the measurement tools in photoshop.

Everything else I do in code.

 

An easy way to place things like the rectangles right in the GUI is this:

		this.drawTexturedModalRect(x, y, 7, 134, 54, 18);

	if (Keyboard.isKeyDown(Keyboard.KEY_UP)) {
		y--;
		System.out.println("y = " + y);
	}
	if (Keyboard.isKeyDown(Keyboard.KEY_DOWN)) {
		y++;
		System.out.println("y = " + y);
	}
	if (Keyboard.isKeyDown(Keyboard.KEY_LEFT)) {
		x--;
		System.out.println("x = " + x);
	}
	if (Keyboard.isKeyDown(Keyboard.KEY_RIGHT)) {
		x++;
		System.out.println("x = " + x);
	}

With this you can adjust everything ingame with the arrow keys and then read later the right coordinates out of the console.

 

I also prefer to make the text in code.

So you can easily change things dynamically for things such as the localization.

I didn't like the way how minecraft GUIs are written. Most people make GUI textures and align them with slots, buttons, etc. I decided to do it different way - I made it so Container's element positions are linked with GUI's element positions and I did textures only for slots. It resulted in fine minimalistic GUI which can be changed easier than original ones: hwi5ednxwp2tj4sfg.jpg

As you know, GUIs have borders; when you click with an item outside its borders, it is dropped into world. Those lines are GUI's borders. Textures are drawn per each slot.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Reply to this topic...

Important Information

By using this site, you agree to our Terms of Use.

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.