拼写改为逐个字母填空，空缺位闪烁光标
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
@@ -9,7 +9,8 @@ struct QuizView: View {
|
||||
@State private var questions: [QuizQuestion]
|
||||
@State private var currentIndex = 0
|
||||
@State private var selectedOption: String?
|
||||
@State private var userInput = ""
|
||||
@State private var filledBlanks: [String] = []
|
||||
@State private var currentBlankIndex = 0
|
||||
@State private var wrongWords: [Word] = []
|
||||
@State private var finished = false
|
||||
@State private var startDate = Date.now
|
||||
@@ -39,6 +40,25 @@ struct QuizView: View {
|
||||
}
|
||||
.navigationTitle(config.mode.rawValue)
|
||||
.navigationBarTitleDisplayMode(.inline)
|
||||
.onChange(of: current?.id) { _, _ in
|
||||
resetBlanks()
|
||||
}
|
||||
.onChange(of: currentBlankIndex) { _, _ in
|
||||
guard config.mode == .spelling, let question = current else { return }
|
||||
if currentBlankIndex == question.blankPositions.count {
|
||||
let typed = filledBlanks.joined()
|
||||
selectedOption = typed
|
||||
if typed != question.answer {
|
||||
wrongWords.append(question.word)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private func resetBlanks() {
|
||||
guard config.mode == .spelling, let question = current else { return }
|
||||
filledBlanks = Array(repeating: "", count: question.blankPositions.count)
|
||||
currentBlankIndex = 0
|
||||
}
|
||||
|
||||
private func questionView(_ question: QuizQuestion) -> some View {
|
||||
@@ -132,28 +152,17 @@ struct QuizView: View {
|
||||
|
||||
private func spellingView(_ question: QuizQuestion) -> some View {
|
||||
VStack(spacing: 16) {
|
||||
Text(question.blankedWord)
|
||||
.font(.system(size: 44, weight: .bold, design: .monospaced))
|
||||
.tracking(6)
|
||||
Text("\(question.word.word.count) 个字母")
|
||||
.font(.subheadline)
|
||||
.foregroundStyle(.secondary)
|
||||
HStack(spacing: 12) {
|
||||
TextField("输入完整单词", text: $userInput)
|
||||
.textFieldStyle(.roundedBorder)
|
||||
.autocapitalization(.none)
|
||||
.disableAutocorrection(true)
|
||||
.disabled(selectedOption != nil)
|
||||
Button("确认") {
|
||||
guard !userInput.trimmingCharacters(in: .whitespaces).isEmpty else { return }
|
||||
selectedOption = userInput.trimmingCharacters(in: .whitespaces).lowercased()
|
||||
if selectedOption != question.answer {
|
||||
wrongWords.append(question.word)
|
||||
}
|
||||
}
|
||||
.buttonStyle(.borderedProminent)
|
||||
.disabled(userInput.trimmingCharacters(in: .whitespaces).isEmpty || selectedOption != nil)
|
||||
}
|
||||
SpellingWordInput(
|
||||
blankedWord: question.blankedWord,
|
||||
blankPositions: question.blankPositions,
|
||||
currentBlankIndex: $currentBlankIndex,
|
||||
filledBlanks: $filledBlanks
|
||||
)
|
||||
.disabled(selectedOption != nil)
|
||||
.opacity(selectedOption != nil ? 0.6 : 1)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -176,7 +185,6 @@ struct QuizView: View {
|
||||
if currentIndex + 1 < questions.count {
|
||||
currentIndex += 1
|
||||
selectedOption = nil
|
||||
userInput = ""
|
||||
} else {
|
||||
finished = true
|
||||
}
|
||||
@@ -186,7 +194,8 @@ struct QuizView: View {
|
||||
questions = QuizGenerator.makeQuestions(mode: config.mode, words: config.words)
|
||||
currentIndex = 0
|
||||
selectedOption = nil
|
||||
userInput = ""
|
||||
filledBlanks = []
|
||||
currentBlankIndex = 0
|
||||
wrongWords = []
|
||||
finished = false
|
||||
startDate = .now
|
||||
|
||||
@@ -0,0 +1,141 @@
|
||||
import SwiftUI
|
||||
import UIKit
|
||||
|
||||
// Captures keystrokes one at a time via hidden UITextField delegate
|
||||
struct KeystrokeCaptureField: UIViewRepresentable {
|
||||
let onChar: (Character) -> Void
|
||||
let onBackspace: () -> Void
|
||||
|
||||
func makeUIView(context: Context) -> UITextField {
|
||||
let tf = UITextField()
|
||||
tf.delegate = context.coordinator
|
||||
tf.autocorrectionType = .no
|
||||
tf.autocapitalizationType = .none
|
||||
tf.spellCheckingType = .no
|
||||
return tf
|
||||
}
|
||||
|
||||
func makeCoordinator() -> Coordinator {
|
||||
Coordinator(onChar: onChar, onBackspace: onBackspace)
|
||||
}
|
||||
|
||||
func updateUIView(_ uiView: UITextField, context: Context) {}
|
||||
|
||||
class Coordinator: NSObject, UITextFieldDelegate {
|
||||
let onChar: (Character) -> Void
|
||||
let onBackspace: () -> Void
|
||||
|
||||
init(onChar: @escaping (Character) -> Void, onBackspace: @escaping () -> Void) {
|
||||
self.onChar = onChar
|
||||
self.onBackspace = onBackspace
|
||||
}
|
||||
|
||||
func textField(_ textField: UITextField, shouldChangeCharactersIn range: NSRange, replacementString string: String) -> Bool {
|
||||
if string.isEmpty {
|
||||
onBackspace()
|
||||
} else if let char = string.last {
|
||||
onChar(char)
|
||||
}
|
||||
textField.text = nil
|
||||
return false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Blinking cursor on the active blank
|
||||
struct BlinkingCursor: View {
|
||||
var body: some View {
|
||||
TimelineView(.periodic(from: .now, by: 0.6)) { timeline in
|
||||
let visible = Int(timeline.date.timeIntervalSinceReferenceDate / 0.6) % 2 == 0
|
||||
Rectangle()
|
||||
.fill(.tint)
|
||||
.frame(width: 2, height: 22)
|
||||
.opacity(visible ? 1 : 0)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Interactive word input with per-blank slots
|
||||
struct SpellingWordInput: View {
|
||||
let blankedWord: String
|
||||
let blankPositions: [Int]
|
||||
@Binding var currentBlankIndex: Int
|
||||
@Binding var filledBlanks: [String]
|
||||
@FocusState private var isFocused
|
||||
|
||||
private let chars: [String]
|
||||
|
||||
init(blankedWord: String, blankPositions: [Int], currentBlankIndex: Binding<Int>, filledBlanks: Binding<[String]>) {
|
||||
self.blankedWord = blankedWord
|
||||
self.blankPositions = blankPositions
|
||||
self._currentBlankIndex = currentBlankIndex
|
||||
self._filledBlanks = filledBlanks
|
||||
self.chars = blankedWord.map { String($0) }
|
||||
}
|
||||
|
||||
var body: some View {
|
||||
VStack(spacing: 8) {
|
||||
KeystrokeCaptureField(
|
||||
onChar: { char in
|
||||
guard currentBlankIndex < blankPositions.count else { return }
|
||||
filledBlanks[currentBlankIndex] = String(char).lowercased()
|
||||
currentBlankIndex += 1
|
||||
},
|
||||
onBackspace: {
|
||||
guard currentBlankIndex > 0 else { return }
|
||||
currentBlankIndex -= 1
|
||||
filledBlanks[currentBlankIndex] = ""
|
||||
}
|
||||
)
|
||||
.frame(width: 0, height: 0)
|
||||
.opacity(0.01)
|
||||
.focused($isFocused)
|
||||
|
||||
HStack(spacing: 4) {
|
||||
ForEach(Array(chars.enumerated()), id: \.offset) { index, ch in
|
||||
if ch == "_" {
|
||||
blankSlot(index: index)
|
||||
} else {
|
||||
Text(ch.uppercased())
|
||||
.font(.title2.weight(.bold))
|
||||
.frame(width: 22)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.onTapGesture { isFocused = true }
|
||||
.onAppear {
|
||||
DispatchQueue.main.asyncAfter(deadline: .now() + 0.3) {
|
||||
isFocused = true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ViewBuilder
|
||||
private func blankSlot(index: Int) -> some View {
|
||||
let blankIndex = blankPositions.firstIndex(of: index) ?? 0
|
||||
let isCurrent = blankIndex == currentBlankIndex && isFocused
|
||||
let filled = blankIndex < filledBlanks.count ? filledBlanks[blankIndex] : nil
|
||||
|
||||
ZStack {
|
||||
RoundedRectangle(cornerRadius: 6)
|
||||
.fill(.quaternary.opacity(0.2))
|
||||
.frame(width: 28, height: 40)
|
||||
RoundedRectangle(cornerRadius: 6)
|
||||
.stroke(.quaternary, lineWidth: 1)
|
||||
.frame(width: 28, height: 40)
|
||||
if isCurrent {
|
||||
RoundedRectangle(cornerRadius: 6)
|
||||
.stroke(.tint, lineWidth: 2)
|
||||
.frame(width: 28, height: 40)
|
||||
}
|
||||
|
||||
if let filled, !filled.isEmpty {
|
||||
Text(filled.uppercased())
|
||||
.font(.title2.weight(.bold))
|
||||
} else if isCurrent {
|
||||
BlinkingCursor()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user