Question 78088 in Flutter Question posted in
The official Flutter documentation can be found here.

StatefulBuilder's setState function not changing the color of IconButton – Flutter

I’m making an Instagram clone app and I’m trying to use StatefulBuilder but the setState
function of the builder does not change the color of the Container wrapped in GestureDetector ( onTap function ).

StatefulBuilder(
                        builder: (context, setState) {
                          var color = Color.fromRGBO(38, 38, 38, 1);
                          return Flexible(
                            flex: 1,
                            child: GestureDetector(
                              onTap: () {
                                setState(() {
                                  color = Color.fromRGBO(0, 149, 246, 1);
                                });
                              },
                              child: Container(
                                alignment: Alignment.center,
                                height: 30,
                                // width: double.infinity,
                                decoration: BoxDecoration(
                                    borderRadius: const BorderRadius.all(
                                      Radius.circular(10),
                                    ),
                                    color: color),
                                child: const Text('Follow'),
                              ),
                            ),
                          );
                        },
                      )

I want the Follow button to change it’s color but I don’t want to use the setState of the Stateful Widget as I don’t want to rebuild the whole screen.
Am I using StatefulBuilder incorrectly or is there any other solution to my problem?

Tags:

2

Answers


  1. 0 
     var color = Color.fromRGBO(38, 38, 38, 1);

    above line should be outside of StatefulBuilder

    Login or Signup to reply.
  2. 0

    You define your color variable inside your StatefulBuilder, and every time you call setState it resets this value and set the default value to it, you need to define it out of StatefulBuilder, like this:

    var color = Color.fromRGBO(38, 38, 38, 1);

StatefulBuilder(
   builder: (context, setState) {
       return Flexible(
    ...
)
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search