Lose panel focus when clicking outside

[ustk]

@Christoph-Hart Would it be possible to make the panel to react to mouse click outside of it in order to lose the focus like a label does?

Currently I'm using a broadcaster, but making every single component to call the bc might not be the better solution if it can be implemented as default panel behaviour in the first place.

[VorosMusic]

@ustk
Maybe inverting the idea?
Tracking a mouse-click and if it's not in a certain area (panel) it's outside?
Would probably reduce the amount of components.

And yeah, I agree, might be a nice feature to have.

[ustk]

@VorosMusic I don't think a broadcaster can react to a click in the void, and there's currently no mouse event outside of a panel (but I guess this is how a label works)

[Christoph Hart]

@ustk the entire focus system in JUCE is a bit weird, so I would have to overwrite the focusLost callback in the panel and make it call the mouse event callback with some parameters.

What‘s the use case? Maybe there‘s a better option.

[ustk]

@Christoph-Hart I see... I have a couple scenario where I use panels to create a label, especially in a child panel context where you can't use a traditional label, and in some cases where you want a label that reacts differently.

I don't mind using a broadcaster when the UI has a moderate amount of components, although I'm not sure it is clever when there are a lot of them. But I'm might be wrong here, I have no idea if a broadcaster can be CPU greedy in such scenario...

I also thought of another solution but this doesn't work fo child panels. Make a transparent panel underneath all the "panel labels" and simply use a mouseCB over it that makes all panels losing focus and hides that frankestein, kind of a broadcaster for the poor...

Losing the focus when clicking outside would definitely be simpler to use, but probably not for you to implement...

[ustk]

@Christoph-Hart What is strange is that it already loses the focus when you click in the code editor for instance or another window (but get it back when you click the interface window again). Couldn't this be transposed to the interface itself?

[d.healey]

What about the ability to add other components to child panels. Would that be a possibility and would it solve the problem?

[ustk]

@d-healey Yeah this has been asked a while ago, but not sure it can be done... And this would only solve the child panel scenario, not the custom label behaviour

[Christoph Hart]

What about the ability to add other components to child panels.

No that would be catastrophic :)

I'll check if I can implement a mouse callback for focus losses, but it's very likely that this messes with existing projects that don't expect such a mouse callback so I need to be super defensive here.

[ustk]

@Christoph-Hart Wait! I've just discovered something interesting... the focus is never lost when clicking outside, except if clicked on any panel! Meaning you can show a panel that overlays the whole interface and the focus will be lost instantly when clicking on it, no need for a mouse CB... strange but effective. The only drawback is that it also loses focus when clicking the panel label itself since it is overlayed (but I can think a workaround)

[Christoph Hart]

@ustk yes the focus only changes when you click on a component that wants the focus itself and the root component of the interface (or a bg image) doesn't want the focus. As I said, it's a bit weird and inconsistent (and especially painful to debug because when you click on a breakpoint in the IDE to inspect the behaviour, the app loses the focus and directly hits the breakpoint).

So whatever hack works, go for it!

[ustk]

@Christoph-Hart Yeah my hack works.
Effectively it is weird because the panel I click is just a stock panel with no behaviour whatsoever, so it shouldn't ask for a focus swap.
Although when you click a slider it obviously needs a focus, but doesn't make the focused panel to lose it... Strange... <- I don't know how I've seen this...

so just overlaying a panel does it perfectly :thumbs_up:

[d.healey]

@ustk Could you post a snippet that shows the hack? I don't need it (at least at the moment) but it might be useful for future Dave, and other users.

[ustk]

@d-healey yep it is very straight forward finally...

const var focusPnl = Content.getComponent("focusPnl");
const var overlayPnl = Content.getComponent("overlayPnl");
overlayPnl.showControl(false);


focusPnl.setPaintRoutine(function(g)
{
	g.fillAll(Colours.black);
	g.setColour(Colours.antiquewhite);
	g.drawAlignedText(this.data.hasFocus ? "HAS FOCUS" : "NOT FOCUSED", this.getLocalBounds(0.0), "centred");
});


