Monarch common HUD for different collectionfactory

[Vishal_P]

Hello Everyone!

I have recently come across Monarch library for screen manager with popup and transition support.
that seems interesting and easy to implement,
However, for the requirement I have, I need different screens (not actually nested) that can be accessed from common tabs,

and that common tabs will be shared across each screen as HUD. but won’t be a full screen.
also from some of the tab screens, I need to push a totally new screen into the screen stack, for example, the settings screen that will be a completely different screen open from one of the tab screens.

I am looking into ways where I can add HUD but that will not be as a separate screen, in fact, it will be part of every screen,
what should be the better structure to be followed with Monarch for the same?

[totebo]

Monarch supports persistent screens, which sounds like what you’re after. When showing a screen you set no_stack = true as an option to always leave it visible. Then you can control that screen with messages and by using monarch.hide() and monarch.show().

Another option is to use a GUI template that’s re-used in more than one scene. When I choose this option I tend to also have a companion Lua module, to avoid duplicate code.

[Vishal_P]

I have gone through the GUI template document but I don’t want HUD to be part of every screen,
as I want the screens under hud to appear with transitions.fade_in but don’t want hud to fade in-out on every time sub-screens under hud is changed.

so adding monarch.show(hash("hud"), {no_stack = true}) is a good option.
however, when I add hud right after the screen is added as:

monarch.show(hash("screen1"), {clear = true })
monarch.show(hash("hud"), {no_stack = true})

The problem is The hud screen is waiting for screen1 to fade in first and then hud is shown.

I also tried:
monarch.show(hash("screen1"), {clear = true, sequential = false })
but with sequential = false also its waiting for screen1 to appear before showing hud.

[britzl]

@Vishal_P

I am looking into ways where I can add HUD but that will not be as a separate screen, in fact, it will be part of every screen,
what should be the better structure to be followed with Monarch for the same?

@Vishal_P

I don’t want HUD to be part of every screen,
as I want the screens under hud to appear with transitions.fade_in but don’t want hud to fade in-out on every time sub-screens under hud is changed.

Do you really need to use Monarch for the HUD? Couldn’t you handle the HUD separately?

[Vishal_P]

As I am using monarch for other menus, I thought I can use the same for HUD also, as I can have the same behaviour and transition,
but as suggested I am checking on Template also, with the current code I am using a Gui already in main.collection, but I am not sure how can I load the template dynamically and add it on top of all other screens, where can I find more information on this? and what will be the best approach for this?

[britzl]

@Vishal_P

I am checking on Template also, with the current code I am using a Gui already in main.collection, but I am not sure how can I load the template dynamically and add it on top of all other screens, where can I find more information on this? and what will be the best approach for this?

I’d probably put the HUD in a gui scene in a separate collection and add that collection to all screens that require it. Or load it through a single collection proxy.

[Vishal_P]

Hello @britzl,

for adding hud collection to all the screens, the issue is, it will create a different instance for every screen,
however, for HUD I need some animations which will show which screen is active, once I tab on the hud button it will smoothly animate the button background to the currently active screen button, which will not be possible with a different HUD for every screen, it will show jerk as I think every hud instance will be different.

I tried adding the Gui component, but I am facing a layering issue with HUD going below screens. with single collection proxy also, is there any way to add a component on other active screens?

[britzl]

@Vishal_P

for adding hud collection to all the screens, the issue is, it will create a different instance for every screen,

True. So what if you have it as a single collection proxy. That way you will only have a single instance. It’s like a Monarch screen although not loaded through Monarch.

[Vishal_P]

Hello @britzl

as suggested I tried collection proxy for HUD, but I am facing an issue with UI layering. my HUD screen is going behind other Monarch screens,
I have a splash screen and main menu before the level screen where HUD is required.
and HUD proxy is loaded in the main menu screen but HUD is rendered behind all other screens,
How can change a render order for the same?
Please refer attached image for reference.

[totebo]

The render order of each .gui scene can be set with gui.set_render_order().

API reference (gui)

[Vishal_P]

Thanks,
with gui.set_render_order(). hud is visible, however Its not taking any input,

I have loaded hud collection proxy from the controller. script and also acquired input focus in controller script and hud init
but hud.gui_script not receiving any event for input.

do I need a different loader.script for loading collection proxy as shown in the example,
is it not possible to load proxy from controller script or any other gui_script?
Please refer

[britzl]

@Vishal_P

is it not possible to load proxy from controller script or any other gui_script?

It should work.

@Vishal_P

I have loaded hud collection proxy from the controller. script and also acquired input focus in controller script and hud init
but hud.gui_script not receiving any event for input.

Well, something is breaking your input stack. You need to make sure you have acquired input from the root/ bootstrap collection through all collection proxies.

[Vishal_P]

@britzl

input stack.

Thanks, added acquire_input_focus for gameobject. that fix it.