int counter = 0;

List<int> counters = [];

counters.add(0);

counters[index]++;

import 'package:flutter/material.dart';

class TestPage extends StatefulWidget {

  const TestPage({super.key});

  @override

  State<TestPage> createState() => _TestPageState();

}

class _TestPageState extends State<TestPage> {

  // Create a list of texts

  final List<String> texts = [

    "Hello world",

    "Hello world!2"

  ];

  final List<int> subTexts = [

    1,

    2,

  ];

  // int counter = 0;

  List<int> counters = [];

  @override

  Widget build(BuildContext context) {

    return Scaffold(

      backgroundColor: Colors.grey[200],

      appBar: AppBar(

        backgroundColor: Colors.transparent,

        elevation: 0,

        title: const Text(

          "أذكار الصباح",

          textDirection: TextDirection.rtl,

        ),

        centerTitle: true,

      ),

      body: Container(

        padding: const EdgeInsets.all(

          25,

        ),

        child: ListView.builder(

          // Set the length of the list

          itemCount: texts.length,

          // Return a Card widget for each item

          itemBuilder: (context, index) {

            counters.add(0);

            return Padding(

              padding: const EdgeInsets.symmetric(

                vertical: 8,

              ),

              child: Card(

                shape: RoundedRectangleBorder(

                  borderRadius: BorderRadius.circular(10),

                  //set border radius more than 50% of height and width to make circle

                ),

                // Use a Column to arrange the text and the buttons vertically

                child: Container(

                  padding: const EdgeInsets.all(25.0),

                  color: Colors.amber,

                  child: Column(

                    children: [

                      // Display the text inside the card

                      AmiriText(

                        text: texts[index],

                        fontS: 25,

                        textDirection: TextDirection.rtl,

                      ),

                      SizedBox(

                        height: 25,

                      ),

                      CircleAvatar(

                        child: Text(

                          subTexts[index].toString(),

                        ),

                      ),

                      SizedBox(

                        height: 25,

                      ),

                      // Use a Row to display the two buttons horizontally

                      Row(

                        mainAxisAlignment: MainAxisAlignment.spaceAround,

                        children: <Widget>[

                          ElevatedButton(

                            style: ElevatedButton.styleFrom(

                              backgroundColor: Color(0xFF086788),

                              foregroundColor: Color(0xFF9CAFB7),

                              shadowColor: Colors.grey[400],

                              elevation: 3,

                              shape: RoundedRectangleBorder(

                                borderRadius: BorderRadius.circular(

                                  10.0,

                                ),

                              ),

                              minimumSize: Size(100, 40),

                            ),

                            child: AmiriText(

                              text: "return back",

                              fontS: 18,

                              color: Colors.white,

                            ),

                            onPressed: () {

                              setState(() {

                                if (counters[index] > 0) {

                                  counters[index]--;

                                }

                              });

                            },

                          ),

                          Text(

                            counters[index].toString(),

                            style: const TextStyle(

                              fontSize: 18,

                              fontWeight: FontWeight.w700,

                            ),

                          ),

                          ElevatedButton(

                            style: ElevatedButton.styleFrom(

                              backgroundColor: Color(0xFF062726),

                              foregroundColor: Color(0xFF66A182),

                              shadowColor: Colors.grey[400],

                              elevation: 3,

                              shape: RoundedRectangleBorder(

                                borderRadius: BorderRadius.circular(

                                  10.0,

                                ),

                              ),

                              minimumSize: Size(100, 40),

                            ),

                            child: AmiriText(

                              text: "Go",

                              fontS: 18,

                              color: Colors.white,

                            ),

                            onPressed: () {

                              setState(() {

                                counters[index]++;

                              });

                            },

                          ),

                        ],

                      ),

                    ],

                  ),

                ),

              ),

            );

          },

        ),

      ),

    );

  }

  AmiriText({required String text, required int fontS, Color? color, TextDirection? textDirection}) {

    return Text(text);

  }

}