From 025077bee7995162b8ebbf31821f2b043a4f176c Mon Sep 17 00:00:00 2001 From: Yan Maniez Date: Wed, 26 Feb 2020 17:20:09 +0100 Subject: [PATCH] Range filter --- aidedejeu_flutter/lib/filterWidgets.dart | 40 +++++ aidedejeu_flutter/lib/main.dart | 184 ++++++++++------------- aidedejeu_flutter/lib/models/items.dart | 48 +++--- 3 files changed, 151 insertions(+), 121 deletions(-) create mode 100644 aidedejeu_flutter/lib/filterWidgets.dart diff --git a/aidedejeu_flutter/lib/filterWidgets.dart b/aidedejeu_flutter/lib/filterWidgets.dart new file mode 100644 index 00000000..26936927 --- /dev/null +++ b/aidedejeu_flutter/lib/filterWidgets.dart @@ -0,0 +1,40 @@ +import 'package:aidedejeu_flutter/models/items.dart'; +import 'package:flutter/cupertino.dart'; +import 'package:flutter/material.dart'; + +class RangeFilter extends StatefulWidget { + Filter filter; + + RangeFilter({@required this.filter}); + + @override + State createState() { + // TODO: implement createState + return _RangeFilter(filter: filter); + } +} + +class _RangeFilter extends State { + Filter filter; + RangeValues rangeValues; + _RangeFilter({@required this.filter}) { + rangeValues = RangeValues(0, filter.values.length.toDouble() - 1); + } + + @override + Widget build(BuildContext context) { + + return RangeSlider( + min: 0, + max: filter.values.length.toDouble() - 1, + divisions: filter.values.length, + labels: RangeLabels( + '${filter.values[rangeValues.start.round()]}', '${filter.values[rangeValues.end.round()]}'), + values: rangeValues ?? RangeValues(0, filter.values.length.toDouble() - 1), + onChanged: (RangeValues values) { + setState(() { + rangeValues = values; + }); + }); + } +} \ No newline at end of file diff --git a/aidedejeu_flutter/lib/main.dart b/aidedejeu_flutter/lib/main.dart index 94f114bf..b711698d 100644 --- a/aidedejeu_flutter/lib/main.dart +++ b/aidedejeu_flutter/lib/main.dart @@ -1,4 +1,5 @@ import 'package:aidedejeu_flutter/database.dart'; +import 'package:aidedejeu_flutter/filterWidgets.dart'; import 'package:aidedejeu_flutter/models/items.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; @@ -160,6 +161,64 @@ class _MyHomePageState extends State { ]; } + List buildFilterChipList(List choices) { + return choices + .map((choice) => Padding( + padding: const EdgeInsets.all(4.0), + child: FilterChip( + label: Text(choice), + backgroundColor: Colors.transparent, + shape: StadiumBorder(side: BorderSide()), + onSelected: (bool value) { + print("selected"); + }, + ))) + .toList(); + } + + Widget buildChoiceFilter(Filter filter) { + return Wrap(children: buildFilterChipList(filter.values)); + } + + Widget buildRangeFilter(Filter filter) { + /*return RangeSlider( + min: 0, + max: 1.0 * filter.values.length, + divisions: filter.values.length, + labels: RangeLabels( + 'début ${filter.values.first}', 'fin ${filter.values.last}'), + values: RangeValues(0, 1.0 * filter.values.length), + onChanged: (RangeValues value) {});*/ + return RangeFilter(filter: filter); + } + + Widget buildFilter(Filter filter) { + return Column(children: [ + Divider( + color: Colors.blueGrey, + height: 10.0, + ), + Align( + alignment: Alignment.centerLeft, + child: Padding( + padding: const EdgeInsets.all(8.0), + child: Text(filter.name), + ), + ), + Container( + child: filter.type == FilterType.Choices + ? buildChoiceFilter(filter) + : buildRangeFilter(filter)) + ]); + } + + List buildFilterList() { + return (item as FilteredItems) + .toFilterList() + .map((filter) => buildFilter(filter)) + .toList(); + } + int indexPage = 0; @override @@ -191,110 +250,33 @@ class _MyHomePageState extends State { }, items: buildBottomNavigationBarItems(), ), - endDrawer: item is FilteredItems ? Drawer( - child: ListView( - // Important: Remove any padding from the ListView. - padding: EdgeInsets.zero, - children: (item as FilteredItems).toFilterMap().entries.map( - (filter) => - //ListTile(title: Text(filter.key)) - Container( - child: Wrap( - children: filter.value.toString().split("|").map( - (choice) => - FilterChip( - label: Text(choice), - backgroundColor: Colors.transparent, - shape: StadiumBorder(side: BorderSide()), - onSelected: (bool value) { - print("selected"); - }, - ) - ).toList()/* [ - FilterChip( - label: Text("truc"), - backgroundColor: Colors.transparent, - shape: StadiumBorder(side: BorderSide()), - onSelected: (bool value) { - print("selected"); - }, - ), - FilterChip( - label: Text("truc"), - backgroundColor: Colors.transparent, - shape: StadiumBorder(side: BorderSide()), - onSelected: (bool value) { - print("selected"); - }, - ), - ],*/ - ), - + endDrawer: item is FilteredItems + ? Drawer( + child: ListView( + // Important: Remove any padding from the ListView. + padding: EdgeInsets.zero, + children: buildFilterList()), ) - ).toList() - /*[ - - DrawerHeader( - child: Text('Drawer Header'), - decoration: BoxDecoration( - color: Colors.blue, - ), - ), - ListTile( - title: Text('Item 1'), - onTap: () { - // Update the state of the app. - // ... - }, - ), - ListTile( - title: Text('Item 2'), - onTap: () { - // Update the state of the app. - // ... - }, - ), - Container( - child: Wrap( - children: [ - FilterChip( - label: Text("truc"), - backgroundColor: Colors.transparent, - shape: StadiumBorder(side: BorderSide()), - onSelected: (bool value) { - print("selected"); - }, - ), - FilterChip( - label: Text("truc"), - backgroundColor: Colors.transparent, - shape: StadiumBorder(side: BorderSide()), - onSelected: (bool value) { - print("selected"); - }, - ), - ], - ), - ), - ],*/ - ), - ) : null, + : null, appBar: AppBar( title: Text(widget.id), - actions: item is FilteredItems ? [ - Builder( - builder: (context) => IconButton( - icon: SvgPicture.asset( - "assets/funnel.svg", - height: 30.0, - width: 30.0, - allowDrawingOutsideViewBox: true, - ), //Icon(Icons.filter), - onPressed: () => Scaffold.of(context).openEndDrawer(), - tooltip: MaterialLocalizations.of(context).openAppDrawerTooltip, - ), - ), - ] : null, + actions: item is FilteredItems + ? [ + Builder( + builder: (context) => IconButton( + icon: SvgPicture.asset( + "assets/funnel.svg", + height: 30.0, + width: 30.0, + allowDrawingOutsideViewBox: true, + ), //Icon(Icons.filter), + onPressed: () => Scaffold.of(context).openEndDrawer(), + tooltip: + MaterialLocalizations.of(context).openAppDrawerTooltip, + ), + ), + ] + : null, ), ); } diff --git a/aidedejeu_flutter/lib/models/items.dart b/aidedejeu_flutter/lib/models/items.dart index 72d614e6..76e5e62e 100644 --- a/aidedejeu_flutter/lib/models/items.dart +++ b/aidedejeu_flutter/lib/models/items.dart @@ -109,7 +109,7 @@ class Items extends Item { } } -class FilteredItems extends Items { +abstract class FilteredItems extends Items { String Family; FilteredItems.fromMap(Map map) @@ -117,36 +117,44 @@ class FilteredItems extends Items { this.Family = map["Family"]; } - Map toFilterMap() { + List toFilterList(); +} - } +enum FilterType { + Choices, Range +} +class Filter { + String name; + FilterType type; + List values; + Filter({this.name, this.type, this.values}); } class MonsterItems extends FilteredItems { - String Types; - String Challenges; - String Sizes; - String Sources; - String Terrains; + Filter types; + Filter challenges; + Filter sizes; + Filter sources; + Filter terrains; MonsterItems.fromMap(Map map) : super.fromMap(map) { - this.Types = map["Types"]; - this.Challenges = map["Challenges"]; - this.Sizes = map["Sizes"]; - this.Sources = map["Sources"]; - this.Terrains = map["Terrains"]; + this.types = Filter(name: "Type", type: FilterType.Choices, values: map["Types"].toString().split("|")); + this.challenges = Filter(name: "Dangerosité", type: FilterType.Range, values: map["Challenges"].toString().split("|")); + this.sizes = Filter(name: "Taille", type: FilterType.Range, values: map["Sizes"].toString().split("|"));; + this.sources = Filter(name: "Source", type: FilterType.Choices, values: map["Sources"].toString().split("|")); + this.terrains = Filter(name: "Terrain", type: FilterType.Choices, values: map["Terrains"].toString().split("|")); } // Map toMap() => { //"Id": Id, - Map toFilterMap() => { - "Types": Types, - "Challenges": Challenges, - "Sizes": Sizes, - "Sources": Sources, - "Terrains": Terrains, - }; + List toFilterList() => { + types, + challenges, + sizes, + sources, + terrains, + }.toList(); }