Button List Select - flutter

Question

I have a list of the button in my flutter app like the picture :enter image description here
and I need to select the container who I'm click on it
for example, change the container color

Answer 1

you can use container or button and GestureDetector like below example
import 'package:flutter/material.dart';
class SelectableGridView extends StatefulWidget {
const SelectableGridView({Key? key}) : super(key: key);
#override
State<SelectableGridView> createState() => _SelectableGridViewState();
}
class _SelectableGridViewState extends State<SelectableGridView> {
int selectedIndex = 0;
#override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.blueGrey,
body: Padding(
padding: const EdgeInsets.all(16.0),
child: GridView.builder(
physics: const ClampingScrollPhysics(),
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 3,
crossAxisSpacing: 16.0,
mainAxisSpacing: 16.0,
),
itemCount: 18,
itemBuilder: (context, index) {
return GestureDetector(
onTap: () => setState(() {
selectedIndex = index;
}),
child: Container(
color: selectedIndex == index ? Colors.pink : Colors.white,
),
);
},
),
),
);
}
}

Answer 2

TBH I'm not sure what your asking exactly, but this may or may not help you:
GestureDetector
This will let you respond to clicks on whatever it surrounds, so for example
return
GestureDetector(
onTap: (){
//Do something here to respond to a tap on the child Container()
},
child: Container(...) /// Your box
Now you can do something with it.
Hope this is what you were asking about

Answer 3

You can also use InkWell in this following way,
First you have to declare Color in your instances and after that you can use it in your onPress() widget.
Color _colorContainer = Colors.blue;
Now you can use it in your widget as follow:
Ink(
child: InkWell(
child: Container(
width: 200,
height: 200,
color: _colorContainer ,
),
onTap: () {
setState(() {
_colorContainer = _colorContainer == Colors.red ?
Colors.blue :
Colors.red;
});
},
)),