CircularProgressIndicator not displayed in flutter

Question

Im trying to display the CircularProgressIndicator in my flutter app on click of button but it does not render the circular progress bar, but as soon as I change the code to use LinearProgressBar the progress bar comes without any issue. So wanted to know is there any special setting which I need to display the circular loading indicator?

Works

if (_isFetching) {
  return new Scaffold(
    body: new Center(
      child: new SizedBox(
        width: 40.0,
        height: 40.0,
        child: const LinearProgressIndicator(backgroundColor: Colors.black)),
  ));
}

Do not work

if (_isFetching) {
  return new Scaffold(
    body: new Center(
      child: new SizedBox(
        width: 40.0,
        height: 40.0,
        child: const CircularProgressIndicator(backgroundColor: Colors.black)),
  ));
}

Answer 1

Make sure the progress bar's value color is different from the parent widget's background color. Try this:

if (_isFetching) {
  return Scaffold(
      body: Center(
      child: SizedBox(
        width: 40.0,
        height: 40.0,
        child: const CircularProgressIndicator(
            backgroundColor: Colors.black,
            valueColor: AlwaysStoppedAnimation<Color>(Colors.red))),
  ));
}