Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/dab246/super_tag_editor
A simple tag editor for inputing tags in Flutter.
https://github.com/dab246/super_tag_editor
dart flutter
Last synced: 2 days ago
JSON representation
A simple tag editor for inputing tags in Flutter.
- Host: GitHub
- URL: https://github.com/dab246/super_tag_editor
- Owner: dab246
- License: mit
- Created: 2022-07-11T09:14:46.000Z (over 2 years ago)
- Default Branch: master
- Last Pushed: 2024-07-15T04:07:01.000Z (4 months ago)
- Last Synced: 2024-10-27T22:20:19.997Z (14 days ago)
- Topics: dart, flutter
- Language: Dart
- Homepage: https://pub.dev/packages/super_tag_editor
- Size: 113 KB
- Stars: 14
- Watchers: 2
- Forks: 14
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Super Tag Editor
A simple tag editor for inputting tags in Flutter.
### Enhance:
- Suggestion box
- Validation
## Usage
Add the package to pubspec.yaml
```dart
dependencies:
super_tag_editor: x.x.x
```
Import it
```dart
import 'package:super_tag_editor/tag_editor.dart';
```
Use the widget
```dart
TagEditor(
length: values.length,
delimiters: [',', ' '],
hasAddButton: true,
inputDecoration: const InputDecoration(
border: InputBorder.none,
hintText: 'Hint Text...',
),
onTagChanged: (newValue) {
setState(() {
values.add(newValue);
});
},
tagBuilder: (context, index) => _Chip(
index: index,
label: values[index],
onDeleted: onDelete,
),
suggestionBuilder: (context, state, data) => ListTile(
key: ObjectKey(data),
title: Text(data),
onTap: () {
state.selectSuggestion(data);
},
),
suggestionsBoxElevation: 10,
findSuggestions: (String query) {
return [];
}
)
```
It is possible to build the tag from your own widget, but it is recommended that Material Chip is used
```dart
class _Chip extends StatelessWidget {
const _Chip({
@required this.label,
@required this.onDeleted,
@required this.index,
});
final String label;
final ValueChanged onDeleted;
final int index;
@override
Widget build(BuildContext context) {
return Chip(
labelPadding: const EdgeInsets.only(left: 8.0),
label: Text(label),
deleteIcon: Icon(
Icons.close,
size: 18,
),
onDeleted: () {
onDeleted(index);
},
);
}
}
```