Sample Flutter Toggle Selector

main.dart

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.red,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _selectedIndex = -1;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(),
        body: Wrap(
          children: List.generate(30, (index) {
            return ButtonTab(
              isSelected: _selectedIndex == index,
              onTap: () => setState(() {
                _selectedIndex = _selectedIndex != index ? index : -1;
              }),
            );
          }).toList(),
        ));
  }
}

class ButtonTab extends StatelessWidget {
  final isSelected;
  final onTap;

  const ButtonTab({this.isSelected, this.onTap});

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onTap,
      child: Container(
        margin: const EdgeInsets.all(5.0),
        height: 50,
        width: 50,
        color: isSelected ? Colors.red : Colors.grey,
      ),
    );
  }
}