Can I "flatten" a node tree before setting opacity?

[FHBlah]

Hello Axmolers,

I'm working on a HUD (see "heads up display for aircraft") for my Axmol app. The HUD is essentially a monochrome grid with dynamic text and symbols. It's composed of a parent Node and an assortment of Sprite and Label children. Ideally, the entire HUD should be one uniformly semitransparent surface in front of the rest of the app. It sounds easy but I've run into a snag. Mainly, if I cascade opacity, overlapping lines interfere with one another.

For instance, if there is a character over a grid line, the area of intersection is more opaque than the non-intersecting areas. I couldn't find a setting that solves this. I tried rendering the HUD to a RenderTexture and then applying transparency to the resulting sprite. This works but I would want to hide the original HUD and only show the final transparent one. The only way I could think of doing this would be to keep the original off screen. Unfortunately, RenderTexture can only capture what's on screen.

I feel like there should be an obvious answer for this but I'm not seeing it. Any help would be greatly appreciated. Thanks.

[rh101]

I tried rendering the HUD to a RenderTexture and then applying transparency to the resulting sprite. This works but I would want to hide the original HUD and only show the final transparent one.

That is one way to handle it.

The only way I could think of doing this would be to keep the original off screen. Unfortunately, RenderTexture can only capture what's on screen.

You can render anything to the RenderTexture, and what you render does not need to be part of the scene. One way that may work is if your HUD is part of the scene, but just not visible, then you can make it visible, render to the render texture, then turn visibility off again.

Alternatively, just don't put the root node of the HUD as part of the scene, but store a reference to it (as ax::RefPtr<>, or if not, make sure you call retain() on it), but it would mean you have to take care of calling onEnter()/onExit() on the root node, and calling update() if required for your HUD. You can then render that to the RenderTexture.

There may be other ways to do this too.

[aismann]

Look here for a code snippet:
Example for a very easy HUD #2430

[rh101]

The issue isn't about creating a HUD, but rather related to cascading opacity. The problem is when you draw objects on top of each other, and then have opacity set to cascade, any changes in the opacity end up showing through each node as it becomes more transparent.

For example, this is the actual output:

This is the expected output (which is correct, and uses the RenderTexture method):

[DelinWorks]

Have you tried playing around with BlendFunc? I'm fairly certain it will work, with some parameter tweaking you can make ui elements not copy the data of pixels behind them, but I don't know if you can selectively choose which pixels to leave out or which ones to copy since you said that your ui has some opacity so it would need to copy some world object colors, I think the best approach is your RenderTexture one but it doesn't hurt to try.

also you can make up your ui using multiple render textures if you need more control over which parts are opaque but I think that's complicated.

[DelinWorks]

Also take a look at this: https://www.youtube.com/watch?v=ZCfSpVfc3wA

I found it in godot engine a while back and if we can crack the method they're using then it would be a nice feature in axmol.
I also have the feeling that godot uses the same RenderTexture method, but abstracted into a CanvasGroup node somehow that does all the heavy lifting.

[FHBlah]

Thanks for your replies everyone.

RH101, your response to make the source HUD invisible except while it briefly renders to the texture was inspired (and completely obvious in retrospect). I tried it once I'd recovered from the facepalm. It works perfectly although it feels like my users are being subjected to subliminal HUD messages.

I also tried your suggestion of not adding the HUD's base node to the scene. In my scene, I overrode the onEnter(), onExit(), and update() functions. Discussion #2431 helped a lot. I then added scheduleUpdate() to the scene's init() function. After creating the HUD, I called the base node's retain() method instead of adding it to the scene with addChild(). Everything works and looks great except I'm not sure where to put the release() call. Everywhere I tried it results in a crash when the transition to the next scene ends. What's the best practice in this situation?

Thanks again, folks.

[rh101]

Everything works and looks great except I'm not sure where to put the release() call. Everywhere I tried it results in a crash when the transition to the next scene ends. What's the best practice in this situation?

It should be released when you no longer need it, and it should not cause a crash. You haven't specified what the cause of the crash is, so it's tough to suggest how to fix it.

The one thing to make sure of is that when you do release it, you also set it to nullptr, and any code that access that variable should check for the nullptr, in case it is released and other sections of code still try to access it. You can use the AX_SAFE_RELEASE_NULL macro, which will release and set to nullptr. Alternatively, declare the variable as a ax::RefPtr<NodeType> _varName;, which automatically handles the retain and release, so you do not call them yourself, and to clear it, simply set it to nullptr, such as _varName = nullptr.

[FHBlah]

False alarm. The crash wasn't due to the released node. It was because I was leaving the scene without calling unscheduleUpdate(). I think all the facepalming is killing brain cells. Thanks again for your time and patience.