focusPnl.setKeyPressCallback(function(ev)
{
	if (ev.isFocusChange)
	{
		this.data.hasFocus = ev.hasFocus;
		
		// in definitive we just need to toggle the overlay, since the focus loss is made internally...
		overlayPnl.showControl(ev.hasFocus);
		
		this.repaint();
	}
});

HiseSnippet 1012.3ocsV0taaaCEkxNJn1qYXEnO.D9Wx.YF1cccCannNwerYzlDipzh9uBZIJKhPQ5QR4Tug79s2g8Rr2fsKkrrjWb75LvDLLz8ii3gWcuGpoJY.UqkJjSiqWsfhbdrq+JgIdPLgIPSFhb9R2KHZCUgycc9pEDslFhbbp+SVGNMNBkc8mu5bBmHBnktPn2KYAz2vRXlRuS6+ZFmOlDRulkTI6m2eRfTLPxko.ep61EsfDbCYN8RhMsZtHmiGExLRkugXnZjyQmKCW4GKuUjm+6YZ1LN0ZzC4COnb2ik7PKisdQChY7voE6aMBdJSKqB0yqBO08BVHai+xpwWkE.WhnZ8vo11zq9Vzq2CQucPImJT5nbJ8DW+.EagoLhkOeg6DA7xIh.k8pTIOWTs+nl6.IjgvzIgbCcrBL1fv6Ec6dJF9q8O1rIT50F7RhBGICR0SEb7KwEXmSMCjIKjBvvqUQBs.bkvjKoJNY09.VlhEZoUGMTjrPTRtWDgqoVF0rXc5nolova.yakoFlf5EkJBLLovad6l+VyFy6DAMTmw4d4MO5Ny3PmC7LfPZKCrd2DjHLreIkdaLyPyyITQt8LNatfFdM8SFOSLS2IjXHchI5wVVfeEt0OelOd7UCdmeK7Ofac4UWmaMZXqSwYHfM6ajAD94xTQn1qamtsOE2J.15JZncGe281VultZpBdcNfv4y.NWt0nKy1arHLbaGVNMfFQwbZ6lMfHM1AKeIFxsvB1ZMfeOPYtRhsWmY1CTQWXK0dVm2YYbAivRwkRC8JgWFwZdWS7+LTTzNisdI4T0NCaUAT6CnmHMYFUcJzlwSoaRDFM1dd63Ou4sf7dyJIJESDLyUKnqs2ufAZcyMb26lLDp+1A109f7VPUFlkNNCoKA0u7w2FtCo5aLxEfP1lIBfxlrnmTLbSDTNhAKcS2h1DzmJkHY8Wswnur+srPSLxw042A6XJadrwZEhxH4lE4jGZQdraYyQ0kAgVU0Xyx7gZUWFq0r4E50MNtHcXrJYedeVU2FXd69IOSpBoJe1ut0gI4deKIjkpq5eYw6Ym5n6KbBR1xvTNwrsNt8vq0AflssDOsBjBMyrp5ga+GD26tWw8OWJ9D2oLSP7t4XscvQnM7+CNt9HwSbGEEQCLkD7H2we3PO+6eY4yE5meAwnXPeo6koI9PKR.0J.BcuZa+WMaWdtcWqssB3SEgYF+EbsNXOqsy5f8JBhRHAJ4GCxkXrG59nLO.mDYeuQC3Ce.abOTlrCfyETzQIv4+eLHvt8+ZPcX2Xd1Af4aN.LO+.v7sG.lWb.X9tC.y2uWL1O85rTiLIeb.bLcTl9qiyHAA5rx5BQ+Mpcs8rA

So as soon as you click the overlay panel, any other panel will lose the focus...
You just have to toggle the overlay and bam!
If you don't want the focus to be lost when clicking the keypress panel, just use 4 overlay panels that you dynamically place around it instead of using only one that covers the whole interface...