1

在 macOS Big Sur 中，所有内置的搜索框控件的外部都会发光以显示焦点。如何在我的 SwiftUI 应用程序中实现这种效果？

macOS Big Sur 搜索栏

我建立了一个看起来很相似的搜索栏，但它仍然有一个看起来很糟糕的矩形对焦环。我可以完全关闭对焦环，但这也不是我想要的。我想要外在的光芒。

我的搜索框

这是我当前的 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 { }
    }
}
4

1 回答 1

2

我能够弄清楚这一点！这种风格的搜索栏是通过NSToolbar使用NSSearchToolbarItem!

于 2020-07-15T14:09:37.990 回答