Toggle between pages function returns null (flutter)

Question

I tried maybe 4 different ways to write the code for toggling between the sign in page and the register page using a toggle function but it always gave me an error but this type doesn't give me an error in the code it prints an error in the run console that says "The following _CastError was thrown while handling a gesture: Null check operator used on a null value"

This is my authentication file 'authenticate.dart':

class _AuthenticateState extends State<Authenticate> {

  bool showSignIn = false;
  void Function()? toggleView() {
      setState(() => showSignIn = !showSignIn);
  }

  @override
  Widget build(BuildContext context) {
    if(showSignIn) {
      return SignIn(toggleView: toggleView());
    } else {
      return Register(toggleView: toggleView());
    }
  }
}

This is my 'register.dart' file:

class Register extends StatefulWidget {

  final void Function()? toggleView;
  Register({ required this.toggleView});

  @override
  _RegisterState createState() => _RegisterState();
}

class _RegisterState extends State<Register> {

  final AuthService _auth = AuthService();

  //text field state
  String email = '';
  String password = '';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.brown[100],
      appBar: AppBar(
        backgroundColor: Colors.brown[400],
        elevation: 0,
        title: Text('Sign up to the breakfast club'),
        actions: [
          TextButton.icon(
            icon: Icon(
              Icons.person,
            ),
            label: Text('Sign In'),
            onPressed: () {
              print('Sign in clicked');
              widget.toggleView!();
            },
            style: TextButton.styleFrom(
              primary: Colors.white,
            ),
          ),

And my 'sign_in.dart' is exactly the same as 'register.dart' except for this part:

onPressed: () {
              print('Register clicked');
              widget.toggleView!();
            },

Solution

I think the problem here is you sending through a function toggleView() which is not the same as sending through the function itself with all the scope of its parameters in tact. You want to create a callback.

You should place all of the function definition in the parameter without naming it eg:

Register(toggleView: () {setState(() => showSignIn = !showSignIn);});

This way the scope of the showSignIn parameter is clear and refers to the variable of that name in the Authentication.dart file.

Comments

[Khaled Taha]

Thanks a lot man I've stuck in this error forever.

[PaulV]

Happy to have helped. Can you vote up the answer for me?