Proposal: ToolBar Control

[shaheedmalik]

Proposal: [ToolBar Control / Or Add the ability to Undock the Navigation View]

Summary

I was looking at how one would migrate a complex paint program such as Photoshop' toolbars to WinUI. My idea is based on the NavigationView control being undockable.

Rationale

I was looking at how one would take a complex paint program such as Photoshop, Paint.net, or Gimp and upgrade it to WinUI. Navigation View and a Ribbon Control would take care of the menus and options at the top, but how would a toolbar on the side be handled? It dawned on me, that the NavigationView assigned to the left with the ability to undock would serve as a great way to cover this use case.

• Allow Complex Paint Win32 Programs, such as Photoshop, Paint.Net, Gimp, others to move to WinUI
• Allow Programs such as these to retain their functionality without designing a custom complex menu system thus increasing the probability of updating to WinUI
• Allow docking to the left side like the current NavigationView. In fact, allow docking to the top, left, right or bottom.
• Allow vertical or horizontal orientation
• Allow floating and freeform movement.

Scope

Capability	Priority
This proposal will allow developers to accomplish W	Must
Allow docking to the top, left, right or bottom.	Must
Allow vertical or horizontal orientation	Must
Allow floating and freeform movement	Must
Allow resizing of menu and rearrangement of buttons	Should
Allow of buttons to shown or hid via ToolBar settings.	Should

Important Notes

Open Questions

[mdtauk]

The WinUI equivalent of a toolbar is the ApplicationBar, CommandBar, and the CommandBarFlyout.

If you were to use that as a base and then list what additions would be needed to support your toolbar needs - that would be a better start.

Placement on the sides, as well as docking, undocking, resizing, and rearranging buttons, would make a lot of sense.

---

The navigation view is not a toolbar, and performs navigation, not commands.

[shaheedmalik]

The WinUI equivalent of a toolbar is the ApplicationBar, CommandBar, and the CommandBarFlyout.

If you were to use that as a base and then list what additions would be needed to support your toolbar needs - that would be a better start.

Placement on the sides, as well as docking, undocking, resizing, and rearranging buttons, would make a lot of sense.

The navigation view is not a toolbar, and performs navigation, not commands.

I actually listed all of that in the bullet points above. Let me clean it up some more.

[kmgallahan]

Allow docking to the left side like the current NavigationView. In fact, allow docking to the top, left, right or bottom.

Allow floating and freeform movement.

The new AppWindow was/is eventually supposed to support this.

See the Build 2018 video at this timestamp.

It was referenced as "Dockable Tools" there.

[shaheedmalik]

I did some reading on it. It seems like AppWindow won't come until WinUI 3.x

[kmgallahan]

Realistically this control would most likely be a modified CommandBar (as @mdtauk mentioned) that undocks into an AppWindow for floating and "screen docking" as shown in the Build video.

Creating the static control is fairly straightforward.

The complex part is supporting intra-app docking in the style of Visual Studio. For that you need to both have a system defined for what UI element(s) it can dock inside of (maybe something like a new Page subclass), and a system to indicate to the user where the docking is going to happen (like the overlays shown in VS).

The whole "docking" system should probably not be specific to this toolbar control as there have been other requests to dock entire UI panels/pages.

[jevansaks]

Is the ask for dockable tool windows (like #668), or more about a tool palette control that could be used in a floating window but could be used elsewhere?

And there's also the proposal for a Ribbon (#168).

[shaheedmalik]

Is the ask for dockable tool windows (like #668), or more about a tool palette control that could be used in a floating window but could be used elsewhere?

And there's also the proposal for a Ribbon (#168).

It looks like what I am asking for is literally what was shown in the build video above from 2018 with the ability to resize it. But it looks like is is a while off.

[kmgallahan]

@jevansaks

#668 sounds like the overall "docking system" I was referring to in the above comment.

This proposal is then for a specialized toolbar control that would be using said docking system. ~Really just a CommandBar with a drag-grip that can reflow vertically, and maybe have >1 row/column.

I'm not sure how the "screen docking" in the Build 2018 video would play with intra-app docking, or if there is any code behind that feature yet.

[adrientetar]

To me the "tool palette control" is basically an ItemsRepeater. There was a talk of IconButton in some other issue I can't remember, to save the need for retemplating

[mdtauk]

Is the ask for dockable tool windows (like #668), or more about a tool palette control that could be used in a floating window but could be used elsewhere?

And there's also the proposal for a Ribbon (#168).

A toolbar when docked, and "attached" to the edge of a UI element, unless it is detached, then it would be in a ToolWindow which moves along with the app's main window. This is one of the scenarios that the new Windowing APIs are making possible.

[timmarriott]

Are there any updates on this proposal? I am very interested in this type of functionality for the application I am currently working on. In my case I want floating commandbars that are similar to the Photoshop floating pallet idea. They don't have to dock.

[etkramer]

The lack of a docking system in general is the #1 issue that's been keeping me away from WinUI.