CODEWITHSUNDEEP
macosswiftuitextfield
rene
rene

Reputation: 2124

TextField inside a List in SwiftUI on macOS: Editing not working well

This problem is with SwiftUI for a macOS app (not iOS or catalyst), using Xcode 12.4 (SwiftUI 2). The problem is that editing of a TextField that is inside a List does not work well, in fact, it works so poorly that at first I thought I could not edit it at all.

This is the code, just as a simple example:

import SwiftUI

struct ContentView: View {
    @State var name1 = "Hans"
    @State var name2 = "E"
    @State var name3 = ""
    
    var body: some View {
        List {
            TextField("Name 1", text: $name1)
            TextField("Name 2", text: $name2)
            TextField("Name 3", text: $name3)
        }
        .textFieldStyle(RoundedBorderTextFieldStyle())
    }
}

TextField with focus

And this is what I experience, trying to edit a field:

I hope this is not the intended behaviour. It is particularly problematic for a field that contains only a single character, making it difficult for the user (must tap exactly on the "E"). Am I doing something wrong here?

I noted the question Editable TextField in SwiftUI List, which is a bit similar, but that question reported the TextField to not work at all.

Upvotes: 7

Views: 1084

Answers (1)

小弟调调
小弟调调

Reputation: 1333

Found a solution.

import SwiftUI

struct ContentView: View {
    @State var name1 = "Hans"
    @State var name2 = "E"
    @State var name3 = ""
    
    var body: some View {
        List {}
          .overlay(VStack(spacing: 20){
              TextField("Name 1", text: $name1)
              TextField("Name 2", text: $name2)
              TextField("Name 3", text: $name3)
          })
          .textFieldStyle(RoundedBorderTextFieldStyle())
    }
}

Upvotes: -2

Related Questions