About ChangeNotifier Provider

Question

I am managing state using provider but ChangeNotifierProvider does not change the value of variable. I want to show progress indicator when user is registering. But ChangeNotifierProvider does not provide me update value rather it always return me _isLoading = false; My Code:

AuthServices.dart

class AuthServices with ChangeNotifier {
  bool _isLoading = false;

  bool get loading => _isLoading;

  ///Register User
  Future registerUser(
      {@required String email, @required String password}) async {
    try {
      _isLoading = true;
      notifyListeners();

      await http.post(
          BackEndConfigs.baseUrl +
              BackEndConfigs.version +
              BackEndConfigs.auth +
              EndPoints.register,
          body: {
            "email": email,
            "password": password
          }).then((http.Response response) {
        _isLoading = false;
        notifyListeners();
        return RegisterUser.fromJson(json.decode(response.body));
      });
    } catch (e) {
      print(e);
    }
  }
}

RegisterScreen.dart

class RegisterScreen extends StatefulWidget {
  @override
  _RegisterScreenState createState() => _RegisterScreenState();
}

class _RegisterScreenState extends State<RegisterScreen> {
  AuthServices _authServices = AuthServices();
  ProgressDialog pr;
  @override
  Widget build(BuildContext context) {
    pr = ProgressDialog(context, isDismissible: true);
    // print(status.loading);

    return Scaffold(
      appBar:
          customAppBar(context, title: 'Register Yourself', onPressed: () {}),
      body: _getUI(context),
    );
  }

  Widget _getUI(BuildContext context) {
    return LoadingOverlay(
      isLoading: false,
      child: Padding(
        padding: const EdgeInsets.symmetric(horizontal: 20.0),
        child: SingleChildScrollView(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              VerticalSpace(10.0),
              GreyBoldText('Account Information'),
              VerticalSpace(20.0),
              IconsButtonRow([
                Icon(
                  FontAwesomeIcons.linkedinIn,
                  color: Color(0xff0e76a8),
                ),
                Icon(
                  FontAwesomeIcons.facebook,
                  color: Color(0xff3b5998),
                ),
                Icon(
                  FontAwesomeIcons.google,
                  color: Color(0xff4285F4),
                ),
              ]),
              VerticalSpace(10.0),
              GreyNormalText('or sign up with Email'),
              VerticalSpace(10.0),
              BlackBoldText("Email"),
              AppTextField(
                label: 'Email',
              ),
              BlackBoldText("Password"),
              AppTextField(
                label: 'Password',
              ),
              BlackBoldText("Confirm Password"),
              AppTextField(
                label: 'Confirm Password',
              ),
              VerticalSpace(20.0),
              ChangeNotifierProvider(
                create: (_) => AuthServices(),
                child: Consumer(
                  builder: (context, AuthServices user, _) {
                    return Text(user.loading.toString());
                  },
                ),
              ),
              AppButton(
                  buttonText: 'Next',
                  onPressed: () async {
                    // await pr.show();
                    _registerNewUser();
                  }),
              VerticalSpace(30.0),
              ToggleView(ToggleViewStatus.SignUpScreen),
              VerticalSpace(20.0),
            ],
          ),
        ),
      ),
    );
  }

  _registerNewUser() async {
    _authServices.registerUser(
        email: 'sdjfkldsdf@ssdfdsddfdgsffd.com', password: 'sldjsdfkls');
  }
}

main.dart

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
          scaffoldBackgroundColor: Colors.white,
          hintColor: FrontEndConfigs.hintColor,
          cursorColor: FrontEndConfigs.hintColor,
          fontFamily: 'Gilory'),
      home: RegisterScreen(),
    );
  }
}

Answer 1

You created two different instances of AuthServices.

One at the start of your State class and one using the ChangeNotifierProvider. When calling _registerNewUser you use the AuthServices created in your state class not the provided one.

When you call registerUser on the first AuthServices, the value does not change for the second AuthServices provided by the ChangeNotifierProvider down in the Widget tree.

Try deleting the AuthServices instance created by the state class and move your ChangeNotifierProvider up the widget tree so all your functions share the same instance of AuthServices.