Search code examples
macosswiftuiappkit

SwiftUI: How to recreate toolbar style?


I am trying to recreate the native toolbar style for my custom bottom bar. I applied an NSVisualEffectView, but it looks different. The toolbar is white with blur effect, while my custom bottom bar is gray. Additionally, I don't understand how to recreate a drop shadow because SwiftUI's drop shadow also looks different.

List {
  Rectangle().fill(.clear).frame(height: 1000)
}
.overlay(alignment: .bottom) {
  VStack {
    TextField("Enter a message...", text: $content)
  }
  .ignoresSafeArea()
  .background(VisualEffectView(material: .titlebar, blendingMode: .withinWindow))
}

enter image description here


Solution

  • I found the headerView material and added NSShadow to the NSVisualEffectView. Now it looks like a toolbar.

    enter image description here