Question 76154 in Flutter Question posted in
The official Flutter documentation can be found here.

Hi I am new to flutter and I wanted to implement this design where the tick icon is displayed when a button is selected from group of buttons

enter image description here

I have been working with radio button ; don’t seem to figure out how to make the icon appear and disappear up on selection.

Tags:

2

Answers


  1. 0

    You might want to look at Widgets like Chip and RawChip.
    RawChip on flutter.dev

    There you can set the selected option to true and you get a checkmark.

    Login or Signup to reply.
  2. 0

    To create more chips and make them selectable in Flutter, you can use the Chip widget and wrap it inside a ChoiceChip or FilterChip widget. Here’s an example:

    List<String> _options = ['Option 1', 'Option 2', 'Option 3'];
List<String> _selectedOptions = [];

Widget build(BuildContext context) {
  return Wrap(
    children: _options.map((option) {
      return ChoiceChip(
        label: Text(option),
        selected: _selectedOptions.contains(option),
        onSelected: (selected) {
          setState(() {
            if (selected) {
              _selectedOptions.add(option);
            } else {
              _selectedOptions.remove(option);
            }
          });
        },
      );
    }).toList(),
  );
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search