I'm having trouble drawing the progress indicator


I am implementing file upload. I want to display the upload progress using CircularProgressIndicator.

The uploadFile() function of the FileUploadController class uploads a file to the server and tells the percentage of the upload progress. and ‘NotifyListeners()’ is called every frame to notify the upload progress.

I tried to draw a CircularProgressIndicator with this information, but I got an error.
"setstate() or markneedsbuild() called during build."

  Widget build(BuildContext context) {
    var uploadController = Provider.of<FileUploadController>(context);
    uploadController.uploadFile(userFiles, context);//upload files and update uploadPercentage
    return ListTile(
      leading: Stack(
        children: [
            value: userFiles.uploadPercentage,
            strokeWidth: userFiles.uploadPercentage == 1 ? 0 : 1,
            right: 3,
            left: 3,
            top: 3,
            bottom: 3,
            child: CircleAvatar(
              backgroundColor: Colors.white,
      title: Text(widget.fileName),
      trailing: IconButton(
        icon: Icon(Icons.close),
        onPressed: () => widget.removeWhenCloseButtonTap(widget.fileName),

I think the problem is calling notifyListeners() inside build() (the uploadFile function calls it).How can I fix it?


Yes, that’s the probably the issue. You might want to make that call to uploadFile() inside the initState() :

FileUploadController uploadController(BuildContext context) => Provider.of<FileUploadController>(context);

void initState() {
  uploadController(context).uploadFile(userFiles, context);

If you’re in a stateless widget, convert it to a stateful one.

Answered By – MickaelHrndz

Answer Checked By – Gilberto Lyons (FlutterFixes Admin)

Leave a Reply

Your email address will not be published. Required fields are marked *