SwiftUI: How to move/jump to next TextField without hiding keyboard?

Question

I'm solving how to jump to the next TextField in SwiftUI. Below is example code which is not working correctly, but there is an idea of how it could work.

struct ContentView: View {
    @FocusState private var focused: Bool
    @State private var activeIndex: Int = 0

    var body: some View {
        HStack(spacing: 3) {
            ForEach(0..<10, id: \.self) { index in
                Stone(activeIndex: $activeIndex, focused: _focused, index: index)
            }
        }
        .padding(.horizontal)
    }
}

The problem when I'm trying to jump to next TextField is, that nothing will happen.

struct Stone: View {
    @Binding var activeIndex: Int
    @FocusState var focused: Bool
    @State var index: Int

    @State private var text: String = ""

    var body: some View {
        GeometryReader { bounds in
            ZStack {
                TextField("", text: $text)
                    .multilineTextAlignment(.center)
                    .focused($focused)
                    .background(index == activeIndex ? .red : .green)
                    .onChange(of: text) { newValue in
                        if let lastValue = newValue.last {
                            text = String(lastValue)

                            activeIndex += 1

                            focused = true
                        }
                    }
            }
            .frame(width: bounds.size.width, height: bounds.size.height)
        }
        .scaledToFit()
    }
}

I found some number of ways how to jump to next TextField, but mostly in UIKit. So my question is, how can I jump to next TextField in SwiftUI?

https://stackoverflow.com/questions/57188098/swiftui-is-it-possible-to-automatically-move-to-the-next-textfield-after-1-char/70294937#70294937 — lorem ipsum, Jul 25 '22 at 12:15
Your question focus on multiple different questions. Please be more specific. Also, I don't understand why you want to jump to another TextField while focus on the current TextField. And what it has to do with `How can I create "pin code authentication"`? Do you understand your own question? — Steven-Carrot, Jul 25 '22 at 12:28
@tail I edited my question. I also found an answer based on lorem ipsum. Really thanks to lorem ipsum! I'll answer my own question for a while and I'll also attach a functional example to understand what I meant by my question. — petomuro, Jul 27 '22 at 16:43

petomuro · Accepted Answer · 2023-08-03T13:15:56.863

Here is an imperfect version example to understand what I meant by my question.

struct ContentView: View {
    @FocusState private var focusedField: Int?

    var body: some View {
        HStack(spacing: 3) {
            ForEach(0..<10, id: \.self) { index in
                Stone(focusedField: _focusedField, index: index)
            }
        }
        .padding(.horizontal)
    }
}

struct Stone: View {
    @FocusState var focusedField: Int?
    @State var index: Int

    @State private var text: String = ""

    var body: some View {
        TextField("", text: $text)
            .focused($focusedField, equals: index)
            .textFieldStyle(.roundedBorder)
            .onChange(of: text) { _ in
                setFocus(index: index)
            }
    }

    func setFocus(index: Int) {
        // Default to the first box when focus is not set or the user reaches the last box
        if focusedField == nil || focusedField == 9 {
            focusedField = 0
        } else {
            // Another safety check for the index
            if index == 9 {
                focusedField = 0
            } else {
                focusedField = index + 1
            }
        }
    }
}

SwiftUI: How to move/jump to next TextField without hiding keyboard?

1 Answers1