How to create dynamically TextFiled or Text Grid like in this screenshot?

Question

Tried to get it by adding dynamically SizedBox(child:Text('XVI', style:TextStyle(...),),) to ListView and repeat it on every onPressed event of TextButton. But didn't get it. Is there any alternative way to achieve this?

Answer 1

Try this code

Wrap(
        spacing: 5,
        runSpacing: 5,
        children: List.generate(
          20, // Here add the list length
          (index) {
            return Container(
              color: index.isEven ? Colors.black : Colors.grey, // Change the background color based on your condition
              child: Text("XXIV", style: TextStyle(color: Colors.white)),
            );
          },
        ),
      ),