Home > Software engineering >  Getting a red squiggly line when I return null with a message 'Null isn't a string'
Getting a red squiggly line when I return null with a message 'Null isn't a string'

Time:01-11

    import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:mybankapp/authscreens/loginscreen.dart';
import 'package:mybankapp/colors/colors.dart';
import 'package:mybankapp/routscreens/routwidget.dart';
import 'package:mybankapp/textfontfamily/textfontfamily.dart';
import 'package:mybankapp/welcomescreen/welcomescreen.dart';

class SignUpScreen extends StatefulWidget {
  @override
  _SignUpScreenState createState() => _SignUpScreenState();
}

class _SignUpScreenState extends State<SignUpScreen> {
  final _formKey = GlobalKey<FormState>();
  late String _name;
  late String _phoneNumber = '';
  late String _password;
  late String _confirmPassword;
  final bool _isLoading = false;

  Text text(String text) {
    return Text(
      text,
      style: TextStyle(
        fontSize: 10,
        fontFamily: TextFontFamily.helveticaNeueCyrRoman,
        color: ColorResources.white,
      ),
    );
  }

  TextFormField textFormField(String hint, String Function(String?) validator,
      void Function(String?) onSaved,
      {bool obscureText = false}) {
    return TextFormField(
      style: TextStyle(
        fontFamily: TextFontFamily.helveticaNeueCyrRoman,
        fontSize: 13,
        color: ColorResources.grey2,
      ),
      obscureText: obscureText,
      cursorColor: ColorResources.blue1,
      decoration: InputDecoration(
        filled: true,
        fillColor: ColorResources.grey1.withOpacity(0.05),
        hintText: hint,
        isDense: true,
        hintStyle: TextStyle(
          fontFamily: TextFontFamily.helveticaNeueCyrRoman,
          fontSize: 13,
          color: ColorResources.grey2,
        ),
        enabledBorder: OutlineInputBorder(
          borderRadius: BorderRadius.circular(5),
          borderSide: BorderSide(
            width: 1,
            color: ColorResources.blue1.withOpacity(0.6),
          ),
        ),
        border: OutlineInputBorder(
          borderRadius: BorderRadius.circular(5),
          borderSide: BorderSide(
            width: 1,
            color: ColorResources.blue1.withOpacity(0.6),
          ),
        ),
        errorBorder: OutlineInputBorder(
          borderRadius: BorderRadius.circular(5),
          borderSide: BorderSide(
            width: 1,
            color: ColorResources.blue1.withOpacity(0.6),
          ),
        ),
        focusedBorder: OutlineInputBorder(
          borderRadius: BorderRadius.circular(5),
          borderSide: BorderSide(
            width: 1,
            color: ColorResources.blue1.withOpacity(0.6),
          ),
        ),
      ),
      validator: validator,
      onSaved: onSaved,
    );
  }

