Godot-proposals: Add a toolbar container

[timothyqiu]

Describe the project you are working on: Just playing around trying to find & fix bugs

Describe the problem or limitation you are having in your project:

Editor's toolbar can end up with lots of buttons. Currently, it uses a HBoxContainer as toolbar. To keep all the buttons visible, it even pushes dock panels out of the window frame:

The window in the screenshot is maximized. The inspector is pushed off the window.

Describe how this feature / enhancement will help you overcome this problem or limitation:

A toolbar container does not have to make all its children visible, it can have a much smaller minimum width.

Show a mock up screenshots/video or a flow diagram explaining how your proposal will work:

If there is not enough space to show all the buttons on the toolbar, the extra buttons can be put into an overflow menu, as its menu items. (like an Android toolbar / extension toolbar on Chrome.)

Describe implementation detail for your proposal (in code), if possible:

ToolbarContainer is like an HBoxContainer with a hidden trailing overflow menu button. When the container is resized to its minimum size, it only shows the overflow button. The container's children are usually ToolbarItems. ToolbarItem creates an button when on the toolbar, and creates a menu item when in the overflow menu.

Additionally, a ToolbarItemGroup can be added to group ToolbarItems. It has three menu modes:

• always: shows an overflow menu button on the toolbar, or a submenu in the overflow menu
• never: shows a divider separated group of buttons on the toolbar, or a divider separated group of menu options in the overflow menu
• auto: default, one of the above two behaviors depending the available space

There are existing overflow menus that are added manually. For example:

The layout in the above screenshot may be implemented as something like this: (shown in XML for easy display of hierarchy)

<ToolbarContainer>

<ToolbarItemGroup>
    <ToolbarItem icon="aaa">Use Smart Snap</ToolbarItem>
    <ToolbarItem icon="bbb">Use Grid Snap</ToolbarItem>
    <ToolbarItemGroup menu_mode="always">
        <ToolbarItem select_mode="toggle">Use Rotation Snap</ToolbarItem>
        <ToolbarItem select_mode="toggle">Use Scale Snap</ToolbarItem>
        <ToolbarItem select_mode="toggle">Snap Relative</ToolbarItem>
        <ToolbarItem select_mode="toggle">Use Pixel Snap</ToolbarItem> 
        <ToolbarItemGroup menu_mode="always" text="Smart Snapping">
            <ToolbarItem>XXX</ToolbarItem> 
        </ToolbarItemGroup>
        <ToolbarItemGroup menu_mode="never">
            <ToolbarItem>Configure Snap...</ToolbarItem> 
        </ToolbarItemGroup>
    </ToolbarItemGroup>
</ToolbarItemGroup>
<ToolbarItemGroup>
    <ToolbarItem icon="ccc" tooltip="Lock the selected object in place.">Lock Object</ToolbarItem>
    <ToolbarItem icon="ddd" tooltip="Make sure the object's children are not selectable.">Protect Children</ToolbarItem>
</ToolbarItemGroup>
<ToolbarItemGroup icon="bone" menu_mode="always">
    <ToolbarItem>XXX</ToolbarItem>
</ToolbarItemGroup>
<ToolbarItem icon="camera">Game Camera Override</ToolbarItem>

</ToolbarContainer>

If this enhancement will not be used often, can it be worked around with a few lines of script?:

Seems not achievable using only a few lines of script.

Is there a reason why this should be core and not an add-on in the asset library?:

Editor can make use of this container for toolbar.

[groud]

I like the idea, it's a simple way to solve the problem we have right now without implementing a flow layout system. I don't think a ToolbarItemGroup as you describe it is needed though, it makes things more complex than what is actually needed I think.

[timothyqiu]

The menu mode thing I described for ToolbarItemGroup is indeed a bit complex. ToolbarItemGroup can just be a way to auto insert separators.

I think explicit grouping (in contrast to inserting separators manually) makes it easy to implement new features. For example, the group highlighting mentioned in https://github.com/godotengine/godot-proposals/issues/14#issuecomment-527899659 can just be a property of ToolbarItemGroup; the menu mode concept can also be implemented later base on the grouping if needed.