How to use provider package to reload a widget tree of a stateless class

Issue

here is the logic, to get the data from the internet , when loading is not complete show a progressbar widget and when the loading is complete show the complete widget tree with text fields, pictures etc

firstly in the mainscreen i check if the data is downloaded form firebase

Future<void> getCurrentDriverInfo() async {
    // doublenotification++;
    currentFirebaseUser = FirebaseAuth.instance.currentUser!;
    await driversRef
        .child(currentFirebaseUser!.uid)
        .once()
        .then((DatabaseEvent databaseEvent) {
      if (databaseEvent.snapshot.value != null) {
        driversInformation = Drivers.fromSnapshot(databaseEvent.snapshot);
      }
    });
    ScaffoldMessenger.of(context)
        .showSnackBar(SnackBar(content: Text("Driver detail downloaded")));
    Provider.of<AppData>(context, listen: false).getDriverDetailsDownload(true);
  }

This is the provider class

class AppData extends ChangeNotifier {
  bool driverDetaildownloaded = false;
  void getDriverDetailsDownload(bool driverDetaildownload) {
    driverDetaildownloaded = driverDetaildownload;
    print("Driverdownload" + driverDetaildownload.toString());
    notifyListeners();
  }

Now inthis cass i want to check if the data is not downloaded then show just the progress bar and when the data is downloaded close the progress bar and show the widget tree

class ProfileTabPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black87,
      body: SafeArea(
        child: Provider.of<AppData>(context, listen: false)
                .driverDetaildownloaded
            ? Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                 
                  Text(
                    driversInformation!.name!,
                    style: TextStyle(
                      fontSize: 65.0,
                      color: Colors.white,
                      fontWeight: FontWeight.bold,
                      fontFamily: 'Signatra',
                    ),
                  ),
                ]
              )
            : Center(child: CircularProgressIndicator()),
      ),
    );
  }
}

However the CircularProgressIndicator() doesn’t close and load the widgets. whats wrong ?

Solution

in your UI: you have to set listen true,

body: SafeArea(
        child: Provider.of<AppData>(context, listen: true)
                .driverDetaildownloaded
        .....

another option: use Consumer

body: SafeArea(
        child: Consumer<AppData>(
     builder:(context,state,child) {
    return state.isDownloaded  
        ? your widget
        : CircularProgressIndicator(); 
    }
    )

Answered By – pmatatias

Answer Checked By – David Marino (FlutterFixes Volunteer)