`Toolbar` about macos_ui HOT 2 CLOSED

OK, so I did some research on how the Toolbar widget should be implemented to match Apple design:

A ToolBar should be a different widget from the TitleBar. A ToolBar though, can also be integrated with the TitleBar (i.e. it can include the app's title info, traditionally in the beginning). More info and examples:

Keynote app (title bar + tool bar):

Sketch app (integrated tool bar):

So, a user should be able to choose and use a preferred window layout:

• with a title bar (and optionally, a toolbar below it),
• with just an integrated toolbar
• without either a title bar or a toolbar (e.g. the Facetime app).

The issue is that including a title bar affects the placement of the traffic lights buttons (close, minimize, zoom), as shown in above screenshots. So, this should be decided beforehand, as it's necessary to set the toolbarStyle setting with Swift code in MainFlutterWindow.swift:

if #available(macOS 11.0, *) {
  // Use .expanded if the app will have a title bar, else use .unified
  self.toolbarStyle = .expanded
} 

So, my plan for implementing the ToolBar widget is to:

• Simplify the existing TitleBar widget to only hold one widget (most probably, a Text widget with the app's name).
• Move the TitleBar widget to MacosWindow (instead of the MacosScaffold), as it should be used app-wide.
• Add a ToolBar widget to the Scaffold, similar to the previous TitleBar widget, that will hold all the toolbar items, a navigational back button, as well as an optional title slot (like in the Sketch screenshot).
• Communicate how to set the proper toolbar style via Swift code in the docs.
• Implement relevant widgets for the toolbar items.

Of course, all these changes will lead to some breaking changes for users that have been using the title bar until now (including me 😄).

A first iteration of this:

Any thoughts or feedback would be welcome! @GroovinChip

from macos_ui.

@whiplashoo this all looks great! One comment I have is that we should figure out a way to allow users to choose if the dividers between the titlebar/toolbar/content area should be visible or not, since some apps (like the ones in your screenshots) do not show them.

from macos_ui.