I have a TextView wrapped in a View (which I wish to use a Component in attempt to creating a pin code entry style widget). I was wondering if there's a way of restricting the input of a TextView to a certain number of characters?

Any pointers would be much appreciated. Current setuip is as follows (please note that the code is very experimental):

import SwiftUI

struct CharacterInputCell: View {

    @State private var textValue: String = ""

    var body: some View {
        TextField("", text: $textValue, onEditingChanged: onEditingChanged(_:), onCommit: onCommit)
        .frame(maxWidth: .infinity, alignment: .center)
        .padding([.trailing, .leading], 10)
        .padding([.vertical], 15)
        .lineLimit(1)
        .multilineTextAlignment(.center)
        .overlay(
            RoundedRectangle(cornerRadius: 6)
                .stroke(Color.red.opacity(0.5), lineWidth: 2)
        )
    }

    func onCommit() {
        print("commit")
    }

    func onEditingChanged(_ changed: Bool) {
        print(changed)
    }
}

struct CharacterInputCell_Previews: PreviewProvider {
    static var previews: some View {
        CharacterInputCell()
    }
}

Not sure if this is 100% efficient but I have been attempting to implement a solution using Combine and it looks something like this:

import SwiftUI
import Combine

struct PassCodeInputCell: View {

    @Binding var value: String

    var body: some View {
        TextField("", text: self.$value)
        .frame(height: 20)
        .frame(maxWidth: .infinity, alignment: .center)
        .padding([.trailing, .leading], 10)
        .padding([.vertical], 15)
        .overlay(
            RoundedRectangle(cornerRadius: 6)
                .stroke(Color.red.opacity(0.5), lineWidth: 2)
        )
        .onReceive(Just(self.value)) { inputValue in
            // With a little help from https://bit.ly/2W1Ljzp
            if inputValue.count > 1 {
                self.value.removeLast()
            }
        }
    }
}

struct PassCodeInputCell_Previews: PreviewProvider {
    static var previews: some View {
        PassCodeInputCell(value: .constant("T"))
    }
}

thoughts, feedback and specially imporvements are very welcome.

Thanks @devraj for your code, it works perfectly comparing to the above one which didn't work with me really don't know why cause it looks logic. Yours is less code and doesn't create a new specific object for each single view, i really like it.

Thanks again.

Thanks @devraj. I also had problems with the Stackoverflow approaches. The Combine approach looks nice. It is reusable as well if you create a custom modifier passing in a text binding and a limit.

Like this at the call site:

@State private var name = ""

...

TextField("", text: $name)
    .limitText($name, length: 30)