Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix: Autofocus confirm password textfield on password field submission. #1288

Closed
wants to merge 1 commit into from
Closed

fix: Autofocus confirm password textfield on password field submission. #1288

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 6 additions & 6 deletions packages/smooth_app/ios/Podfile.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,13 +82,13 @@ PODS:
- qr_code_scanner (0.2.0):
- Flutter
- MTBBarcodeScanner
- Sentry (7.9.0):
- Sentry/Core (= 7.9.0)
- Sentry/Core (7.9.0)
- Sentry (7.10.2):
- Sentry/Core (= 7.10.2)
- Sentry/Core (7.10.2)
- sentry_flutter (0.0.1):
- Flutter
- FlutterMacOS
- Sentry (~> 7.9.0)
- Sentry (~> 7.10.1)
- shared_preferences_ios (0.0.1):
- Flutter
- url_launcher_ios (0.0.1):
Expand Down Expand Up @@ -188,8 +188,8 @@ SPEC CHECKSUMS:
PromisesObjC: 68159ce6952d93e17b2dfe273b8c40907db5ba58
Protobuf: 235750e4696ff59fb07d949a9dbbc92b3c0700fe
qr_code_scanner: bb67d64904c3b9658ada8c402e8b4d406d5d796e
Sentry: 2f7e91f247cfb05b05bd01e0b5d0692557a7687b
sentry_flutter: 7c3cb050dc23563a4ea5db438c83afdb460a2ae6
Sentry: 7bf9bfe713692cf87812e55f0999260494ba7982
sentry_flutter: 77ccdac346608b8ce7e428e7284e7a3e4e7f4a02
shared_preferences_ios: 548a61f8053b9b8a49ac19c1ffbc8b92c50d68ad
url_launcher_ios: 839c58cdb4279282219f5e248c3321761ff3c4de

Expand Down
10 changes: 10 additions & 0 deletions packages/smooth_app/lib/generic_lib/widgets/smooth_text_form_field.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,13 +14,15 @@ class SmoothTextFormField extends StatefulWidget {
this.enabled,
this.textInputAction,
this.validator,
this.onSubmit,
this.autofillHints,
this.textColor,
this.backgroundColor,
required this.hintText,
this.hintTextFontSize,
this.prefixIcon,
this.textInputType,
this.focusNode,
}) : super(key: key);

final TextFieldTypes type;
Expand All @@ -30,12 +32,18 @@ class SmoothTextFormField extends StatefulWidget {
final bool? enabled;
final TextInputAction? textInputAction;
final String? Function(String?)? validator;

/// takes in a function to run onFieldSubmit action
final void Function(String?)? onSubmit;
M123-dev marked this conversation as resolved.
Show resolved Hide resolved
final Iterable<String>? autofillHints;
final Color? textColor;
final double? hintTextFontSize;
final Color? backgroundColor;
final TextInputType? textInputType;

/// takes in the focusNode for the textFormField
final FocusNode? focusNode;

@override
State<SmoothTextFormField> createState() => _SmoothTextFormFieldState();
}
Expand All @@ -55,10 +63,12 @@ class _SmoothTextFormFieldState extends State<SmoothTextFormField> {
final bool _autocorrect = widget.type == TextFieldTypes.PLAIN_TEXT;

return TextFormField(
focusNode: widget.focusNode,
keyboardType: widget.textInputType,
controller: widget.controller,
enabled: widget.enabled,
textInputAction: widget.textInputAction,
onFieldSubmitted: widget.onSubmit,
validator: widget.validator,
obscureText: _obscureText,
enableSuggestions: _enableSuggestions,
Expand Down
9 changes: 9 additions & 0 deletions packages/smooth_app/lib/pages/user_management/sign_up_page.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ class _SignUpPageState extends State<SignUpPage> {
final TextEditingController _password1Controller = TextEditingController();
final TextEditingController _password2Controller = TextEditingController();
final TextEditingController _brandController = TextEditingController();
final FocusNode confirmPassword = FocusNode();

bool _foodProducer = false;
bool _agree = false;
Expand Down Expand Up @@ -131,9 +132,17 @@ class _SignUpPageState extends State<SignUpPage> {
}
return null;
},
onSubmit: (String? value) {
// Checks if confirm password is equal to password if not then
// move the focus to the confirm password field
if (_password2Controller.text != value) {
FocusScope.of(context).requestFocus(confirmPassword);
}
Comment on lines +136 to +140
Copy link
Member

@M123-dev M123-dev Apr 1, 2022 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Then lets leave it like that, just two small things to sum up

  1. I could imagine it beeing a bit confusing if sometimes you jump to the second password and another time two steps further. Its certainly great when you know it, but when not not
  2. Please add a comment here and where you create the Focus node that there was a bug and thats why we have this hacky way for changing the focus only for one field

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@M123-dev sure I'll do the points marked out.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Any update @CyberWake

},
),
const SizedBox(height: space),
SmoothTextFormField(
focusNode: confirmPassword,
type: TextFieldTypes.PASSWORD,
controller: _password2Controller,
textInputAction: TextInputAction.next,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm sure your way also works, but have you tried setting the textInputAction for the last field to TextInputAction.done, besides of that I can't think of why the focus move doesn't work for the last one

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

So setting the textInputAction to TextInputAction.done for the confirm password field won't work I guess since the issue starts with the internal mechanism of flutter I guess since the control doesn't get passed automatically ideally the focus passes to the next field inside the for without use of focusNode or textInputAction. But sometimes this doesn't happen due to some reasons like use of obscure field etc. Then in that case we explicitly need to use this focusNode mechanism.

Expand Down