The change in showModalBottomSheet is fixed by closing-opening

Question

I have a code. I want to make changes in this code based on whether the variable is true or false. The change happens technically, but in the view, it happens when you close-open.

Codes:

  InkWell(
    child: Icon(Icons.check_circle, size: 30, color: importantSelected ? Colors.green : Colors.grey,),
    onTap: () {
      setState(() {
        importantSelected = !importantSelected;
      });
    },
  ),

These codes are in showModalBottomSheet. The change is visible when I close/open the showModalBottomSheet. I want it to appear directly without turning it on and off.

Answer 1

you have to add StatefulBuilder and you use the new function setState

showModalBottomSheet(
    isScrollControlled: true,
    context: context,
    builder: (context) {
      return StatefulBuilder(
          builder: (BuildContext context, StateSetter setState) {
        return SingleChildScrollView()
      }
     )
    }
);