// available configuration for single choice ChipsChoice<T>.single({ // The current value of the single choice widget. @required T value, // Called when single choice value changed @required C2Changed<T> onChanged, // choice item list @required List<C2Choice<T>> choiceItems, // Async loader of choice items C2ChoiceLoader<T> choiceLoader, // other available configuration // explained below ..., ..., })

int tag = 1; List<String> options = [ 'News', 'Entertainment', 'Politics', 'Automotive', 'Sports', 'Education', 'Fashion', 'Travel', 'Food', 'Tech', 'Science', ]; @override Widget build(BuildContext context) { return ChipsChoice<int>.single( value: tag, onChanged: (val) => setState(() => tag = val), choiceItems: C2Choice.listFrom<int, String>( source: options, value: (i, v) => i, label: (i, v) => v, ), ); }

// available configuration for multiple choice ChipsChoice<T>.multiple({ // The current value of the multiple choice widget. @required List<T> value, // Called when multiple choice value changed @required C2Changed<List<T>> onChanged, // choice item list @required List<C2Choice<T>> choiceItems, // Async loader of choice items C2ChoiceLoader<T> choiceLoader, // other available configuration // explained below ..., ..., })

List<String> tags = []; List<String> options = [ 'News', 'Entertainment', 'Politics', 'Automotive', 'Sports', 'Education', 'Fashion', 'Travel', 'Food', 'Tech', 'Science', ]; @override Widget build(BuildContext context) { return ChipsChoice<String>.multiple( value: tags, onChanged: (val) => setState(() => tags = val), choiceItems: C2Choice.listFrom<String, String>( source: options, value: (i, v) => v, label: (i, v) => v, ), ); }

// available configuration for single and multiple choice ChipsChoice<T>.[single|multiple]({ // other available configuration // explained below ..., ..., // Choice item style C2ChipStyle choiceStyle, // other available configuration // explained below ..., ..., })

// available configuration for single and multiple choice ChipsChoice<T>.[single|multiple]({ // other available configuration // explained below ..., ..., // Builder for custom choice item label C2Builder<T> choiceLabelBuilder, // Builder for custom widget to display prior to the chip's [label]. C2Builder<T>? choiceLeadingBuilder; // Builder for custom widget to display next to the chip's [label]. C2Builder<T>? choiceTrailingBuilder; // Builder for custom choice item C2Builder<T> choiceBuilder, // Builder for spinner widget WidgetBuilder spinnerBuilder, // Builder for placeholder widget WidgetBuilder placeholderBuilder, // Builder for error widget WidgetBuilder errorBuilder, // other available configuration // explained below ..., ..., })

// available configuration for single and multiple choice ChipsChoice<T>.[single|multiple]({ // other available configuration // explained below ..., ..., // Whether the chips is wrapped or scrollable bool wrapped, // Container padding EdgeInsetsGeometry padding, // The direction to use as the main axis. Axis direction, // Determines the order to lay children out vertically and how to interpret start and end in the vertical direction. VerticalDirection verticalDirection, // Determines the order to lay children out horizontally and how to interpret start and end in the horizontal direction. TextDirection textDirection, // if [wrapped] is [false], How the scroll view should respond to user input. ScrollPhysics scrollPhysics, // if [wrapped] is [false], How much space should be occupied in the main axis. MainAxisSize mainAxisSize, // if [wrapped] is [false], How the children should be placed along the main axis. MainAxisAlignment mainAxisAlignment, // if [wrapped] is [false], How the children should be placed along the cross axis. CrossAxisAlignment crossAxisAlignment, // if [wrapped] is [true], how the children within a run should be aligned relative to each other in the cross axis. WrapCrossAlignment wrapCrossAlignment, // if [wrapped] is [true], determines how wrap will align the objects WrapAlignment alignment, // if [wrapped] is [true], how the runs themselves should be placed in the cross axis. WrapAlignment runAlignment, // if [wrapped] is [true], how much space to place between children in a run in the main axis. double spacing, // if [wrapped] is [true], how much space to place between the runs themselves in the cross axis. double runSpacing, // Clip behavior Clip clipBehavior, // String to display when choice items is empty String placeholder, // placeholder text style TextStyle placeholderStyle, // placeholder text align TextAlign placeholderAlign, // error text style TextStyle errorStyle, // error text align TextAlign errorAlign, // spinner size double spinnerSize, // spinner color Color spinnerColor, // spinner thickness double spinnerThickness, // other available configuration // explained below ..., ..., })

ChipsChoice<T>.[single|multiple]( ..., ..., choiceItems: <C2Choice<T>>[ C2Choice<T>(value: 1, label: 'Entertainment'), C2Choice<T>(value: 2, label: 'Education'), C2Choice<T>(value: 3, label: 'Fashion'), ], );

List<Map<String, String>> days = [ { 'value': 'mon', 'title': 'Monday' }, { 'value': 'tue', 'title': 'Tuesday' }, { 'value': 'wed', 'title': 'Wednesday' }, { 'value': 'thu', 'title': 'Thursday' }, { 'value': 'fri', 'title': 'Friday' }, { 'value': 'sat', 'title': 'Saturday' }, { 'value': 'sun', 'title': 'Sunday' }, ]; ChipsChoice<T>.[single|multiple]( ..., ..., choiceItems: C2Choice.listFrom<T, Map<String, String>>( source: days, value: (index, item) => item['value'], label: (index, item) => item['title'], ), );

import 'package:dio/dio.dart'; String value; Future<List<C2Choice<String>>> getChoices() async { String url = "https://randomuser.me/api/?inc=gender,name,nat,picture,email&results=25"; Response res = await Dio().get(url); return C2Choice.listFrom<String, dynamic>( source: res.data['results'], value: (index, item) => item['email'], label: (index, item) => item['name']['first'] + ' ' + item['name']['last'], meta: (index, item) => item, )..insert(0, C2Choice<String>(value: 'all', label: 'All')); } @override Widget build(BuildContext context) { return ChipsChoice<String>.single( value: value, onChanged: (val) => setState(() => value = val), choiceItems: null, choiceLoader: getChoices, ); }