Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How does one use SwiftUI's ToolbarItemGroup?

Tags:

swiftui

I clear don't understand the meaning of the definition syntax for SwiftUI because I can't figure out how one would use ToolbarItemGroup.

I can define a toolbar with toolbar items like this:

.toolbar {
            
            ToolbarItem {
                Button("200%", action: zoom200).foregroundColor(controller.scale == 2.0 ? selectedButtonColor : defaultButtonColor)
            }
            ToolbarItem {
                Button("100%", action: zoom100).foregroundColor(controller.scale == 1.0 ? selectedButtonColor : defaultButtonColor)
            }
}

But have been unable to get ToolbarItemGroup to work. Logically I would have expected something like this:

.toolbar {
   ToolbarItemGroup {
            
         ToolbarItem {
                Button("200%", action: zoom200).foregroundColor(controller.scale == 2.0 ? selectedButtonColor : defaultButtonColor)
            }
         ToolbarItem {
                Button("100%", action: zoom100).foregroundColor(controller.scale == 1.0 ? selectedButtonColor : defaultButtonColor)
            }
   }
   ToolbarItemGroup {
         ToolbarItem {
                Button("Open", action: open)
            }
         ToolbarItem {
                Button("Close", action: close)
            }
   }
}
like image 378
Duncan Groenewald Avatar asked Jul 02 '20 07:07

Duncan Groenewald


People also ask

How does toolbar work SwiftUI?

What is a toolbar? SwiftUI's toolbar modifier allows for placement of views along the top or bottom space of a view. For a toolbar to work properly, it must be embedded in a NavigationView . Here is a view that contains a toolbar with two buttons at the top of the view.

How do I add a tool bar to SwiftUI?

Toolbar items in the bottom bar As we can see in the example, SwiftUI provides the toolbar modifier that we can use to add toolbar items. A ToolbarItem has two required parameters. The first one is the placement and the second one is a closure to build the view that represents our action. Toolbar items in bottom bar.

What is tool bar in swift?

A control that displays one or more buttons along the bottom edge of your interface.


1 Answers

ToolbarItemGroup is designed to group views in the same toolbar. It removes the need for explicit usage of ToolbarItem, as both conform to ToolbarContent.

e.g.

.toolbar {
  ToolbarItemGroup {
    Button("200%",  action: zoom200)
      .foregroundColor(controller.scale == 2.0 ? selectedButtonColor : defaultButtonColor)
    Button("100%", action: zoom100)
      .foregroundColor(controller.scale == 1.0 ? selectedButtonColor : defaultButtonColor)
  }
  ToolbarItemGroup(placement: .bottomBar) {
    Spacer()
    Button("Open", action: open)
    Spacer()
    Button("Close", action: close)
    Spacer()
  }
}

It's also the only way I know of to get Spacers to work, between toolbar items.

like image 191
Jessy Avatar answered Sep 25 '22 16:09

Jessy