  // phone number validation
  // ignore: valid_regexps
  final _phoneNumberRegExp = RegExp(r'^(?:[ 0]9)?[0-9]{10}$');

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: ColorResources.backGroundColor,
      body: SingleChildScrollView(
        child: Padding(
          padding: const EdgeInsets.only(top: 50, left: 15, right: 15),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              InkWell(
                onTap: () {
                  Get.off(WelcomeScreen());
                },
                child: Icon(
                  Icons.close,
                  color: ColorResources.white,
                ),
              ),
              SizedBox(height: 70),
              Text(
                "Create Account",
                style: TextStyle(
                    fontFamily: TextFontFamily.helveticNeueCyrBold,
                    fontSize: 35,
                    color: ColorResources.red),
              ),
              SizedBox(height: 7),
              Text(
                "Open a Noble Bank account with a few details.",
                style: TextStyle(
                    fontFamily: TextFontFamily.helveticaNeueCyrRoman,
                    fontSize: 15,
                    color: ColorResources.white1),
              ),
              SizedBox(height: 45),
              Form(
                key: _formKey,
                child: Column(
                  children: [
                    text("Full name"),
                    SizedBox(height: 10),
                    textFormField("", (value) {
                      if (value!.isEmpty) {
                        return "Please enter your name";
                      }
                      return null;
                    }, (value) {
                      _name = value!;
                    }),
                    SizedBox(height: 20),
                    text("Phone number"),
                    SizedBox(height: 10),
                    textFormField("", (value) {
                      if (!_phoneNumberRegExp.hasMatch(value!)) {
                        return "Please enter your phone number";
                      }
                      return null;
                    }, (value) {
                      _phoneNumber = value!;
                    }),
                    SizedBox(height: 20),
                    text("Password"),
                    SizedBox(height: 10),
                    textFormField("", (value) {
                      if (value!.isEmpty) {
                        return "Please enter your password";
                      } else if (value.length < 8) {
                        return "Password must be at least 8 characters long";
                      }
                      return null;
                    }, (value) {
                      _password = value!;
                    }, obscureText: true),
                    SizedBox(height: 20),
                    text("Repeat password"),
                    SizedBox(height: 10),
                    textFormField("", (value) {
                      if (value!.isEmpty) {
                        return "Please enter your password";
                      } else if (value != _password) {
                        return "Password doesn't match";
                      }
                      return null;
                    }, (value) {
                      _confirmPassword = value!;
                    }, obscureText: true),
                  ],
                ),
              ),
              SizedBox(height: Get.height >= 876 ? 150 : 50),
              _isLoading
                  ? CircularProgressIndicator()
                  : SizedBox(
                      width: double.infinity,
                      child: InkWell(
                        onTap: () {
                          Get.off(NavigationBarBottom());
                        },
                        child: Container(
                          height: 50,
                          width: Get.width,
                          decoration: BoxDecoration(
                            color: ColorResources.red,
                            borderRadius: BorderRadius.circular(10),
                          ),
                          child: Center(
                            child: Text(
                              "CREATE YOUR FREE ACCOUNT",
                              style: TextStyle(
                                  fontFamily:
                                      TextFontFamily.helveticaNeueCyrRoman,
                                  fontWeight: FontWeight.w700,
                                  fontSize: 13.5,
                                  color: ColorResources.white),
                            ),
                          ),
                        ),
                      ),
                    ),
              SizedBox(height: 20),
              Center(
                child: RichText(
                  text: TextSpan(
                    text: "Do you already have a MyBank account?",
                    style: TextStyle(
                      fontSize: 13.5,
                      fontWeight: FontWeight.w300,
                      fontFamily: TextFontFamily.helveticaNeueCyrRoman,
                      color: ColorResources.white2,
                    ),
                    children: <TextSpan>[
                      TextSpan(
                        recognizer: TapGestureRecognizer()
                          ..onTap = () => Get.to(LogInScreen()),
                        text: "  Sign in here",
                        style: TextStyle(
                          fontSize: 14,
                          fontFamily: TextFontFamily.helveticaNeueCyrRoman,
                          fontWeight: FontWeight.w300,
                          color: ColorResources.red,
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

I keep getting this red squiggly lines when i return null and with the popup saying "The return type 'Null' isn't a 'String', as required by the closure's" The code runs but the red it still shows this red lines under the return null statement. I can't seem to pinpoint the errors. And the signup page text are now centralised instead of aligning from the left. [enter image description here](https://i.stack.imgur.com/speeC.jpg)

CodePudding user response:

It's all because in your

textFormField(String hint, String Function(String?) validator,

Function/Widget you ask for a String Function(String?) as a function for your validator

And this declaration means that this function shouldn't return null

Just change it to String? Function(String?) and this error will go

textFormField(String hint, String? Function(String?) validator,

CodePudding user response:

  1. For the null problem : Change this:
TextFormField textFormField(String hint, String Function(String?) validator,
      void Function(String?) onSaved,
      {bool obscureText = false})

To this :

TextFormField textFormField(String hint, String? Function(String?) validator,
      void Function(String?) onSaved,
      {bool obscureText = false})

To make validator output nullable.

  1. For the center / left problem : Change this :
child: Column(
                  children: [
                    text("Full name"),

To this :

child: Column( crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    text("Full name"),

To align all children of Column to the left.

  • Related