From d1fa8058281c1915ae77cd5dac9aa6c973c9a9b9 Mon Sep 17 00:00:00 2001 From: Tahateber95 Date: Fri, 21 Jan 2022 21:20:27 +0100 Subject: [PATCH 1/5] update column orientation --- lib/dropdown_formfield.dart | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/dropdown_formfield.dart b/lib/dropdown_formfield.dart index d3df4f4..e670258 100644 --- a/lib/dropdown_formfield.dart +++ b/lib/dropdown_formfield.dart @@ -38,7 +38,7 @@ class DropDownFormField extends FormField { builder: (FormFieldState state) { return Container( child: Column( - crossAxisAlignment: CrossAxisAlignment.start, + crossAxisAlignment: CrossAxisAlignment.end, children: [ InputDecorator( decoration: InputDecoration( From 7da9fc99f6f9811604d9edc87a710a496b10c43d Mon Sep 17 00:00:00 2001 From: Tahateber95 Date: Sat, 22 Jan 2022 23:18:41 +0100 Subject: [PATCH 2/5] Add text RTL UI custom styling --- .../ios/Flutter/flutter_export_environment.sh | 11 +-- example/lib/main.dart | 35 +++---- lib/dropdown_formfield.dart | 93 +++++++++++-------- 3 files changed, 80 insertions(+), 59 deletions(-) diff --git a/example/ios/Flutter/flutter_export_environment.sh b/example/ios/Flutter/flutter_export_environment.sh index 0b8846d..64b4f9f 100755 --- a/example/ios/Flutter/flutter_export_environment.sh +++ b/example/ios/Flutter/flutter_export_environment.sh @@ -1,14 +1,13 @@ #!/bin/sh # This is a generated file; do not edit or check into version control. -export "FLUTTER_ROOT=/Users/cetorres/flutter" -export "FLUTTER_APPLICATION_PATH=/Users/cetorres/Projects/dropdown_formfield/example" +export "FLUTTER_ROOT=C:\flutter" +export "FLUTTER_APPLICATION_PATH=C:\Users\tahateber\Desktop\Flutter_drop_downmenu\dropdown_formfield\example" export "COCOAPODS_PARALLEL_CODE_SIGN=true" -export "FLUTTER_TARGET=/Users/cetorres/Projects/dropdown_formfield/example/lib/main.dart" +export "FLUTTER_TARGET=lib\main.dart" export "FLUTTER_BUILD_DIR=build" export "FLUTTER_BUILD_NAME=1.0.0" export "FLUTTER_BUILD_NUMBER=1" -export "DART_DEFINES=Zmx1dHRlci5pbnNwZWN0b3Iuc3RydWN0dXJlZEVycm9ycz10cnVl,RkxVVFRFUl9XRUJfQVVUT19ERVRFQ1Q9dHJ1ZQ==" export "DART_OBFUSCATION=false" -export "TRACK_WIDGET_CREATION=true" +export "TRACK_WIDGET_CREATION=false" export "TREE_SHAKE_ICONS=false" -export "PACKAGE_CONFIG=/Users/cetorres/Projects/dropdown_formfield/example/.dart_tool/package_config.json" +export "PACKAGE_CONFIG=.packages" diff --git a/example/lib/main.dart b/example/lib/main.dart index 8abedd9..a05f731 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -52,10 +52,13 @@ class _MyHomePageState extends State { mainAxisAlignment: MainAxisAlignment.start, children: [ Container( + alignment: Alignment.centerRight, padding: EdgeInsets.all(16), child: DropDownFormField( - titleText: 'My workout', - hintText: 'Please choose one', + backgroundColor: Colors.grey.shade200, + textAlign: Alignment.centerRight, + titleText: 'الفئة الريسية', + hintText: 'اختر واحدة', value: _myActivity, onSaved: (value) { setState(() { @@ -69,32 +72,32 @@ class _MyHomePageState extends State { }, dataSource: [ { - "display": "Running", - "value": "Running", + "display": "واحد", + "value": "1", }, { - "display": "Climbing", - "value": "Climbing", + "display": "اثنان", + "value": "2", }, { - "display": "Walking", - "value": "Walking", + "display": "ثلاثة", + "value": "3", }, { - "display": "Swimming", - "value": "Swimming", + "display": "اربعة", + "value": "4", }, { - "display": "Soccer Practice", - "value": "Soccer Practice", + "display": "خمسة", + "value": "5", }, { - "display": "Baseball Practice", - "value": "Baseball Practice", + "display": "ستة", + "value": "6", }, { - "display": "Football Practice", - "value": "Football Practice", + "display": "سبعة", + "value": "7", }, ], textField: 'display', diff --git a/lib/dropdown_formfield.dart b/lib/dropdown_formfield.dart index e670258..7a12937 100644 --- a/lib/dropdown_formfield.dart +++ b/lib/dropdown_formfield.dart @@ -5,6 +5,8 @@ import 'package:flutter/material.dart'; class DropDownFormField extends FormField { final String titleText; final String hintText; + final AlignmentGeometry textAlign; + final Color backgroundColor; final bool required; final String errorText; final dynamic value; @@ -21,6 +23,8 @@ class DropDownFormField extends FormField { AutovalidateMode autovalidate = AutovalidateMode.disabled, this.titleText = 'Title', this.hintText = 'Select one option', + this.textAlign = Alignment.centerLeft, + this.backgroundColor = Colors.grey, this.required = false, this.errorText = 'Please select one option', this.value, @@ -36,46 +40,61 @@ class DropDownFormField extends FormField { autovalidateMode: autovalidate, initialValue: value == '' ? null : value, builder: (FormFieldState state) { - return Container( - child: Column( - crossAxisAlignment: CrossAxisAlignment.end, - children: [ - InputDecorator( - decoration: InputDecoration( - contentPadding: contentPadding, - labelText: titleText, - filled: filled, - ), - child: DropdownButtonHideUnderline( - child: DropdownButton( - isExpanded: true, - hint: Text( - hintText, - style: TextStyle(color: Colors.grey.shade500), + return ClipRRect( + borderRadius: BorderRadius.circular(15.0), + child: Container( + color: backgroundColor, + child: Padding( + padding: const EdgeInsets.all(8.0), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Container( + child: Text( + titleText, + style: TextStyle(color: Colors.grey.shade700), ), - value: value == '' ? null : value, - onChanged: (dynamic newValue) { - state.didChange(newValue); - onChanged(newValue); - }, - items: dataSource.map((item) { - return DropdownMenuItem( - value: item[valueField], - child: Text(item[textField], - overflow: TextOverflow.ellipsis), - ); - }).toList(), + alignment: textAlign, ), - ), - ), - SizedBox(height: state.hasError ? 5.0 : 0.0), - Text( - state.hasError ? state.errorText : '', - style: TextStyle( - color: Colors.redAccent.shade700, - fontSize: state.hasError ? 12.0 : 0.0), + Container( + child: DropdownButtonHideUnderline( + child: DropdownButton( + isExpanded: true, + hint: Container( + alignment: textAlign, + child: Text( + hintText, + style: TextStyle(color: Colors.grey.shade500), + ), + ), + value: value == '' ? null : value, + onChanged: (dynamic newValue) { + state.didChange(newValue); + onChanged(newValue); + }, + items: dataSource.map((item) { + return DropdownMenuItem( + value: item[valueField], + child: Container( + alignment: textAlign, + child: Text(item[textField], + overflow: TextOverflow.ellipsis), + ), + ); + }).toList(), + ), + ), + ), + SizedBox(height: state.hasError ? 5.0 : 0.0), + Text( + state.hasError ? state.errorText : '', + style: TextStyle( + color: Colors.redAccent.shade700, + fontSize: state.hasError ? 12.0 : 0.0), + ), + ], ), - ], + ), ), ); }, From 53e738e9fb4d826947ae20a9ee74e1dd7cd02d2e Mon Sep 17 00:00:00 2001 From: Tahateber95 Date: Sat, 22 Jan 2022 23:44:58 +0100 Subject: [PATCH 3/5] add textdirection rtl --- lib/dropdown_formfield.dart | 3 +++ 1 file changed, 3 insertions(+) diff --git a/lib/dropdown_formfield.dart b/lib/dropdown_formfield.dart index 7a12937..07c125a 100644 --- a/lib/dropdown_formfield.dart +++ b/lib/dropdown_formfield.dart @@ -51,6 +51,7 @@ class DropDownFormField extends FormField { children: [ Container( child: Text( + textDirection: TextDirection.rtl, titleText, style: TextStyle(color: Colors.grey.shade700), ), @@ -63,6 +64,7 @@ class DropDownFormField extends FormField { hint: Container( alignment: textAlign, child: Text( + textDirection: TextDirection.rtl, hintText, style: TextStyle(color: Colors.grey.shade500), ), @@ -78,6 +80,7 @@ class DropDownFormField extends FormField { child: Container( alignment: textAlign, child: Text(item[textField], + textDirection: TextDirection.rtl, overflow: TextOverflow.ellipsis), ), ); From 2e6080d8dcf8e79a67021c2f741697071ab5e490 Mon Sep 17 00:00:00 2001 From: Tahateber95 Date: Sun, 23 Jan 2022 01:14:20 +0100 Subject: [PATCH 4/5] UI restyle --- example/lib/main.dart | 21 ++++---- lib/dropdown_formfield.dart | 104 ++++++++++++++++++++---------------- 2 files changed, 70 insertions(+), 55 deletions(-) diff --git a/example/lib/main.dart b/example/lib/main.dart index a05f731..7c0748b 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -56,9 +56,10 @@ class _MyHomePageState extends State { padding: EdgeInsets.all(16), child: DropDownFormField( backgroundColor: Colors.grey.shade200, - textAlign: Alignment.centerRight, - titleText: 'الفئة الريسية', - hintText: 'اختر واحدة', + titleBackgroundColor: Colors.grey.shade300, + textAlign: Alignment.centerLeft, + titleText: 'Choose model', + hintText: 'Pick one', value: _myActivity, onSaved: (value) { setState(() { @@ -72,31 +73,31 @@ class _MyHomePageState extends State { }, dataSource: [ { - "display": "واحد", + "display": "one", "value": "1", }, { - "display": "اثنان", + "display": "two", "value": "2", }, { - "display": "ثلاثة", + "display": "three", "value": "3", }, { - "display": "اربعة", + "display": "four", "value": "4", }, { - "display": "خمسة", + "display": "five", "value": "5", }, { - "display": "ستة", + "display": "six", "value": "6", }, { - "display": "سبعة", + "display": "seven", "value": "7", }, ], diff --git a/lib/dropdown_formfield.dart b/lib/dropdown_formfield.dart index 07c125a..5d1c5ed 100644 --- a/lib/dropdown_formfield.dart +++ b/lib/dropdown_formfield.dart @@ -7,6 +7,7 @@ class DropDownFormField extends FormField { final String hintText; final AlignmentGeometry textAlign; final Color backgroundColor; + final Color titleBackgroundColor; final bool required; final String errorText; final dynamic value; @@ -15,26 +16,25 @@ class DropDownFormField extends FormField { final String valueField; final Function onChanged; final bool filled; - final EdgeInsets contentPadding; - DropDownFormField( - {FormFieldSetter onSaved, - FormFieldValidator validator, - AutovalidateMode autovalidate = AutovalidateMode.disabled, - this.titleText = 'Title', - this.hintText = 'Select one option', - this.textAlign = Alignment.centerLeft, - this.backgroundColor = Colors.grey, - this.required = false, - this.errorText = 'Please select one option', - this.value, - this.dataSource, - this.textField, - this.valueField, - this.onChanged, - this.filled = true, - this.contentPadding = const EdgeInsets.fromLTRB(12, 12, 8, 0)}) - : super( + DropDownFormField({ + FormFieldSetter onSaved, + FormFieldValidator validator, + AutovalidateMode autovalidate = AutovalidateMode.disabled, + this.titleText = 'Title', + this.hintText = 'Select one option', + this.textAlign = Alignment.centerLeft, + this.backgroundColor = Colors.white70, + this.titleBackgroundColor = Colors.white70, + this.required = false, + this.errorText = 'Please select one option', + this.value, + this.dataSource, + this.textField, + this.valueField, + this.onChanged, + this.filled = true, + }) : super( onSaved: onSaved, validator: validator, autovalidateMode: autovalidate, @@ -44,27 +44,37 @@ class DropDownFormField extends FormField { borderRadius: BorderRadius.circular(15.0), child: Container( color: backgroundColor, - child: Padding( - padding: const EdgeInsets.all(8.0), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Container( - child: Text( - textDirection: TextDirection.rtl, - titleText, - style: TextStyle(color: Colors.grey.shade700), - ), + child: Column( + mainAxisAlignment: MainAxisAlignment.start, + children: [ + ClipRRect( + borderRadius: BorderRadius.only( + topLeft: Radius.circular(15.0), + topRight: Radius.circular(15.0), + ), + child: Container( + color: titleBackgroundColor, + width: double.infinity, alignment: textAlign, + child: Padding( + padding: + const EdgeInsets.fromLTRB(15.0, 8.0, 15.0, 8.0), + child: Text( + titleText, + style: TextStyle(color: Colors.grey.shade700), + ), + ), ), - Container( - child: DropdownButtonHideUnderline( + ), + Container( + child: DropdownButtonHideUnderline( + child: Padding( + padding: const EdgeInsets.all(8.0), child: DropdownButton( isExpanded: true, hint: Container( alignment: textAlign, child: Text( - textDirection: TextDirection.rtl, hintText, style: TextStyle(color: Colors.grey.shade500), ), @@ -79,24 +89,28 @@ class DropDownFormField extends FormField { value: item[valueField], child: Container( alignment: textAlign, - child: Text(item[textField], - textDirection: TextDirection.rtl, - overflow: TextOverflow.ellipsis), + child: Padding( + padding: const EdgeInsets.fromLTRB( + 15.0, 8.0, 0, 8.0), + child: Text(item[textField], + textDirection: TextDirection.rtl, + overflow: TextOverflow.ellipsis), + ), ), ); }).toList(), ), ), ), - SizedBox(height: state.hasError ? 5.0 : 0.0), - Text( - state.hasError ? state.errorText : '', - style: TextStyle( - color: Colors.redAccent.shade700, - fontSize: state.hasError ? 12.0 : 0.0), - ), - ], - ), + ), + SizedBox(height: state.hasError ? 5.0 : 0.0), + Text( + state.hasError ? state.errorText : '', + style: TextStyle( + color: Colors.redAccent.shade700, + fontSize: state.hasError ? 12.0 : 0.0), + ), + ], ), ), ); From 0743a4edaee01ffeeb68aaf7c026a0c13ff68005 Mon Sep 17 00:00:00 2001 From: Tahateber95 Date: Sun, 6 Mar 2022 18:29:32 +0100 Subject: [PATCH 5/5] null safety migration --- example/pubspec.lock | 2 +- lib/dropdown_formfield.dart | 18 +++++++++--------- pubspec.lock | 2 +- pubspec.yaml | 3 +-- 4 files changed, 12 insertions(+), 13 deletions(-) diff --git a/example/pubspec.lock b/example/pubspec.lock index 080fbc7..7e1e0ff 100644 --- a/example/pubspec.lock +++ b/example/pubspec.lock @@ -157,4 +157,4 @@ packages: source: hosted version: "2.1.1" sdks: - dart: ">=2.14.0 <3.0.0" + dart: ">=2.15.0 <3.0.0" diff --git a/lib/dropdown_formfield.dart b/lib/dropdown_formfield.dart index 5d1c5ed..23fe0ac 100644 --- a/lib/dropdown_formfield.dart +++ b/lib/dropdown_formfield.dart @@ -11,15 +11,15 @@ class DropDownFormField extends FormField { final bool required; final String errorText; final dynamic value; - final List dataSource; - final String textField; - final String valueField; - final Function onChanged; + final List? dataSource; + final String? textField; + final String? valueField; + final Function? onChanged; final bool filled; DropDownFormField({ - FormFieldSetter onSaved, - FormFieldValidator validator, + FormFieldSetter? onSaved, + FormFieldValidator? validator, AutovalidateMode autovalidate = AutovalidateMode.disabled, this.titleText = 'Title', this.hintText = 'Select one option', @@ -82,9 +82,9 @@ class DropDownFormField extends FormField { value: value == '' ? null : value, onChanged: (dynamic newValue) { state.didChange(newValue); - onChanged(newValue); + onChanged!(newValue); }, - items: dataSource.map((item) { + items: dataSource!.map((item) { return DropdownMenuItem( value: item[valueField], child: Container( @@ -105,7 +105,7 @@ class DropDownFormField extends FormField { ), SizedBox(height: state.hasError ? 5.0 : 0.0), Text( - state.hasError ? state.errorText : '', + '', style: TextStyle( color: Colors.redAccent.shade700, fontSize: state.hasError ? 12.0 : 0.0), diff --git a/pubspec.lock b/pubspec.lock index 03307d6..5be8e9b 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -143,4 +143,4 @@ packages: source: hosted version: "2.1.1" sdks: - dart: ">=2.14.0 <3.0.0" + dart: ">=2.15.0 <3.0.0" diff --git a/pubspec.yaml b/pubspec.yaml index 9c740a2..b8aa4e8 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,11 +1,10 @@ name: dropdown_formfield description: A dropdown form field using a dropdown button inside a form field. version: 0.1.4 -author: Carlos E. Torres homepage: https://github.com/cetorres/dropdown_formfield environment: - sdk: ">=2.1.0 <3.0.0" + sdk: ">=2.15.0 <3.0.0" dependencies: flutter: