Flutter app development signity solutions 1024x512 1

Flutter Errors and Solution

by

In this post, I will be discussing errors in Flutter and their Possible Solution.

The errors in this list are those errors I personally came across and these solutions were able to solve those errors.

Table of Contents:

  1. GeoLocator Package Giving No Output
  2. Bottom Overflow when Keyboard Appears
  3. Futter Navigation “Context is Undefined”
  4. setState() or markNeedsBuild() called during build.

1. GeoLocator Package Giving No Output

GeoLocator package enables us to get the users’ location and many other features. The thousands of lines of codes are readily available for us once we add the GeoLocator package to our project.

geolocator package flutter
What to do when Geolocator Package gives you no output?

Two possible Solutions:
1. Turn on the Location of the device manually. Check if the device is getting Location Permission. If not, give the Permission Manually.
2. Sometimes, desiredAccuracy: LocationAccuracy.Low or desiredAccuracy: LocationAccuracy.Lowest does not give any output. So use desiredAccuracy: LocationAccuracy.high

image
Device Location and Device Permission for weather_app

2. Bottom Overflow when Keyboard Appears

flutter overflow problem when keyboard appears
How to Solve Flutter Bottom Overflow when Keyboard Appears?
4

There are two quick solutions to solve bottom overflow when the keyboard appears in Flutter.
1. Use resizeToAvoidBottomInset: false under Scaffold
2. Use SingleChildScrollView. Click here to go to its documentation.

3. Flutter Navigation “Context is undefined”

moreInfo(){
  return GestureDetector(
    child: Text('More Info'),
    onTap: (){
      Navigator.push(context, MaterialPageRoute(builder: (context) => UserComments()));
    }
    );
}
How to solve Flutter Navigation “Context is undefined” error?
undefine context flutter

The Navigator’s context needs BuildContext for navigation otherwise it will just give us “Context is undefined error” just like the error shown in the image.

The best solution would be to use Builder Class. Here’s the link to its documentation: Builder Class. The code on how to use BuilderClass is shown below.

Another solution would be just to pass the Buildcontext.

moreInfo() {
  return Builder(builder: (BuildContext context) {
    return GestureDetector(
      child: Text('More Info'),
      onTap: () {
        Navigator.push(
            context, MaterialPageRoute(builder: (context) => UserComments()));
      },
    );
  });
}

4. setState() or markNeedsBuild() called during build.

What to do when you get “setState() or markNeedsBuild() called during build.”?

unknown

Not really sure what other times, one can get this error, but I got it when I tried to call a function _tapped on onTap like this onTap: _tapped(). The solution which took me hours to get was to just remove the brackets from _tapped(). The final solution was onTap: _tapped

5. How Flutter Error: Vertical viewport was given unbounded height Occurs ?

I was gonna write about why this error occurs and possible solution. However, I found a good youtube video which is by flutter team which explains about this problem.

5. Null check operator used on a null value

image 15

The solution is to add onChanged: (_) {} or onCompleted: (){}. This is because onChanged or onCompleted will working even if we don’t need them.

More info on: OTP TextField Issues

6. Chip Doesn’t Move Down

Use ListView.generate Instead of ListView.builder With WRAP Widget