Как создать окно поиска в стиле MacOS Big Sur с внешним кольцом фокусировки в SwiftUI?

Question

В macOS Big Sur все встроенные элементы управления окна поиска имеют свечение снаружи, чтобы показать фокус. Как я могу добиться этого эффекта в моем приложении SwiftUI?

Я построил панель поиска, которая выглядит похожей, но у нее все еще есть прямоугольное кольцо фокусировки, которое выглядит очень плохо. Я могу полностью отключить кольцо фокусировки, но я тоже этого не хочу. Я хочу внешнего сияния.

Это мой текущий код SwiftUI. Обратите внимание наNSTextField focusRingTypeпереопределить. При этом я могу отключить кольцо фокусировки, но это не то, что я хочу. По умолчанию дает мне прямоугольный, плохой фокус. Кажется, что внешний вид - это билет, но он дает тот же результат, что и по умолчанию. Мне интересно, может ли это быть просто ошибкой в ​​текущей бета-версии разработчиков Big Sur/Xcode/SwiftUI.

import SwiftUI

struct SearchBarView: View {
    
    @Binding var searchText: String
    
    var body: some View {
        HStack {
            TextField("Search ...", text: self.$searchText)
                .textFieldStyle(PlainTextFieldStyle())
                .padding(7)
                .padding(.horizontal, 25)
                .background(Color("systemGray6"))
                .cornerRadius(8)
                .overlay(
                    HStack {
                        Image(systemName: "magnifyingglass")
                            .foregroundColor(.gray)
                            .frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
                            .padding(.leading, 10)
                    }
                )
                .padding(.horizontal, 10)
        }
        .padding()
    }
}

struct SearchBarView_Previews: PreviewProvider {
    static var previews: some View {
        VStack {
            SearchBarView(searchText: .constant(""))
                .previewLayout(.fixed(width: 35, height: 50))
                .environment(\.colorScheme, .dark)
            
            SearchBarView(searchText: .constant(""))
                .previewLayout(.fixed(width: 35, height: 50))
                .environment(\.colorScheme, .light)
        }
    }
}

extension NSTextField {
    open override var focusRingType: NSFocusRingType {
        //get { .none }
        get { .default }
        // get { .exterior } // same as .default, could just be bug in Big Sur Dev Beta 1&2?
        set { }
    }
}

Answer 1

Я смог понять это! Такой стиль панели поиска предоставляетсяNSToolbar с помощью NSSearchToolbarItem!