From 6c5250434adcb9f7060540aee9a11cc6804f129f Mon Sep 17 00:00:00 2001 From: Michalina Majewska Date: Wed, 5 Jun 2024 16:49:50 +0200 Subject: [PATCH 1/7] Use clear in FormDropdownField --- example/lib/widgets/app_dropdown_field.dart | 16 ++++++++++++---- example/lib/widgets/form_dropdown_field.dart | 3 ++- 2 files changed, 14 insertions(+), 5 deletions(-) diff --git a/example/lib/widgets/app_dropdown_field.dart b/example/lib/widgets/app_dropdown_field.dart index 79585ea..9ea0081 100644 --- a/example/lib/widgets/app_dropdown_field.dart +++ b/example/lib/widgets/app_dropdown_field.dart @@ -9,7 +9,8 @@ class AppDropdownField extends StatelessWidget { required this.onChanged, this.label, this.hint, - this.onClear, + this.onSetToInitial, + this.onEmpty, this.errorText, }); @@ -19,7 +20,8 @@ class AppDropdownField extends StatelessWidget { final ValueChanged onChanged; final String? label; final String? hint; - final VoidCallback? onClear; + final VoidCallback? onSetToInitial; + final VoidCallback? onEmpty; final String? errorText; @override @@ -45,9 +47,15 @@ class AppDropdownField extends StatelessWidget { ), ), ), + const SizedBox(width: 16), ElevatedButton( - onPressed: onClear, - child: const Text('Clear choice'), + onPressed: onSetToInitial, + child: const Text('Set to initial'), + ), + const SizedBox(width: 16), + ElevatedButton( + onPressed: onEmpty, + child: const Text('Empty'), ), ], ); diff --git a/example/lib/widgets/form_dropdown_field.dart b/example/lib/widgets/form_dropdown_field.dart index 819600c..239db6c 100644 --- a/example/lib/widgets/form_dropdown_field.dart +++ b/example/lib/widgets/form_dropdown_field.dart @@ -17,7 +17,8 @@ class FormDropdownField extends FieldBuilder { labelBuilder: labelBuilder, label: labelText, hint: hintText, - onClear: () => field.select(null), + onSetToInitial: field.clear, + onEmpty: () => field.select(null), errorText: state.error != null ? translateError(state.error!) : null, ), From 629c3e16d379058ec75276d0cd016c47946cdeef Mon Sep 17 00:00:00 2001 From: Michalina Majewska Date: Wed, 5 Jun 2024 16:55:17 +0200 Subject: [PATCH 2/7] Add some initial values --- example/lib/screens/simple_form.dart | 2 ++ 1 file changed, 2 insertions(+) diff --git a/example/lib/screens/simple_form.dart b/example/lib/screens/simple_form.dart index d4327f3..7968f64 100644 --- a/example/lib/screens/simple_form.dart +++ b/example/lib/screens/simple_form.dart @@ -68,10 +68,12 @@ class SimpleFormCubit extends FormGroupCubit { } final firstName = TextFieldCubit( + initialValue: 'Example first name', validator: filled(ValidationError.empty), ); final lastName = TextFieldCubit( + initialValue: 'Example last name', validator: filled(ValidationError.empty), ); From 5bd766f1853b133f775f9b6fad337de61fa9fc24 Mon Sep 17 00:00:00 2001 From: Michalina Majewska Date: Wed, 5 Jun 2024 16:56:07 +0200 Subject: [PATCH 3/7] Use clear in FormTextField (screen does not update yet) --- example/lib/widgets/app_text_field.dart | 56 ++++++++++++++++++------ example/lib/widgets/form_text_field.dart | 2 + 2 files changed, 45 insertions(+), 13 deletions(-) diff --git a/example/lib/widgets/app_text_field.dart b/example/lib/widgets/app_text_field.dart index 0ab6898..03596ca 100644 --- a/example/lib/widgets/app_text_field.dart +++ b/example/lib/widgets/app_text_field.dart @@ -19,6 +19,8 @@ class AppTextField extends HookWidget { this.hintText, this.errorText, this.suffix, + this.onSetToInitial, + this.onEmpty, }); final TextEditingController? controller; @@ -33,6 +35,8 @@ class AppTextField extends HookWidget { final String? hintText; final String? errorText; final Widget? suffix; + final VoidCallback? onSetToInitial; + final VoidCallback? onEmpty; @override Widget build(BuildContext context) { @@ -59,19 +63,45 @@ class AppTextField extends HookWidget { [], ); - return TextFormField( - autocorrect: false, - focusNode: focusNode, - controller: textEditingController, - onChanged: onChanged, - onTapOutside: (_) => focusNode.unfocus(), - onFieldSubmitted: onFieldSubmitted, - decoration: InputDecoration( - labelText: labelText, - hintText: hintText, - errorText: errorText, - suffix: suffix, - ), + return Row( + children: [ + Flexible( + child: TextFormField( + autocorrect: false, + focusNode: focusNode, + controller: textEditingController, + onChanged: onChanged, + onTapOutside: (_) => focusNode.unfocus(), + onFieldSubmitted: onFieldSubmitted, + decoration: InputDecoration( + labelText: labelText, + hintText: hintText, + errorText: errorText, + suffix: suffix, + ), + ), + ), + const SizedBox(width: 16), + ElevatedButton( + onPressed: () { + if (onEmpty case final onEmpty?) { + onEmpty(); + textEditingController.clear(); + } + }, + child: const Text('Empty'), + ), + const SizedBox(width: 16), + ElevatedButton( + onPressed: () { + if (onSetToInitial case final onSetToInitial?) { + onSetToInitial(); + textEditingController.text = initialValue ?? ''; + } + }, + child: const Text('Set to initial'), + ), + ], ); } } diff --git a/example/lib/widgets/form_text_field.dart b/example/lib/widgets/form_text_field.dart index c564c9b..07bcc8f 100644 --- a/example/lib/widgets/form_text_field.dart +++ b/example/lib/widgets/form_text_field.dart @@ -34,6 +34,8 @@ class FormTextField extends FieldBuilder { child: CircularProgressIndicator(), ) : null, + onSetToInitial: field.clear, + onEmpty: () => field.setValue(''), ), ); } From 79d95f31f0957807d4921460dc13704ca0cfdf21 Mon Sep 17 00:00:00 2001 From: Michalina Majewska Date: Wed, 12 Jun 2024 12:36:06 +0200 Subject: [PATCH 4/7] Use clear in text field --- example/lib/screens/simple_form.dart | 6 ++++-- example/lib/widgets/app_text_field.dart | 25 ++++++++++-------------- example/lib/widgets/form_text_field.dart | 9 +++++++-- 3 files changed, 21 insertions(+), 19 deletions(-) diff --git a/example/lib/screens/simple_form.dart b/example/lib/screens/simple_form.dart index 7968f64..0bc31e6 100644 --- a/example/lib/screens/simple_form.dart +++ b/example/lib/screens/simple_form.dart @@ -34,12 +34,14 @@ class SimpleForm extends StatelessWidget { translateError: validatorTranslator, labelText: 'First Name', hintText: 'Enter your first name', + canSetToInitial: true, ), FormTextField( field: context.read().lastName, translateError: validatorTranslator, labelText: 'Last Name', hintText: 'Enter your last name', + canSetToInitial: true, ), FormTextField( field: context.read().email, @@ -68,12 +70,12 @@ class SimpleFormCubit extends FormGroupCubit { } final firstName = TextFieldCubit( - initialValue: 'Example first name', + initialValue: 'John', validator: filled(ValidationError.empty), ); final lastName = TextFieldCubit( - initialValue: 'Example last name', + initialValue: 'Foo', validator: filled(ValidationError.empty), ); diff --git a/example/lib/widgets/app_text_field.dart b/example/lib/widgets/app_text_field.dart index 03596ca..757b50c 100644 --- a/example/lib/widgets/app_text_field.dart +++ b/example/lib/widgets/app_text_field.dart @@ -20,7 +20,6 @@ class AppTextField extends HookWidget { this.errorText, this.suffix, this.onSetToInitial, - this.onEmpty, }); final TextEditingController? controller; @@ -35,8 +34,7 @@ class AppTextField extends HookWidget { final String? hintText; final String? errorText; final Widget? suffix; - final VoidCallback? onSetToInitial; - final VoidCallback? onEmpty; + final String Function()? onSetToInitial; @override Widget build(BuildContext context) { @@ -84,23 +82,20 @@ class AppTextField extends HookWidget { const SizedBox(width: 16), ElevatedButton( onPressed: () { - if (onEmpty case final onEmpty?) { - onEmpty(); + { textEditingController.clear(); + setValue(''); } }, child: const Text('Empty'), ), - const SizedBox(width: 16), - ElevatedButton( - onPressed: () { - if (onSetToInitial case final onSetToInitial?) { - onSetToInitial(); - textEditingController.text = initialValue ?? ''; - } - }, - child: const Text('Set to initial'), - ), + if (onSetToInitial case final onSetToInitial?) ...[ + const SizedBox(width: 16), + ElevatedButton( + onPressed: () => textEditingController.text = onSetToInitial(), + child: const Text('Set to initial'), + ), + ], ], ); } diff --git a/example/lib/widgets/form_text_field.dart b/example/lib/widgets/form_text_field.dart index 07bcc8f..8e95c6b 100644 --- a/example/lib/widgets/form_text_field.dart +++ b/example/lib/widgets/form_text_field.dart @@ -14,6 +14,7 @@ class FormTextField extends FieldBuilder { bool? trimOnUnfocus, String? labelText, String? hintText, + bool canSetToInitial = false, }) : super( builder: (context, state) => AppTextField( key: key, @@ -34,8 +35,12 @@ class FormTextField extends FieldBuilder { child: CircularProgressIndicator(), ) : null, - onSetToInitial: field.clear, - onEmpty: () => field.setValue(''), + onSetToInitial: canSetToInitial + ? () { + field.clear(); + return field.state.value; + } + : null, ), ); } From 9d4f6e859ec388dd3a169762a85b7d2d6711bceb Mon Sep 17 00:00:00 2001 From: Michalina Majewska Date: Wed, 12 Jun 2024 12:48:11 +0200 Subject: [PATCH 5/7] Unify dropdown field and text field layouts --- example/lib/screens/complex_form.dart | 1 + example/lib/widgets/app_dropdown_field.dart | 28 +++++++++++--------- example/lib/widgets/form_dropdown_field.dart | 5 ++-- 3 files changed, 20 insertions(+), 14 deletions(-) diff --git a/example/lib/screens/complex_form.dart b/example/lib/screens/complex_form.dart index 0470b33..41be625 100644 --- a/example/lib/screens/complex_form.dart +++ b/example/lib/screens/complex_form.dart @@ -80,6 +80,7 @@ class HumanSubform extends StatelessWidget { translateError: validatorTranslator, labelText: 'Gender', hintText: 'Select gender', + canSetToInitial: true, ), const SizedBox(height: 16), FormTextField( diff --git a/example/lib/widgets/app_dropdown_field.dart b/example/lib/widgets/app_dropdown_field.dart index 9ea0081..aa6a66b 100644 --- a/example/lib/widgets/app_dropdown_field.dart +++ b/example/lib/widgets/app_dropdown_field.dart @@ -9,9 +9,9 @@ class AppDropdownField extends StatelessWidget { required this.onChanged, this.label, this.hint, + this.errorText, this.onSetToInitial, this.onEmpty, - this.errorText, }); final List options; @@ -20,9 +20,9 @@ class AppDropdownField extends StatelessWidget { final ValueChanged onChanged; final String? label; final String? hint; + final String? errorText; final VoidCallback? onSetToInitial; final VoidCallback? onEmpty; - final String? errorText; @override Widget build(BuildContext context) { @@ -47,16 +47,20 @@ class AppDropdownField extends StatelessWidget { ), ), ), - const SizedBox(width: 16), - ElevatedButton( - onPressed: onSetToInitial, - child: const Text('Set to initial'), - ), - const SizedBox(width: 16), - ElevatedButton( - onPressed: onEmpty, - child: const Text('Empty'), - ), + if (onEmpty case final onEmpty?) ...[ + const SizedBox(width: 16), + ElevatedButton( + onPressed: onEmpty, + child: const Text('Empty'), + ), + ], + if (onSetToInitial case final onSetToInitial?) ...[ + const SizedBox(width: 16), + ElevatedButton( + onPressed: onSetToInitial, + child: const Text('Set to initial'), + ), + ], ], ); } diff --git a/example/lib/widgets/form_dropdown_field.dart b/example/lib/widgets/form_dropdown_field.dart index 239db6c..73c18ce 100644 --- a/example/lib/widgets/form_dropdown_field.dart +++ b/example/lib/widgets/form_dropdown_field.dart @@ -9,6 +9,7 @@ class FormDropdownField extends FieldBuilder { required ErrorTranslator translateError, String? labelText, String? hintText, + bool canSetToInitial = false, }) : super( builder: (context, state) => AppDropdownField( value: state.value, @@ -17,10 +18,10 @@ class FormDropdownField extends FieldBuilder { labelBuilder: labelBuilder, label: labelText, hint: hintText, - onSetToInitial: field.clear, - onEmpty: () => field.select(null), errorText: state.error != null ? translateError(state.error!) : null, + onSetToInitial: canSetToInitial ? field.clear : null, + onEmpty: () => field.select(null), ), ); } From abb5aae10ee2442c915b99e2aedcf968c225dec1 Mon Sep 17 00:00:00 2001 From: Michalina Majewska Date: Wed, 12 Jun 2024 13:26:22 +0200 Subject: [PATCH 6/7] Mention clear method in readme --- README.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index a3df8d9..08bb319 100644 --- a/README.md +++ b/README.md @@ -213,6 +213,8 @@ The package contains a collection of field cubits useful for implementing common - `SingleSelectFieldCubit` - specialization of `FieldCubit` for a single choice of value from list of options, - `MultiSelectFieldCubit` - specialization of `FieldCubit` for a multiple choice of values from list of options. +`TextFieldCubit`, `SingleSelectFieldCubit`, `MultiSelectFieldCubit` contain the `clear()` method that resets the value of the field to the initial value by calling `reset()`. You can also call `reset()` as it is defined in the `FieldCubit` class. + ### Creating custom `FieldCubit` If none of the existing `FieldCubit` implementations meet your requirements, you can create your own. Simply create a class that extends `FieldCubit`. Inside such cubit, you can add any method or a field. @@ -289,4 +291,4 @@ class SubformCubit extends FormGroupCubit { final subformField = TextFieldCubit(); } -``` \ No newline at end of file +``` From cf33575e316a6cf76222f1437d14d63a81eb68ff Mon Sep 17 00:00:00 2001 From: Michalina Majewska Date: Mon, 17 Jun 2024 15:16:40 +0200 Subject: [PATCH 7/7] Fix stylistics --- README.md | 2 +- example/lib/widgets/app_text_field.dart | 6 ++---- 2 files changed, 3 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 08bb319..30cc10c 100644 --- a/README.md +++ b/README.md @@ -213,7 +213,7 @@ The package contains a collection of field cubits useful for implementing common - `SingleSelectFieldCubit` - specialization of `FieldCubit` for a single choice of value from list of options, - `MultiSelectFieldCubit` - specialization of `FieldCubit` for a multiple choice of values from list of options. -`TextFieldCubit`, `SingleSelectFieldCubit`, `MultiSelectFieldCubit` contain the `clear()` method that resets the value of the field to the initial value by calling `reset()`. You can also call `reset()` as it is defined in the `FieldCubit` class. +`TextFieldCubit`, `SingleSelectFieldCubit` and `MultiSelectFieldCubit` contain the `clear()` method that resets the value of the field to the initial value by calling `reset()`. You can also call `reset()` as it is defined in the `FieldCubit` class. ### Creating custom `FieldCubit` diff --git a/example/lib/widgets/app_text_field.dart b/example/lib/widgets/app_text_field.dart index 757b50c..e632a65 100644 --- a/example/lib/widgets/app_text_field.dart +++ b/example/lib/widgets/app_text_field.dart @@ -82,10 +82,8 @@ class AppTextField extends HookWidget { const SizedBox(width: 16), ElevatedButton( onPressed: () { - { - textEditingController.clear(); - setValue(''); - } + textEditingController.clear(); + setValue(''); }, child: const Text('Empty'), ),