How to invisible widget when there is no data in firebase?

Question

i am new to flutter, i'm trying to invisible button when there is no data in Firebase.

To get data i'm using StreamBuilder, if snapshot.data!.docs is null i want to invisible CustomButton which is outside of StreamBuilder.

StreamBuilder:

bool _isVisible = true; //variable

@override
   Widget build(BuildContext context) {
    final size = MediaQuery.of(context).size;
    return Scaffold(
      key: _scaffoldKey,
      appBar: _appBar(context),
      body: CommonRefreshIndicator(
        child: StreamBuilder(
          stream: FirebaseFirestore.instance
              .collection('users')
              .doc(_currentUser!.uid)
              .collection('favourites')
              .snapshots(),
          builder:
              (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
            if (snapshot.hasError) {
              return const CustomProgressIndicator();
            }
            if (snapshot.connectionState == ConnectionState.waiting) {
              return const CustomProgressIndicator();
            }

            final data = snapshot.data!.docs;
            allData = snapshot.data!.docs;

            if (data.isNotEmpty) {   //update based on data
              _isVisible = true;  
            } else {
              _isVisible = false;
            }

            return data.isNotEmpty
                ? _favItemListView(data)
                : const Center(
                    child: Text('No data found'),
                  );
          },
        ),
      ),
      bottomNavigationBar: _addAllToFavButton(size),
    );
  }

CustomButton:

Padding _addAllToFavButton(Size size) => Padding(
        padding: kSymmetricPaddingHor,
        child: Visibility(
          visible: _isVisible,
          child: CustomButton(
            label: 'Add all to my cart',
            onPressed: () {},
          ),
        ),
      );

i have tried with Visibility widget and its work but whenever i'm deleting all data CustomButton is still visible, to invisivle CustomButton every time need to do hot reload.

NOTE: setState is also not working its giving me error.

if any one can help me! Thanks.

Solution

If you want to hide your CustomButton when there is no data you can try this:

Put your _favItemListView(data) & _addAllToFavButton(size) inside Stack and give Positioned to your CustomButton with its bottom : 1 property.

StreamBuilder

return data.isNotEmpty
       ? Stack(
          children: [
           _favItemListView(data),
           _addAllToFavButton(size),
          ],
        )
        : const Center(
           child: Text('No data found'),
        );

CustomButton:

Positioned _addAllToFavButton(Size size) => Positioned(
        width: size.width,
        bottom: 1,                        //bottom property
        child: Padding(
          padding: kSymmetricPaddingHor,
          child: CustomButton(
            label: 'Add all to my cart',
            onPressed: () {}
            },
          ),
        ),
      );

Comments

[Mohit Ratanpara]

snapshot.data!.docs is working perfectly, i want to change _isVisible to true when data.isNotEmpty and false when data.isEmpty.

[griffins]

ideally you should use setstate, but wont work during widget build

[Mohit Ratanpara]

then what should i do to update _isVisible variable without hot reloading?

[griffins]

nope, render your widget

[griffins]

check comments in the code in the answer

[Mohit Ratanpara]

it dose not work. still need to do hot reload to invisible