Search code examples
flutterdartwidgetrowcenter

Why my Center widget doesn't work in Dart? | Flutter


i am trying to Center all widgets (2 Icons and Text), but when i am adding Center widget (Before child: row i put child: Center(code below)), nothing happens, 0 errors, it's just not working.

Container(
        width: 100.0,
        height: 100.0,
        decoration: const BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.all(
            Radius.circular(15),
          ),
        ),
        child: const Icon(
          Icons.outbond_outlined,
          color: Colors.amber,
          size: 50.0,
        ),
      ),
      Container(
        width: 220.0,
        height: 100.0,
        decoration: const BoxDecoration(
          color: Colors.black,
          borderRadius: BorderRadius.all(
            Radius.circular(15),
          ),
        ),
        child: Row(
          // ignore: prefer_const_literals_to_create_immutables
          children: [
            const Icon(
              Icons.call_end_sharp,
              color: Colors.amber,
              size: 30.0,
            ),
            const Text(
              "Skrt",
              style: TextStyle(
                  color: Colors.white,
                  fontSize: 30.0,
                  fontFamily: "Lato"),
            ),
            const Icon(
              Icons.call_end_sharp,
              color: Colors.amber,
              size: 30.0,
            ),
          ],
        ),
      ),

Solution

  • use mainAxisAlignment: MainAxisAlignment.center, in your Row

    example:

    Row(
          // ignore: prefer_const_literals_to_create_immutables
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            const Icon(
              Icons.call_end_sharp,
              color: Colors.amber,
              size: 30.0,
            ),
            const Text(
              "Skrt",
              style: TextStyle(
                  color: Colors.black,
                  fontSize: 30.0,
                  fontFamily: "Lato"),
            ),
            const Icon(
              Icons.call_end_sharp,
              color: Colors.amber,
              size: 30.0,
            ),
          ],
        ),