Skip to content

Commit

Permalink
Merge pull request #8 from DannyStrelok/master
Browse files Browse the repository at this point in the history 
✨ New arguments to customize button text and "Selected items" text
  • Loading branch information
@TheAlphamerc
TheAlphamerc committed May 11, 2021
2 parents 8457706 + d6ee2ab commit 38e4d44
Show file tree
Hide file tree
Showing 4 changed files with 187 additions and 99 deletions.
8 changes: 8 additions & 0 deletions README.md
View file
Expand Up @@ -268,6 +268,14 @@ Customised control button |Customised selected text |Customised unselected text
| onItemSearch|`List<T> Function(List<T>? list, String text)`| Perform search operation and returns filtered list|
| choiceChipBuilder|`Widget Function(BuildContext context, T? item, bool? iselected)`|The choiceChipBuilder is a builder to design custom choice chip.|
| onApplyButtonClick|`Function(List<T> list)`|Returns list of items when apply button is clicked|
| ValidateRemoveItem|`List<T> Function(List<T>? list, T item)`| Return the list of items filtered by the user logic |
| applyButtonText|`String`| Apply button text to customize or translate |
| resetButtonText|`String`| Reset button text to customize or translate |
| allButtonText|`String`| All button text to customize or translate |
| selectedItemsText|`String`| Selected items text to customize or translate |
| controlContainerDecoration|`BoxDecoration`| Customize the bottom area of the dialog, where the buttons are placed |
| buttonRadius|`double`| Button border radius |
| buttonSpacing|`double`| Space between bottom control buttons |

> `T` can be a String or any user defined Model
Expand Down
32 changes: 32 additions & 0 deletions lib/src/filter_list_dialog.dart
View file
Expand Up @@ -101,6 +101,9 @@ class FilterListDialog {
/// identifies weather a item is selecte or not.
required ValidateSelectedItem<T> validateSelectedItem,

/// The `validateRemoveItem` identifies if a item should be remove or not and returns the list filtered.
ValidateRemoveItem<T>? validateRemoveItem,

/// filter list on the basis of search field text.
/// When text change in search text field then return list containing that text value.
///
Expand Down Expand Up @@ -184,6 +187,27 @@ class FilterListDialog {
/// TextStyle for search field text.
TextStyle? searchFieldTextStyle,

/// Apply Button Label
String? applyButtonText = 'Apply',

/// Reset Button Label
String? resetButtonText = 'Reset',

/// All Button Label
String? allButtonText = 'All',

/// Selected items count text
String? selectedItemsText = 'selected items',

/// Control container box decoration
BoxDecoration? controlContainerDecoration,

/// Button radius
double? buttonRadius,

/// Spacing between control buttons
double? buttonSpacing,

/// The `choiceChipBuilder` is a builder to design custom choice chip.
ChoiceChipBuilder? choiceChipBuilder}) async {
if (height == null) {
Expand Down Expand Up @@ -235,6 +259,14 @@ class FilterListDialog {
enableOnlySingleSelection: enableOnlySingleSelection,
searchFieldBackgroundColor: searchFieldBackgroundColor,
applyButonTextBackgroundColor: applyButonTextBackgroundColor,
selectedItemsText: selectedItemsText,
applyButtonText: applyButtonText,
resetButtonText: resetButtonText,
allButtonText: allButtonText,
buttonRadius: buttonRadius,
controlContainerDecoration: controlContainerDecoration,
buttonSpacing: buttonSpacing,
validateRemoveItem: validateRemoveItem,
),
),
);
Expand Down
244 changes: 146 additions & 98 deletions lib/src/filter_list_widget.dart
View file
Expand Up @@ -6,6 +6,7 @@ typedef ChoiceChipBuilder<T> = Widget Function(
BuildContext context, T? item, bool? iselected);
typedef ItemSearchDelegate<T> = List<T> Function(List<T>? list, String text);
typedef LabelDelegate<T> = String? Function(T?);
typedef ValidateRemoveItem<T> = List<T> Function(List<T>? list, T item);

