Menu bar component SwiftUI

Features

• Observing menu selection changes via generic PreferenceKey
• The color intensity automatically adjusts depending on color scheme (Color+Ext.swift) You don't need to set color for every scheme
• Various strategies for the item menu width allocation
• Set scroll position according the initial selection
• Setting custom colors for the component
• Customize menu item style [round or square]
• iOS and macOS support
• Dark and light scheme support

Required

1. enum

Define enum with menu items conforming to IMenuItem

enum MenuItems: String, IMenuItem {
    case one = "one"
    case two = "two"
    case three = "three"
}

2. create menu bar

• selected - pass value bound to @State var selected : MenuItems?
• values - Pass allCases as a parameter

MenuBar(values: MenuItems.allCases, selected: $selected)
  .onSelectionChanged{ item in }

Optional

• strategy - default strategy for the item menu width allocation is auto

Size strategy	Description
fit	Allocate all affordable space not scrollable
auto	Auto size according the content
flex(CGFloat)	Set up minimal width

• color - default value is .black

• style - default style is round

Style	Description
round	rounded corners
square	squared corners

Component init examples

    @State var selected : MenuItems?

   VStack{
        MenuBar(values: items, selected: $selected, strategy: .flex(102), color: .green)
        MenuBar(values: items, selected: $selected, color: .purple, style: .square)
        MenuBar(values: items, selected: $selected, strategy: .fit, color: .blue)        
        MenuBar(values: items, selected: $selected, color: .red)
    } 

Code example

Take a look on the example preview in MenuContentView.swift or create a project, add the package and put MenuContentView() in ContentView()

Used in

Auto scrollable header menu - SwiftUI & Combine

Documentation(API)

• You need to have Xcode 13 installed in order to have access to Documentation Compiler (DocC)
• Go to Product > Build Documentation or ⌃⇧⌘ D