I would like to make some container selectable.

User should be able to choise one.

How can I do that or is there a other way to do that ?

CodePudding user response：

You can use wrap the widget with tappable widget like GestureDetector , InkWell and a nullable int? to hold selected item, also you can provide the default selected item value. And provide some decoration based on selection.

 int? selectedItem;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          ...List.generate(
            2,
            (index) => InkWell(
              customBorder: const CircleBorder(),
              onTap: () {
                setState(() {
                  selectedItem = index;
                });
              },
              child: Container(
                height: 100,
                width: 100,
                alignment: Alignment.center,
                decoration: BoxDecoration(
                  color: selectedItem == index ? Colors.blue : null,
                  shape: BoxShape.circle,
                ),
                child: Text(" item $index"),
              ),
            ),
          )
        ],
      ),
    );
  }