I have a code in flutter with a showModalBottomSheet

                         showModalBottomSheet(
                                      backgroundColor: Colors.transparent,
                                      context: context,
                                      builder: (_) {
                                        return  Container(
                                          height: height * 0.6,
                                          width: width,
                                          decoration: const BoxDecoration(
                                            color: Colors.white,
                                            borderRadius: BorderRadius.only(
                                                topLeft: Radius.circular(30),
                                                topRight: Radius.circular(30)),
                                          ),
                                          child: Row(
                                            children: [
                                              const Spacer(flex: 1),
                                              Expanded(
                                                  flex: 8,
                                                  child: Column(
                                                    children: [
                                                      const Spacer(flex: 1),
                                                      Expanded(
                                                          flex: 9,
                                                          child: firstFilter == false ? ListView
                                                              .builder(
                                                                  itemCount:
                                                                      mainSubjectLength,
                                                                  itemBuilder:
                                                                      (ctx,
                                                                          i) {
                                                                    var output = mainSubjectSnapshot
                                                                        .data!
                                                                        .docs[i];
                                                                    return Column(
                                                                      children: [
                                                                        SizedBox(height: i == 0 ? 10 : 0),
                                                                        GestureDetector(
                                                                          onTap: () async {
                                                                            HapticFeedback.lightImpact();
                                                                             setState(()  {
                                                                               firstFilterRef = output['ref'];
                                                                               firstFilter = true;
                                                                            });

                                                                            print(firstFilter);
                                                                            print('$firstFilterRef ref');

                                                                          },
                                                                            child: Container(
                                                                              color: Colors.transparent,
                                                                              width: double.infinity,
                                                                              alignment: Alignment.centerLeft,
                                                                                child: Text(
                                                                          output['system_name'], style: const TextStyle(fontWeight: FontWeight.w500, fontSize: 20),
                                                                        ))),
                                                                        const SizedBox(height: 10)
                                                                      ],
                                                                    );
                                                                  }) : TextButton(onPressed: (){
                                                                    setState(() {
                                                                      firstFilterRef = '';
                                                                      firstFilter = false;
                                                                    });
                                                                  }, child: firstFilterRef == '' ? Text('vazio') : Text(firstFilterRef)))
                                                    ],
                                                  )),
                                              const Spacer(flex: 1),
                                            ],
                                          ),
                                        ) ;
                                      });

I will use it as a search feature. Depending on the item clicked, it will show only the content within its subcollections. The thing is that the setState changes the values, but doesn't refresh the state of the widget. I need to close the bottomSheet and open it again, then the TextButton will be displayed. How to prevent it from happening and automatically change it after setState?

CodePudding user response：

Try wrapping your widget with a StatefulBuilder and then use setState to rebuild the widget programmatically.

showModalBottomSheet(
  backgroundColor: Colors.transparent,
  context: context,
  builder: (_) {
    return StatefulBuilder(
      builder: (context, setState) {
        return  Container();
      });
   });
);