'SwiftUI customized text field in OSX

I am creating a edit view in SwiftUI for Mac OSX. A user can change his profile. At the moment I am using default Text() elements to view his current values/settings.

Now I want to create a edit mode. I already created a button, which toggles the edit mode. If the edit mode is activated, I replaced every Text with a TextField.

When I took a look at Apple's contact book for Mac OSX, I found out that they are using a different kind of Text Field (see image)

enter image description here

enter image description here

Is it possible to use this kind of element in SwiftUI and in OSX? What are they called or are they just customized TextFields with Border? I couldn't find any official documentation about them. If somebody finds it, I would be very happy.



Solution 1:[1]

Well, in general all you need is PlainTextFieldStyle, but as currently SwiftUI does not allow to turn off focus ring there is some workaround below to disable it globally for all text fields.

Anyway... I think worth posting, so here it is (tested with Xcode 11.3)

enter image description here

extension NSTextField { // << workaround !!!
    open override var focusRingType: NSFocusRingType {
        get { .none }
        set { }
    }
}

struct ContentView: View {
    @State private var text = ""
    var body: some View {
        HStack {
            Text("Mobil")
            TextField("", text: $text)
                .textFieldStyle(PlainTextFieldStyle())
                .padding(1)
                .background(RoundedRectangle(cornerRadius: 2).stroke(Color.white))
                .frame(width: 100)
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
        .background(Color.black)
    }
}

backup

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1