Toggle control expand flag directly via top bar

[RedMser]

Fixes #81726

• Change the label from "Align with Expand" to just "Expand".
• Turns "Expand" checkbox to a check buton, to make UX clearer.
• Opening the container sizing popup loads the current value for the "Expand" check button, based on user's selection.
• Clicking on the check button immediately toggles the flag for the selected controls.
• Fix (unreported) bug that redo does nothing when changing shrink flags.

[RedMser]

CC @YuriSizov since you created #63358 which this PR expands (hah) upon.

[YuriSizov]

The current system was made this way on purpose, so I'm not sure if this is a good change. No other button in this or anchors' popup behaves like that and updates to match the state of the selected nodes.

[RedMser]

I tried working with the current system (I'm working mainly on applications, so very UI-heavy stuff). The new top bar felt very cumbersome to use without my change in place.

While from a programming standpoint I totally understand why it was created this way, for actual users creating UIs I don't think this is a good design. Users like to get instant feedback on their changes, see what each option does and how it affects the layout.

An alternative that does not involve updating based on selection state would be to have a "Toggle Expand" button, which does not show the state, but only requires a single click to toggle the flag instead of two.

If you want, I can open a proposal for this change first and get some more opinions in.

[YuriSizov]

@RedMser Yes, those are the options that we have, and the same ones I had to consider before arriving to the current state. I also work primarily with UI in Godot and understand the workflows. But none of these options are good in my opinion, including the current state. I just found it to be more consistent than others, but ultimately I don't like any of them.

So I'm all for a better option, I'm just not sure that this is better (because it's inconsistent with the rest).

Edit: And to be clear, if this is otherwise approved, I'm not going to die on that hill. 🙃 If this feels better, then it's better.

[RedMser]

To address the issue of consistency, it might help to make the presets/size flags buttons also reflect the selected nodes' current values (by making them toggle buttons, part of a button group)?

And in case of differing values between selected nodes, or when one isn't using a preset, none of the options would be highlighted.

And to be clear, if this is otherwise approved, I'm not going to die on that hill. 🙃 If this feels better, then it's better.

I'll gladly help working towards a solution everyone's happy with! So far, every change to the UI system was an improvement to the previous iteration, so I'm confident we'll get there, hopefully before 4.0 releases. 🙂

[YuriSizov]

To address the issue of consistency, it might help to make the presets/size flags buttons also reflect the selected nodes' current values (by making them toggle buttons, part of a button group)?

We can give it a try.

Would also be nice to somehow indicate that "expand" is not a standalone flag and is changing the main flag's behavior. Maybe with a highlight like I did for the movie writer button (though that may be too much).

[tokengamedev]

It is exactly what I was expecting, the buttons and checkboxes to behave. in the issue #81726. Internally it has to be managed by code.

[KoBeWi]

Consistency aside, IMO the main problem with this change is that the state of the button is kind of undetermined. It's obvious when you select one Control, but if you have multiple selected controls or non-Control nodes mixed in it becomes messy.

Another option to consider, not mentioned here, is making the expand flag use a modifier key. So the checkbox could be replaced with a label "Hold Shift to set with Expand" (though it's long).

If not, at least the checkbox could be changed to CheckButton, to better convey immediate action.

[ajreckof]

Consistency aside, IMO the main problem with this change is that the state of the button is kind of undetermined. It's obvious when you select one Control, but if you have multiple selected controls or non-Control nodes mixed in it becomes messy.

This is not a real problem as this is already the case in the Inspector and I'm assuming this is just doing the same as the Inspector which just chooses a value. I feel like this is okay as this how most things work in those case.

If not, at least the checkbox could be changed to CheckButton, to better convey immediate action.

I agree check button would be better here

[RedMser]

Sorry it took me a while. Updated to use a check button, since I think this UX is clearer.

[KoBeWi]

Something is wrong with undo:

9jExvWLm42.mp4

[RedMser]

Something is wrong with undo:

Same bug existed for changing the shrink flags in that same popup as well. I fixed both by replacing _edit_set_state with the same set flags methods.

[akien-mga]

Thanks!