From 5984cc5a4af173e7652872f29919e331539cdb58 Mon Sep 17 00:00:00 2001 From: cp-ishita-g Date: Tue, 17 Dec 2024 15:39:08 +0530 Subject: [PATCH] fix on press backspace cursor not moving to previous field --- .../ui/flow/space/join/join_space_screen.dart | 56 ++++++++++++++----- 1 file changed, 41 insertions(+), 15 deletions(-) diff --git a/app/lib/ui/flow/space/join/join_space_screen.dart b/app/lib/ui/flow/space/join/join_space_screen.dart index b14cb6ba..b2074386 100644 --- a/app/lib/ui/flow/space/join/join_space_screen.dart +++ b/app/lib/ui/flow/space/join/join_space_screen.dart @@ -1,4 +1,5 @@ import 'package:flutter/material.dart'; +import 'package:flutter/services.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:go_router/go_router.dart'; import 'package:style/button/bottom_sticky_overlay.dart'; @@ -33,8 +34,40 @@ class _JoinSpaceState extends ConsumerState { @override void initState() { super.initState(); - _controllers = List.generate(6, (index) => TextEditingController()); + _controllers = List.generate(6, (index) => TextEditingController(text: '\u200b')); _focusNodes = List.generate(6, (index) => FocusNode()); + + for (int i = 0; i < _controllers.length; i++) { + _controllers[i].addListener(() { + _handleTextChange(i); + }); + } + } + + void _handleTextChange(int index) { + final text = _controllers[index].text; + + if (text.isEmpty) { + // If the field becomes empty, add a zero-width space + _controllers[index].text = '\u200b'; + _controllers[index].selection = const TextSelection.collapsed(offset: 1); + + // Move focus to the previous field + if (index > 0) { + _focusNodes[index - 1].requestFocus(); + } + } else if (text.length > 1) { + // If a valid character is entered, take the last character, convert it to uppercase + String newText = text.replaceAll('\u200b', '').toUpperCase(); + _controllers[index].text = newText; + _controllers[index].selection = TextSelection.collapsed(offset: newText.length); + + // Move focus to the next field + if (index < 5) { + _focusNodes[index + 1].requestFocus(); + } + _updateJoinSpaceButtonState(); + } } @override @@ -150,7 +183,7 @@ class _JoinSpaceState extends ConsumerState { controller: _controllers[index], focusNode: _focusNodes[index], textAlign: TextAlign.center, - maxLength: 1, + maxLength: 2, decoration: const InputDecoration( border: InputBorder.none, counterText: '', @@ -162,6 +195,7 @@ class _JoinSpaceState extends ConsumerState { onTapOutside: (event) { FocusManager.instance.primaryFocus?.unfocus(); }, + onChanged: (text) { final upperCaseText = text.toUpperCase(); if (_controllers[index].text != upperCaseText) { @@ -170,17 +204,6 @@ class _JoinSpaceState extends ConsumerState { selection: TextSelection.collapsed(offset: upperCaseText.length), ); } - - if (text.isEmpty) { - if (index > 0) _focusNodes[index - 1].requestFocus(); - } else { - if (index < 5) { - _focusNodes[index + 1].requestFocus(); - } else { - FocusManager.instance.primaryFocus?.unfocus(); - } - } - _updateJoinSpaceButtonState(); }, ), ), @@ -238,11 +261,14 @@ class _JoinSpaceState extends ConsumerState { void _updateJoinSpaceButtonState() { setState(() { - enabled = - _controllers.every((controller) => controller.text.trim().isNotEmpty); + enabled = _controllers.every((controller) { + final text = controller.text; + return text.length == 1 && text != '\u200b'; + }); }); } + void _observeError() { ref.listen(joinSpaceViewStateProvider.select((state) => state.error), (previous, next) {