/// The [FilterListWidget] is a widget with some filter utilities and callbacks which helps in single/multiple selection from list of data.
///
Expand Down Expand Up @@ -47,40 +48,58 @@ typedef LabelDelegate<T> = String? Function(T?);
/// )
/// ```
class FilterListWidget<T> extends StatefulWidget {
const FilterListWidget({
Key? key,
this.height,
this.width,
this.listData,
required this.validateSelectedItem,
required this.choiceChipLabel,
required this.onItemSearch,
this.selectedListData,
this.borderRadius = 20,
this.onApplyButtonClick,
this.choiceChipBuilder,
this.selectedChipTextStyle,
this.unselectedChipTextStyle,
this.controlButtonTextStyle,
this.applyButtonTextStyle,
this.headerTextStyle,
this.searchFieldTextStyle,
this.headlineText = "Select",
this.searchFieldHintText = "Search here",
this.hideSelectedTextCount = false,
this.hideSearchField = false,
this.hideCloseIcon = true,
this.hideHeader = false,
this.hideHeaderText = false,
this.closeIconColor = Colors.black,
this.headerTextColor = Colors.black,
this.applyButonTextBackgroundColor = Colors.blue,
this.backgroundColor = Colors.white,
this.searchFieldBackgroundColor = const Color(0xfff5f5f5),
this.selectedTextBackgroundColor = Colors.blue,
this.unselectedTextbackGroundColor = const Color(0xfff8f8f8),
this.enableOnlySingleSelection = false,
}) : super(key: key);
const FilterListWidget(
{Key? key,
this.height,
this.width,
this.listData,
required this.validateSelectedItem,
this.validateRemoveItem,
required this.choiceChipLabel,
required this.onItemSearch,
this.selectedListData,
this.borderRadius = 20,
this.onApplyButtonClick,
this.choiceChipBuilder,
this.selectedChipTextStyle,
this.unselectedChipTextStyle,
this.controlButtonTextStyle,
this.applyButtonTextStyle,
this.headerTextStyle,
this.searchFieldTextStyle,
this.headlineText = "Select",
this.searchFieldHintText = "Search here",
this.hideSelectedTextCount = false,
this.hideSearchField = false,
this.hideCloseIcon = true,
this.hideHeader = false,
this.hideHeaderText = false,
this.closeIconColor = Colors.black,
this.headerTextColor = Colors.black,
this.applyButonTextBackgroundColor = Colors.blue,
this.backgroundColor = Colors.white,
this.searchFieldBackgroundColor = const Color(0xfff5f5f5),
this.selectedTextBackgroundColor = Colors.blue,
this.unselectedTextbackGroundColor = const Color(0xfff8f8f8),
this.enableOnlySingleSelection = false,
this.allButtonText = 'All',
this.applyButtonText = 'Apply',
this.resetButtonText = 'Reset',
this.selectedItemsText = 'selected items',
this.controlContainerDecoration = const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.all(Radius.circular(25)),
boxShadow: <BoxShadow>[
BoxShadow(
offset: Offset(0, 5),
blurRadius: 15,
color: Color(0x12000000),
)
],
),
this.buttonRadius,
this.buttonSpacing})
: super(key: key);
final double? height;
final double? width;
final double borderRadius;
Expand Down Expand Up @@ -143,6 +162,9 @@ class FilterListWidget<T> extends StatefulWidget {
/// The `validateSelectedItem` dentifies weather a item is selecte or not.
final ValidateSelectedItem<T> validateSelectedItem; /*required*/

/// The `validateRemoveItem` identifies if a item should be remove or not and returns the list filtered.
final ValidateRemoveItem<T>? validateRemoveItem;

/// The `onItemSearch` is delagate which filter the list on the basis of search field text.
final ItemSearchDelegate<T> onItemSearch; /*required*/

Expand All @@ -152,6 +174,27 @@ class FilterListWidget<T> extends StatefulWidget {
/// The `choiceChipBuilder` is a builder to design custom choice chip.
final ChoiceChipBuilder? choiceChipBuilder;

/// Apply Button Label
final String? applyButtonText;

/// Reset Button Label
final String? resetButtonText;

/// All Button Label
final String? allButtonText;

/// Selected items count text
final String? selectedItemsText;

/// Control button actions container styling
final BoxDecoration? controlContainerDecoration;

/// Control button radius
final double? buttonRadius;

/// Spacing between control buttons
final double? buttonSpacing;

@override
_FilterListWidgetState<T> createState() => _FilterListWidgetState<T>();
}
Expand Down Expand Up @@ -183,7 +226,7 @@ class _FilterListWidgetState<T> extends State<FilterListWidget<T>> {
: Padding(
padding: EdgeInsets.only(top: 5),
child: Text(
'${_selectedListData.length} selected items',
'${_selectedListData.length} ${widget.selectedItemsText}',
style: Theme.of(context).textTheme.caption,
),
),
Expand Down Expand Up @@ -311,9 +354,18 @@ class _FilterListWidgetState<T> extends State<FilterListWidget<T>> {
_selectedListData.clear();
_selectedListData.add(item);
} else {
selectedText
? _selectedListData.remove(item)
: _selectedListData.add(item);
print(selectedText);
if(selectedText) {
if(widget.validateRemoveItem != null) {
var shouldDelete = widget.validateRemoveItem!(_selectedListData, item);
_selectedListData = shouldDelete;
} else {
_selectedListData.remove(item);
}
} else {
_selectedListData.add(item);
}

}
},
);
Expand All @@ -337,17 +389,17 @@ class _FilterListWidgetState<T> extends State<FilterListWidget<T>> {
return choices;
}

