Jump to content

[1.9.4] Creating Advanced GUI with ListBox


SKProCH

Recommended Posts

It is necessary to create a mod that brings the system of stores to the game. For him, you need to make a fairly advanced interface. I do not understand how to make a ListBox that can be scrolled, how to add slots to it to put objects on when direct on it their tooltip showed up.
This is a quick sketch of how it should look.
 

WVRIa2uH-dQ.jpg

How to implement this?

 
Link to comment
Share on other sites

It looks great.

You should create a main guiscreen first.

Second,display playes's data at the top hub.

Third,design a  class of the data which will display at gui as a "BuyingItemTab".

Fourth,create a GUIdrawing class to handle the "BuyingItemTab" and display it.

You can not creeate a gui like this directly.

 

Or you can find some useful code at the minecraft code about the MODLIST OF MAIN MENU

Link to comment
Share on other sites

Any reason you are using 1.9? You should update to the latest version. 

You can see how the game handles it's own lists at GuiScrollingList.

Alternatively the algorithm is basically the following:

You have a variable that represents your scrollbar position, in a range of [0-1] {scrollbar}.

You have a scrollbar area itself, that starts at {startY} and spans {Height}

When the scrollbar is clicked interpolate the mouse coordinates relative to {startY} and {startY + Height} to a range of [0-1]. That is your new scrollbar position.

When the mouse wheel is scrolled your scrollbar position changes by a certain value, I would use {entriesFittingIntoTheBox} / {entries}.size(), then clamped to a range of [0-1].

So that is how you determine the scrollbar position. Next you have a collection of entries {entries} that is all of entries you have.

You can get the range of entries that are currently displayed as [{entries}.size() * {scrollbar}, {entries}.size() * {scrollbar} + {entriesFittingIntoTheBox}]. Obviously clamped to a [0-{entries}.size()]. Additionally if range[1] - range[0] is less than {entries}.size() and less than {entriesFittingIntoTheBox} then range[0] becomes range[0] - ({entriesFittingIntoTheBox} - (range[1] - range[0])). Again, clamp to [0-{entries}.size()]. Now expand the range by 1 keeping it in the [0-{entries}.size()] range.

Now you can start drawing your stuff. Start iterating the collection in the range you've just calculated. The position of element 0 will be {baseY} + ({elementY} - {elementIndex} * {unifiedElementSize}) <- this is assuming all your elements are of a unified height. The position of all next elements becomes {offsetY} + {baseY} where {offsetY} is either kept as a variable and added to or calculated as ({elementIndex} - range[0]) * {unifiedElementSize}.

The rendering of elements is up to you, I'm just telling you where to render them.

Now comes the interesting part - the stencil test. Stencil test is opengl's way of discarding fragments that don't fit into a defined scope. The stencil is it's separate buffer and can be of any shape but you are only interested in the basic quad for now. You can look up how to setup stencil rect or ask here - I will be able to provide you with a sample if you need it.

  • Like 2
Link to comment
Share on other sites

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...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Announcements



×
×
  • Create New...

Important Information

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