GUI *not* be resolution independent?

is DirectGUI at all able to (without too much modification) to do GUI which does not scale with the window, but remains a fixed size?
For video games sure, you mostly want resolution independent GUI elements bu for things like 3d editors where the window can be scaled up and down by up to 5 times the buttons and their fonts will either become huge or too tiny.

You can use base.pixel2d, which uses pixel coordinates (remember to scale up all your things by the desired pixel size). Because Panda uses a Z-up rather than a Y-down coordinate system, your Y coordinate has to be negative.

1 Like

Am I correct that any info about pixel2d is missing in the manual? https://docs.panda3d.org/1.10/python/programming/directgui/index

is pixel2d’s (0,0,0) position the top-left of the window?

It’s mentioned briefly under “Scene Graph Manipulations”, I believe.

(Which mention indeed confirms that the origin is at the top-left.)

Thanks.
I am a bit confused here. You may want your GUI element to be a specific pixel size, but you don’t always want their relative distance from each other to be a fixed pixel amount either. For example you may want some buttons on the left side of the window and some on the right side regardless of the window resolution. How does Panda approach such a situation?

Well, attaching things to the left- or right- hand sides can be done via special parent-nodes provided by Panda–although those inherit from aspect2d, not pixel2d, I think.

Looking at the documentation, it looks like we don’t have a good reference for these, alas, save for a brief mention on the page for DirectGUI. Lacking such reference, know simply that they follow the general pattern of “a2d<location>”, where “<location>” is something like “BottomRight” or “TopLeft”. I think that they’re amongst the variables provided by ShowBase, so you should at the least find a listing there.

As to doing similar with pixel2d, hmm… I suppose that you could set up a callback for the window being changed and adjust their positions in that. But perhaps there’s an easier way that I’m not aware of!

Yeah, DirectGui doesn’t really have a layout system built-in. (Use of those corner nodes doesn’t appeal to me personally, as widgets parented to one of them could still overlap those parented to another if the window gets scaled down too much.)

You might want to check out my own attempt at providing a layout system for DirectGui. It may not be perfect (getting custom graphics to work with it might prove problematic), but at least it seems to work well for the default frame styles.

1 Like

Thanks, originally I marked this topic as solved, but seems like it isn’t.
I can’t really think of a use case where you’d want gui elements or 2d sprites for a 2d game to be sized by pixels but the positions of GUI elements to not be in relative units instead, so I personally believe this solution is useless for any game, since I think there’s no game out there with only a single resolution support.

Corner nodes aren’t really enough in any case to solve this since you need center nodes as well, or really node for every pixel to overcome this limitations. A real solution would have (-1,1) or (0,1) float range square coordinate space for the positioning of the elements while allowing the GUI element size to be dependent on either fixed pixel res, DPI or scale according to window size.

Thanks for linking to your project. Unfortunately my GUI is already skinned.

Well, as I said, you can at least implement such a feature yourself: attach your GUI elements to pixel2d as suggested above, then set a callback for the “window-changed” event and in the callback-method position your UI elements relative to render2d (which uses coordinates in the (-1, 1) range on both axes).

That said… you mentioned a desire to use pixel-sizes so that GUI elements remain the same size at any resolution, if I’m not much mistaken. Thinking about it subsequently, I think that there’s an argument against that, whether for a game or a non-game UI: It means that the size of any text decreases as resolution increases, thus potentially reducing legibility.

Now, one could just keep the resolution at a suitably low setting–but that means that images don’t gain the sharpness conferred by a higher resolution.

I would argue that it might be preferable to keep text-size pretty much constant regardless of resolution, so that legibility remains similarly constant.

I mean, you can just take your web browser as an example, resize it and notice how buttons and texts remain constant. Every GUI program works this way.

I think you’re talking about DPI settings, so physically larger and higher resolution monitors can be set to have large enough text that is still readable at far enough viewing distance. I think GUI libraries take the OS DPI settings and just multiply it to the base text size for such monitors or just for people with worse eyesight than the average.

Okay, that’s fair; good points, those. :slight_smile:

Looks like I completely forgot about DPI though so thanks for mentioning it. A rewrite of DirectGUI, a new GUI library for Panda3D or a custom callback solution with DirectGUI should take that into account. Some old GoldSource engine games (Half-Life 1, Counter Strike 1.6) don’t seem to since the GUI is tiny to feel comfortable on a 4K monitor.

1 Like

I didn’t find a starting page about panda3d “callbacks”. Can you please link to some docs?
Thanks.

“Callbacks” are a general programming concept, I think, and thus I doubt that they’re explicitly covered in Panda’s manual. (Although I may be mistaken.)

The basic idea is that you provide to some piece of code (an instance of a class, for example) a reference to a method of your own making; when the code’s logic dictates that the method should be called, it does so.

So for example, when you accept a key-event in Panda, you pass in a reference to a method–something like this:

base.accept("space", self.myMethod)

In this case, you’re setting up a callback that is activated when the space-bar is pressed, and which calls the method of the “self”-object named “myMethod”.

So, similarly, you can accept an event that’s activated when the window is changed, and have it call some method that you specify.

(I think that the proper name for the event is “window-event”.)

Thanks and wow, is it weird that I’ve been programming on the side but even for commercial projects for 10 years and never knew this concept actually had a universal name and was called a “callback”?

That happens, I daresay! Sometimes we just somehow miss or don’t come into contact with some otherwise-common piece of jargon, I do think.

(If you’re interested in learning how the term is applied, I see that Wikipedia has an article on the subject: https://en.wikipedia.org/wiki/Callback_(computer_programming) )

1 Like