Flutter: Get context in initState and didChangeDependencies Methods [Solved]

Welcome back, Hope you are doing well.

You read the title, I know most of you may have no idea. What is Flutter Get context in initState mean?

And may be you also not familiar with didChangeDependencies Method.

Calm down!

These are the methods that we can create in a stateful widget of a flutter application.

And why we use them. (initState() and didChangeDependencies)

We use them to perform different actions in the lifecycle of an app.

For example, we want to load data on a new screen previously passed.

So we use the init state to receive that data.

initState execute before the build method inside a stateful widget.

So, why do we discuss these things?

It’s a really specific use case in which we face some problems. So we are finding the solution to that problem or error.

I hope you are already facing this problem. And you are in trouble

Let’s discuss the solution

You use Provider. (A flutter package for statemanagement)

You want to get you provider date inside the initState or DidChangeDependencies method.

For that you want to use context inside the initState method.

Now you are facing errors and exceptions.

This is the Solution.

Solution 1

Color? color;
  bool isColorLoading = true;
@override
  void didChangeDependencies() {
    if (isColorLoading) {
      color = Theme.of(context).accentColor;
      isColorLoading = false;
    }
    super.didChangeDependencies();
  }

Solution 2

//Solution No 2
@override
  void initState() {
    Future.delayed(Duration.zero).then((value) {
      color = Provider.of(context, listen: false).getColor();
    });

    super.initState();
  }

Did you find your answer?

If not.

Let me explain these snippets for a moment.

Solution 1 didChangeDependencies Explanation

Color? color;
  bool isColorLoading = true;
@override
  void didChangeDependencies() {
    if (isColorLoading) {
      color = Theme.of(context).accentColor;
      isColorLoading = false;
    }
    super.didChangeDependencies();
  }

Here we are using

Theme.of(context).accentColor;

inside

 void didChangeDependencies() {
    
//Other Logic

    super.didChangeDependencies();
  }

Ok, Now just create a variable inside Stateful widget. Which will help us to run this (didChangeDependencies) only once.

bool isColorLoading = true;

Now Use if statement to check this variable value.

if (isColorLoading) {
      color = Theme.of(context).accentColor;
      isColorLoading = false;
    }

and also we false this variable. This will make sure that our variable runs only once.

All Errors gone and we have the data before the build method execution.

Solution 2 initState Explanation

//Solution No 2 
@override
  void initState() {
    Future.delayed(Duration.zero).then((value) {
      color = Provider.of(context, listen: false).getColor();
    });

    super.initState();
  }

This is the place where we use the context of the Provider method.

First

@override
  void initState() {

    super.initState();
  }

This is the initState method.

And

    Future.delayed(Duration.zero).then((value) {
      
    });

This is a future that gives the init method the illusion that the method will execute after some time.

And you can see we are passing the(Duration.zero) which means there is no duration.

After that delay we are executing this.

color = Provider.of(context, listen: false).getColor();

Here we just use context in the perspective of provider.

So,

1. Use didChangeDependencies with if check

2. Use initState with Future delay

Here is the Example link

Source Code

Watch This Video