Flutter - FutureBuilder error on first build

Question

I am trying to build an app, that displays a list after the call to the database. But when I'm launching the app for the first time, there will always be my error message. The reason why I am posting this in here is: I want that the list shows up even at first launch, so that the error message is not even displaying.

This is the code of the list:

import 'dart:async';
import 'dart:math';

import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:side_header_list_view/side_header_list_view.dart';

import 'package:recipe/database/database.dart';
import 'package:recipe/interface/GoogleColors.dart';
import 'package:recipe/model/Recipes.dart';
import 'package:recipe/recipe/recipeDetails.dart';


Future<List<Recipes>> fetchRecipes() async{
  var dbHelper = DBHelper();
  Future<List<Recipes>> recipes = dbHelper.getRecipes();
  return recipes;
}


class Lists extends StatefulWidget{
  @override
  State<StatefulWidget> createState() {
    return _List();
  }
}

class _List extends State<Lists>{
  DBHelper db = new DBHelper();
  GoogleMaterialColors colors = new GoogleMaterialColors();
  Random random = new Random(); 
  Color usedColor; 

  @override
    void initState() {
      super.initState();
    }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: new Container(
        alignment: Alignment.topCenter,        
        child: new FutureBuilder<List<Recipes>>(
          future: fetchRecipes(),
          builder: (context, snapshot) {
            if (snapshot.hasError) {
              return new Text("Zurzeit sind keine Daten vorhanden."); //this error shows up
            }
            else if (snapshot.hasData) {
              return new ListView.builder(
                itemCount: snapshot.data.length,
                itemBuilder: (BuildContext context, int index){
                  return new Text(snapshot.data[index].name);
                },
              );
            }
            return new Container(alignment: AlignmentDirectional.center,child: new CircularProgressIndicator(),);
          },
        ),
      ),
      floatingActionButton: FloatingActionButton(
        backgroundColor: Color(0xFF0F9D58),
        elevation: 4.0,
        child: Icon(Icons.add),
        onPressed: (){
          Navigator.pushNamed(context, '/add_recipe');
        },
      )
    );
  }

  void showBottomSnack(String value, ToastGravity toastGravity){
    Fluttertoast.showToast(
      msg: value,
      toastLength: Toast.LENGTH_SHORT,
      gravity: toastGravity,
      timeInSecForIos: 2,            
    );
  }
}

The code of the DBHelper.getRecipes():

Future<List<Recipes>> getRecipes() async{
    List<Map> list = await _db.rawQuery("SELECT * FROM recipes");
    List<Recipes> recipes = new List();
    for(int i =0; i < list.length; i++){
      recipes.add(new Recipes(id: list[i]["id"],name: list[i]["name"],definition: list[i]["definition"],duration:  list[i]["duration"], favorite:  list[i]["favorite"], timestamp: list[i]["timestamp"], image: list[i]["image"],backgroundColor: list[i]["backgroundColor"]));      
    }
    return recipes;
  }

The class of recipes:

class Recipes{
  int id, favorite;
  dynamic image;
  String name, definition, timestamp, duration, backgroundColor;

  Recipes(
    {
      @required this.id, 
      this.name, 
      this.definition, 
      this.duration, 
      this.favorite, 
      this.timestamp, 
      this.image, 
      this.backgroundColor
    }
  );
}

snapshot.error returns this:

NoSuchMethodError: The method 'rawQuery' was called on null. Receiver: null Tried calling: rawQuery('SELECT * FROM recipes')

Answer 1

The error "NoSuchMethodError The method was called on null" is usually thrown when the variable where the method was called may have yet to be initialized. From the logs you've provided, you're trying to call rawQuery() from a null object. Verify if _db has been initialized before calling _db.rawQuery() .