choice 1.0.0 | Flutter package

Pub Version GitHub

The successor to smart_select and chips_choice with cleaner, more flexible, and composable API for creating inline or prompted choice widgets with single or multiple selection.

Features #

Cleaner, flexible, and composable API
Inline or prompted choice widget
Single or multiple choice widget
Searchable choice items with highlighted result
Specifies whether the choice selection needs to be confirmed
Build your own choice item that fits your needs
Supports leading and trailing choice items, as well as divider choice items
Use a predefined wrapped, scrollable, virtualized choice list, or build one that fits your needs
Use a predefined popup dialog, bottom sheet, new page prompt, or build one that fits your needs
Use a predefined modal header, footer, and separator, or build one that fits your needs
Use a predefined trigger widget or build one that fits your needs

Usage #

For a complete usage, please see the example.

To read more about classes and other references used by choice, see the API Reference.

Single Choice #

There are a few constructors to create a single selection choice widget:

By default, the choice controller maintains the selection state within a List. Any constructors other than those dedicated to single choice will have a List<T> for their value and onChanged prop. If we want to use a single value of T, we can use ChoiceSingle.value adapter to fill the value prop and ChoiceSingle.onChanged adapter to fill the onChanged prop.

Here is an example of how to use the ChoiceSingle.value and ChoiceSingle.onChanged adapters

import 'package:flutter/material.dart';
import 'package:choice/choice.dart';

class InlineScrollableX extends StatefulWidget {
  const InlineScrollableX({super.key});

  @override
  State<InlineScrollableX> createState() => _InlineScrollableXState();
}

class _InlineScrollableXState extends State<InlineScrollableX> {
  List<String> choices = [
    'News',
    'Entertainment',
    'Politics',
    'Automotive',
    'Sports',
    'Education',
    'Fashion',
    'Travel',
    'Food',
    'Tech',
    'Science',
    'Arts'
  ];

  String? selectedValue;

  void setSelectedValue(String? value) {
    setState(() => selectedValue = value);
  }

  @override
  Widget build(BuildContext context) {
    return Choice<String>.inline(
      clearable: true,
      value: ChoiceSingle.value(selectedValue),
      onChanged: ChoiceSingle.onChanged(setSelectedValue),
      itemCount: choices.length,
      itemBuilder: (state, i) {
        return ChoiceChip(
          selected: state.selected(choices[i]),
          onSelected: state.onSelected(choices[i]),
          label: Text(choices[i]),
        );
      },
      listBuilder: ChoiceList.createScrollable(
        spacing: 10,
        padding: const EdgeInsets.symmetric(
          horizontal: 20,
          vertical: 25,
        ),
      ),
    );
  }
}

Multiple Choice #

There are a few constructors to create an multiple selection choice widget:

Inline Choice #

There are a few constructors to create an inline choice widget:

Prompted Choice #

There are a few constructors to create a prompted choice widget:

Choice Data #

Choice Item #

With Future Builder #

With Form and FormField #

TODO #

Grouped choice items
Sortable choice items
Add scroll wheel list
Add dropdown choice widget

Sponsoring #

I'm working on my packages on my free-time, but I don't have as much time as I would. If this package or any other package I created is helping you, please consider to sponsor me so that I can take time to read the issues, fix bugs, merge pull requests and add features to these packages.

choice 1.0.0
choice: ^1.0.0 copied to clipboard

Metadata

Features #