circularprogressindicator size flutter

Hi Guys, Welcome to Proto Coders Point. In this Flutter Article let’s learn how to increase size of CircularProgressIndicator.

So, As the name itself implies, CircularProgressIndicator Widget is used to show a circle rotating progress by seeing which flutter app user can understand that something is loading.

Flutter increase circular progress indicator size

Actually, In flutter the size of child widget depends of the size of it’s parent, Therefore, We can easily increase the size of circular progress indicator just wrapping it with a Container or SizedBox Widget where we can set height & widget.

Code Reference:

Scaffold(
      appBar: AppBar(title: const Text('ProtoCodersPoint.com')),
      body: Padding(
        padding: const EdgeInsets.all(20),
        child: Column(
          children: [
            const SizedBox(
              width: 150,
              height: 150,
              child: CircularProgressIndicator(
                color: Colors.blue,
                strokeWidth: 8,
              ),
            ),
            Container(
              width: 220,
              height: 220,
              decoration: const BoxDecoration(
                  shape: BoxShape.circle, color: Colors.pink),
              child: const CircularProgressIndicator(
                color: Colors.orange,
                strokeWidth: 8,
              ),
            )
          ],
        ),
      ),
);

Read more about CircularProgessIndicator in flutter.