Search code examples
flutterfirebaselistview

flutter: ListView inside Expanded widget is not scrolling in my flutter app


I want to only scrollable my listtile item. but its not working. If I use the SingleChildScrollView wrap Column widget then it's scrolling but only when I click the column item, not listTile item.

here is my output here is my output my expected output is https://prnt.sc/URbiBkWLuXRZ here is my code

SafeArea(
    child: Column(
      children: [
        Expanded(flex: 2, child: customAdminDashboard()),
        Expanded(
            flex: 3,
            child: Column(
              children: [
                const Center(
                    child: Text(
                  "Details of Member",
                  style: TextStyle(
                      fontSize: 18,
                      fontFamily: "Montserrat-BoldItalic",
                      color: Color(0xffed8073)),
                )),
                Padding(
                  padding: const EdgeInsets.only(
                      left: 20, right: 20, top: 2, bottom: 2),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: const [
                      Text(
                        "Member Name",
                        style: TextStyle(
                            fontSize: 18, color: Color(0xff925093)),
                      ),
                      Text("Balance",
                          style: TextStyle(
                              fontSize: 18, color: Color(0xff925093))),
                    ],
                  ),
                ),
                StreamBuilder<QuerySnapshot>(
                  stream: FirebaseFirestore.instance
                      .collection("User-data")
                      .snapshots(),
                  builder: (BuildContext context,
                      AsyncSnapshot<QuerySnapshot> snapshot) {
                    if (snapshot.hasError) {
                      return Text('Something went wrong');
                    }

                    if (snapshot.connectionState ==
                        ConnectionState.waiting) {
                      return Text("Loading");
                    }

                    return ListView.builder(
                        shrinkWrap: true,
                        physics: AlwaysScrollableScrollPhysics(),
                        scrollDirection: Axis.vertical,
                        itemCount: snapshot.data!.docs.length,
                        itemBuilder: (_, index) {
                          DocumentSnapshot _DocumentSnapshot =
                              snapshot.data!.docs[index];
                          return ListTile(
                            leading: Text(_DocumentSnapshot['Name']),
                            trailing: Text(
                                _DocumentSnapshot['Balance'].toString()),
                          );
                        });
                  },
                )
              ],
            ))
      ],
    ),
  ),

I want to scrollable my listTile item only

ListView.builder(
                        shrinkWrap: true,
                        physics: AlwaysScrollableScrollPhysics(),
                        scrollDirection: Axis.vertical,
                        itemCount: snapshot.data!.docs.length,
                        itemBuilder: (_, index) {
                          DocumentSnapshot _DocumentSnapshot =
                              snapshot.data!.docs[index];
                          return ListTile(
                            leading: Text(_DocumentSnapshot['Name']),
                            trailing: Text(
                                _DocumentSnapshot['Balance'].toString()),
                          );
                        })

Solution

  • SafeArea(
          child: Column(
            children: [
              Expanded(flex: 2, child: customAdminDashboard()),
              Expanded(
                  flex: 3,
                  child: Column(
                    children: [
                      const Center(
                          child: Text(
                            "Details of Member",
                            style: TextStyle(
                                fontSize: 18,
                                fontFamily: "Montserrat-BoldItalic",
                                color: Color(0xffed8073)),
                          )),
                      Padding(
                        padding: const EdgeInsets.only(
                            left: 20, right: 20, top: 2, bottom: 2),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: const [
                            Text(
                              "Member Name",
                              style: TextStyle(
                                  fontSize: 18, color: Color(0xff925093)),
                            ),
                            Text("Balance",
                                style: TextStyle(
                                    fontSize: 18, color: Color(0xff925093))),
                          ],
                        ),
                      ),
                      Expanded(
                        child: SingleChildScrollView(
                          child: StreamBuilder<QuerySnapshot>(
                            stream: FirebaseFirestore.instance
                                .collection("User-data")
                                .snapshots(),
                            builder: (BuildContext context,
                                AsyncSnapshot<QuerySnapshot> snapshot) {
                              if (snapshot.hasError) {
                                return Text('Something went wrong');
                              }
    
                              if (snapshot.connectionState ==
                                  ConnectionState.waiting) {
                                return Text("Loading");
                              }
    
                              return ListView.builder(
                                  shrinkWrap: true,
                                  physics: NeverScrollableScrollPhysics(),
                                  scrollDirection: Axis.vertical,
                                  itemCount: snapshot.data!.docs.length,
                                  itemBuilder: (_, index) {
                                    DocumentSnapshot _DocumentSnapshot =
                                    snapshot.data!.docs[index];
                                    return ListTile(
                                      leading: Text(_DocumentSnapshot['Name']),
                                      trailing: Text(
                                          _DocumentSnapshot['Balance'].toString()),
                                    );
                                  });
                            },
                          ),
                        ),
                      )
                    ],
                  ))
            ],
          ),
        );
    

    Please try this