I am working on a notes app where the added notes are stored in a SQLFlite DB. Opening the Notes detail page of the stored notes I get the following error:

Exception has occurred. LateError (LateInitializationError: Field 'note' has not been initialized.)

This is my code:

class NoteDtl extends StatefulWidget {
  final int noteId;

  const NoteDtl({
    Key? key,
    required this.noteId,
  }) : super(key: key);

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

class _NoteDtlState extends State<NoteDtl> {
  late Note note;
  bool isLoading = false;

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

  Future refreshNote() async {
    setState(() => isLoading = true);

    this.note = await NotesDatabase.instance.readNote(widget.noteId);

    setState(() => isLoading = false);
  }

  @override
  Widget build(BuildContext context) => Scaffold(
      backgroundColor: backGround,
      appBar: AppBar(
          backgroundColor: appbar,
          actions: [editButton(), deleteButton()],
          bottom: const TabBar(
              isScrollable: true,
              labelColor: Colors.orange,
              indicatorSize: TabBarIndicatorSize.label,
              indicatorColor: Colors.orange,
              unselectedLabelColor: Colors.grey,
              tabs: [
                Tab(text: "Page1"),
                Tab(
                  text: "Page2",
                )
              ])),
      body: TabBarView(children: [
        Page1(note: note),
        Page2(
          note: note,
        ),
      ]));

  Widget editButton() => IconButton(
      icon: Icon(Icons.edit_outlined),
      onPressed: () async {
        if (isLoading) return;

        await Navigator.of(context).push(MaterialPageRoute(
          builder: (context) => AddEditNotePage(note: note),
        ));

        refreshNote();
      });

  Widget deleteButton() => IconButton(
        icon: Icon(Icons.delete),
        onPressed: () async {
          await NotesDatabase.instance.delete(widget.noteId);

          Navigator.of(context).pop();
        },
      );
}

class Page1 extends StatefulWidget {
  const Page1({Key? key, required this.note}) : super(key: key);

  final Note note;

  @override
  State<Page1> createState() => _Page1State();
}

class _Page1State extends State<Page1> {
  @override
  Widget build(BuildContext context) {
    return Text(widget.note.description);
  }
}

class Page2 extends StatefulWidget {
  const Page2({Key? key, required this.note}) : super(key: key);

  final Note note;

  @override
  State<Page2> createState() => _Page2State();
}

class _Page2State extends State<Page2> {
  @override
  Widget build(BuildContext context) {
    return Text(widget.note.subdescription);
  }
}

Does anyone knows how to fix this?

CodePudding user response：

Your Note object is loaded asynchronously. The body will execute before that object gets loaded from the database. So you have to check that object availability there.

Declare that object like:

Note? note;

And change the build function as follows:

Widget build(BuildContext context) => note != null
      ? Scaffold(//Existing code)
      : Scaffold(
          body: Center(
          child: const CircularProgressIndicator(),
        ));

It will show a progress indicator on screen till that note object is loaded. Instead of note != null check, you can also use that isLoading variable also.