CODEWITHSUNDEEP
flutterdart
markosh498
markosh498

Reputation: 53

How can I achieve this CircularProgressIndicator in Flutter?

does anyone know how to achieve a CircularProgressIndicator() as on the screenshot below in Flutter?

CircularProgressIndicator

Upvotes: 5

Views: 454

Answers (2)

Elmar
Elmar

Reputation: 4387

There is a direct way to achieve that in Flutter. If you use CircularProgressIndicator.adaptive it will be shown in Android as Android style and in iOS like native clockwise turning ticks style:

@override
  Widget build(BuildContext context) {
    return Container(          
            width: 50.0,
            height: 50.0,
            child:  
         CircularProgressIndicator.adaptive(
        strokeWidth: 7,
              backgroundColor: Colors.grey,
              valueColor: Colors.green,
              
            ));
  }

Upvotes: 0

MendelG
MendelG

Reputation: 19998

That's the IOS equivalent of the CircularProgressIndicator(). You can use CupertinoActivityIndicator. Here is a YouTube video by the Google team on how to use it.

You have to import cupertino first:

import 'package:flutter/cupertino.dart';
...

return CupertinoActivityIndicator()

Result:

enter image description here

Upvotes: 3

Related Questions