diff --git a/covas_mobile/lib/pages/ListItemMenu.dart b/covas_mobile/lib/pages/ListItemMenu.dart index 3614d9c..512bc18 100644 --- a/covas_mobile/lib/pages/ListItemMenu.dart +++ b/covas_mobile/lib/pages/ListItemMenu.dart @@ -14,6 +14,7 @@ import '../variable/globals.dart' as globals; import 'package:permission_handler/permission_handler.dart'; import "Camera.dart"; import 'package:camera/camera.dart'; +import 'package:textfield_tags/textfield_tags.dart'; void main() { initializeDateFormatting("fr_FR", null).then((_) => runApp(const MyApp())); @@ -50,6 +51,7 @@ class _MyHomePageState extends State { TextEditingController startDatepicker = TextEditingController(); TextEditingController endDatepicker = TextEditingController(); TextEditingController inputItem = TextEditingController(); + final _stringTagController = StringTagController(); bool showDateFields = false; // State to toggle date fields bool showArrow = true; @@ -533,6 +535,91 @@ class _MyHomePageState extends State { ); } + TextFieldTags _buildTagsField() { + return TextFieldTags( + textfieldTagsController: _stringTagController, + initialTags: [], + textSeparators: const [' ', ','], + validator: (String tag) { + if (_stringTagController.getTags!.contains(tag)) { + return 'Tu as deja rentre ce tag'; + } + return null; + }, + inputFieldBuilder: (context, inputFieldValues) { + return Padding( + padding: const EdgeInsets.all(8.0), + child: TextField( + controller: inputFieldValues.textEditingController, + focusNode: inputFieldValues.focusNode, + onChanged: inputFieldValues.onTagChanged, + onSubmitted: inputFieldValues.onTagSubmitted, + decoration: InputDecoration( + border: OutlineInputBorder(), + labelText: 'Tags', + hintText: + inputFieldValues.tags.isNotEmpty ? '' : "Enter tag...", + errorText: inputFieldValues.error, + prefixIcon: inputFieldValues.tags.isNotEmpty + ? SingleChildScrollView( + controller: inputFieldValues.tagScrollController, + scrollDirection: Axis.vertical, + child: Padding( + padding: const EdgeInsets.all(8.0), + child: Wrap( + runSpacing: 4.0, + spacing: 4.0, + children: inputFieldValues.tags.map((String tag) { + return Container( + decoration: const BoxDecoration( + borderRadius: BorderRadius.all( + Radius.circular(20.0), + ), + color: Colors.blue, + ), + margin: const EdgeInsets.symmetric( + horizontal: 5.0), + padding: const EdgeInsets.symmetric( + horizontal: 10.0, vertical: 5.0), + child: Row( + mainAxisAlignment: MainAxisAlignment.start, + mainAxisSize: MainAxisSize.min, + children: [ + InkWell( + child: Text( + '$tag', + style: const TextStyle( + color: Colors.white), + ), + onTap: () { + //print("$tag selected"); + }, + ), + const SizedBox(width: 4.0), + InkWell( + child: const Icon( + Icons.cancel, + size: 14.0, + color: Color.fromARGB( + 255, 233, 233, 233), + ), + onTap: () { + inputFieldValues.onTagRemoved(tag); + }, + ) + ], + ), + ); + }).toList()), + ), + ) + : null, + ), + ), + ); + }); + } + Padding _buildItemZoneSearchField() { return Padding( padding: const EdgeInsets.all(8.0), @@ -633,6 +720,7 @@ class _MyHomePageState extends State { Flexible(child: _buildDateField("start")), Flexible(child: _buildDateField("end")) ]), + if ((showDateFields) && (showArrow)) _buildTagsField(), if (showDateFields) _buildGeographicalZoneSearchField(), if (showArrow) IconButton(