Widget _controlButton({
required String choiceChipLabel,
Function? onPressed,
Color backgroundColor = Colors.transparent,
double elevation = 0,
TextStyle? textStyle,
}) {
Widget _controlButton(
{required String choiceChipLabel,
Function? onPressed,
Color backgroundColor = Colors.transparent,
double elevation = 0,
TextStyle? textStyle,
double? radius}) {
return TextButton(
style: ButtonStyle(
shape: MaterialStateProperty.all(RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(25)),
borderRadius: BorderRadius.all(Radius.circular(radius ?? 25)),
)),
backgroundColor: MaterialStateProperty.all(backgroundColor),
elevation: MaterialStateProperty.all(elevation),
Expand All @@ -372,67 +424,63 @@ class _FilterListWidgetState<T> extends State<FilterListWidget<T>> {
margin: EdgeInsets.symmetric(horizontal: 10, vertical: 10),
alignment: Alignment.center,
child: Container(
decoration: BoxDecoration(
color: widget.backgroundColor,
borderRadius: BorderRadius.all(Radius.circular(25)),
boxShadow: <BoxShadow>[
BoxShadow(
offset: Offset(0, 5),
blurRadius: 15,
color: Color(0x12000000),
)
],
),
decoration: widget.controlContainerDecoration,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
_controlButton(
choiceChipLabel: "All",
onPressed: widget.enableOnlySingleSelection!
? null
: () {
setState(() {
_selectedListData = List.from(_listData!);
});
},
// textColor:
textStyle: widget.controlButtonTextStyle ??
Theme.of(context).textTheme.bodyText2!.copyWith(
fontSize: 20,
color: widget.enableOnlySingleSelection!
? Theme.of(context).dividerColor
: Theme.of(context).primaryColor),
choiceChipLabel: '${widget.allButtonText}',
onPressed: widget.enableOnlySingleSelection!
? null
: () {
setState(() {
_selectedListData = List.from(_listData!);
});
},
// textColor:
textStyle: widget.controlButtonTextStyle ??
Theme.of(context).textTheme.bodyText2!.copyWith(
fontSize: 20,
color: widget.enableOnlySingleSelection!
? Theme.of(context).dividerColor
: Theme.of(context).primaryColor),
radius: widget.buttonRadius),
SizedBox(
width: widget.buttonSpacing ?? 0,
),
_controlButton(
choiceChipLabel: "Reset",
onPressed: () {
setState(() {
_selectedListData.clear();
});
},
textStyle: widget.controlButtonTextStyle ??
Theme.of(context).textTheme.bodyText2!.copyWith(
fontSize: 20, color: Theme.of(context).primaryColor),
choiceChipLabel: '${widget.resetButtonText}',
onPressed: () {
setState(() {
_selectedListData.clear();
});
},
textStyle: widget.controlButtonTextStyle ??
Theme.of(context).textTheme.bodyText2!.copyWith(
fontSize: 20, color: Theme.of(context).primaryColor),
radius: widget.buttonRadius),
SizedBox(
width: widget.buttonSpacing ?? 0,
),
_controlButton(
choiceChipLabel: "Apply",
onPressed: () {
if (widget.onApplyButtonClick != null) {
widget.onApplyButtonClick!(_selectedListData);
} else {
Navigator.pop(context, _selectedListData);
}
},
elevation: 5,
backgroundColor: widget.applyButonTextBackgroundColor!,
textStyle: widget.applyButtonTextStyle ??
Theme.of(context).textTheme.bodyText2!.copyWith(
fontSize: 20,
color: widget.enableOnlySingleSelection!
? Theme.of(context).dividerColor
: Theme.of(context).buttonColor),
),
choiceChipLabel: '${widget.applyButtonText}',
onPressed: () {
if (widget.onApplyButtonClick != null) {
widget.onApplyButtonClick!(_selectedListData);
} else {
Navigator.pop(context, _selectedListData);
}
},
elevation: 5,
backgroundColor: widget.applyButonTextBackgroundColor!,
textStyle: widget.applyButtonTextStyle ??
Theme.of(context).textTheme.bodyText2!.copyWith(
fontSize: 20,
color: widget.enableOnlySingleSelection!
? Theme.of(context).dividerColor
: Theme.of(context).buttonColor),
radius: widget.buttonRadius),
],
),
),
Expand Down
2 changes: 1 addition & 1 deletion pubspec.yaml
View file
@@ -1,6 +1,6 @@
name: filter_list
description: Filter_list Package is designed to make single/multiple item selection from a list of string/object.
version: 0.0.9
version: 0.0.10
homepage: https://github.com/TheAlphamerc/flutter_plugin_filter_list

environment:
Expand Down

0 comments on commit 38e4d44

Please sign in to comment.