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

Features update #2

Open
wants to merge 6 commits into
base: master
Choose a base branch
from
Open

Features update #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
77b2b57
Ability to add `Any` option
salman-amjad May 16, 2019
2a51565
Can specify custom `InputDecoration`
salman-amjad May 16, 2019
a440cc2
Ability to remove options without opening the dialog
salman-amjad May 16, 2019
0bd754e
Merge branch 'master' into features-update
salman-amjad Sep 22, 2020
fde90ac
Typing changed to List
salman-amjad Sep 26, 2020
37200e7
Example updated with "Any" option implementation
salman-amjad Sep 26, 2020
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
113 changes: 82 additions & 31 deletions example/lib/main.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,14 +19,48 @@ class MyHomePage extends StatefulWidget {

class _MyHomePageState extends State<MyHomePage> {
List _myActivities;
List _myActivitiesWithAny;
String _myActivitiesResult;
String _myActivitiesWithAnyResult;
List dataSource = [
{
"display": "Running",
"value": "Running",
},
{
"display": "Climbing",
"value": "Climbing",
},
{
"display": "Walking",
"value": "Walking",
},
{
"display": "Swimming",
"value": "Swimming",
},
{
"display": "Soccer Practice",
"value": "Soccer Practice",
},
{
"display": "Baseball Practice",
"value": "Baseball Practice",
},
{
"display": "Football Practice",
"value": "Football Practice",
},
];
final formKey = new GlobalKey<FormState>();

@override
void initState() {
super.initState();
_myActivities = [];
_myActivitiesWithAny = ["Running", "Swimming"];
_myActivitiesResult = '';
_myActivitiesWithAnyResult = '';
}

_saveForm() {
Expand All @@ -35,6 +69,7 @@ class _MyHomePageState extends State<MyHomePage> {
form.save();
setState(() {
_myActivitiesResult = _myActivities.toString();
_myActivitiesWithAnyResult = _myActivitiesWithAny.toString();
});
}
}
Expand Down Expand Up @@ -72,42 +107,14 @@ class _MyHomePageState extends State<MyHomePage> {
}
return null;
},
dataSource: [
{
"display": "Running",
"value": "Running",
},
{
"display": "Climbing",
"value": "Climbing",
},
{
"display": "Walking",
"value": "Walking",
},
{
"display": "Swimming",
"value": "Swimming",
},
{
"display": "Soccer Practice",
"value": "Soccer Practice",
},
{
"display": "Baseball Practice",
"value": "Baseball Practice",
},
{
"display": "Football Practice",
"value": "Football Practice",
},
],
dataSource: dataSource,
textField: 'display',
valueField: 'value',
okButtonLabel: 'OK',
cancelButtonLabel: 'CANCEL',
hintWidget: Text('Please choose one or more'),
initialValue: _myActivities,
value: _myActivities,
onSaved: (value) {
if (value == null) return;
setState(() {
Expand All @@ -116,6 +123,45 @@ class _MyHomePageState extends State<MyHomePage> {
},
),
),
Container(
padding: EdgeInsets.all(16),
child: MultiSelectFormField(
autovalidate: false,
chipBackGroundColor: Colors.red,
chipLabelStyle: TextStyle(fontWeight: FontWeight.bold),
dialogTextStyle: TextStyle(fontWeight: FontWeight.bold),
checkBoxActiveColor: Colors.red,
checkBoxCheckColor: Colors.green,
dialogShapeBorder: RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(12.0))),
title: Text(
"My workouts with Any",
style: TextStyle(fontSize: 16),
),
validator: (value) {
if (value == null || value.length == 0) {
return 'Please select one or more options';
}
return null;
},
dataSource: dataSource,
textField: 'display',
valueField: 'value',
okButtonLabel: 'OK',
cancelButtonLabel: 'CANCEL',
hintWidget: Text('Please choose one or more'),
initialValue: _myActivitiesWithAny,
value: _myActivitiesWithAny,
addAnyOption: true,
optionsDeletable: true,
onSaved: (value) {
if (value == null) return;
setState(() {
_myActivitiesWithAny = value;
});
},
),
),
Container(
padding: EdgeInsets.all(8),
child: RaisedButton(
Expand All @@ -125,7 +171,12 @@ class _MyHomePageState extends State<MyHomePage> {
),
Container(
padding: EdgeInsets.all(16),
child: Text(_myActivitiesResult),
child: Column(
children: [
Text(_myActivitiesResult),
Text(_myActivitiesWithAnyResult),
],
),
)
],
),
Expand Down
40 changes: 27 additions & 13 deletions lib/multiselect_dialog.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,14 +1,15 @@
import 'package:flutter/material.dart';

class MultiSelectDialogItem<V> {
class MultiSelectDialogItem {
static const ANY = 'any';
const MultiSelectDialogItem(this.value, this.label);

final V value;
final dynamic value;
final String label;
}

class MultiSelectDialog<V> extends StatefulWidget {
final List<MultiSelectDialogItem<V>> items;
final List<MultiSelectDialogItem> items;
final List<V> initialSelectedValues;
final Widget title;
final String okButtonLabel;
Expand All @@ -17,6 +18,7 @@ class MultiSelectDialog<V> extends StatefulWidget {
final ShapeBorder dialogShapeBorder;
final Color checkBoxCheckColor;
final Color checkBoxActiveColor;
final bool addAnyOption;

MultiSelectDialog(
{Key key,
Expand All @@ -28,15 +30,16 @@ class MultiSelectDialog<V> extends StatefulWidget {
this.labelStyle = const TextStyle(),
this.dialogShapeBorder,
this.checkBoxActiveColor,
this.checkBoxCheckColor})
this.checkBoxCheckColor,
this.addAnyOption})
: super(key: key);

@override
State<StatefulWidget> createState() => _MultiSelectDialogState<V>();
}

class _MultiSelectDialogState<V> extends State<MultiSelectDialog<V>> {
final _selectedValues = List<V>();
final List<V> _selectedValues = List<V>();

void initState() {
super.initState();
Expand All @@ -45,13 +48,23 @@ class _MultiSelectDialogState<V> extends State<MultiSelectDialog<V>> {
}
}

void _onItemCheckedChange(V itemValue, bool checked) {
void _onItemCheckedChange(dynamic itemValue, bool checked) {
if (itemValue == MultiSelectDialogItem.ANY) {
this._resetOptions();
} else {
setState(() {
if (checked) {
_selectedValues.add(itemValue);
} else {
_selectedValues.remove(itemValue);
}
});
}
}

void _resetOptions({selected = true, reset = false}) {
setState(() {
if (checked) {
_selectedValues.add(itemValue);
} else {
_selectedValues.remove(itemValue);
}
_selectedValues.clear();
});
}

Expand Down Expand Up @@ -90,8 +103,9 @@ class _MultiSelectDialogState<V> extends State<MultiSelectDialog<V>> {
);
}

Widget _buildItem(MultiSelectDialogItem<V> item) {
final checked = _selectedValues.contains(item.value);
Widget _buildItem(MultiSelectDialogItem item) {
bool checked = _selectedValues.contains(item.value);
if (item.value == MultiSelectDialogItem.ANY && _selectedValues.isEmpty) checked = true;
return CheckboxListTile(
value: checked,
checkColor: widget.checkBoxCheckColor,
Expand Down
Loading