Home > OS >  How can I enable scrolling to work ListTiles are embedded within SingleChildScrollView
How can I enable scrolling to work ListTiles are embedded within SingleChildScrollView

Time:10-03

I have the following SingleChildScrollView and I would like to be able to scroll when the user moves their finger up and down where the ListTiles are displayed. It seems that the tap detection of the list tiles obscures the scrolling which makes sense in a way, but how do I get it to do both (tap and scroll)?

My code looks like below:

return Scaffold(
      appBar: AppBar(title: Text('Exersizes'),),
      body: Column(
        children: [
          Container(
            height: MediaQuery.of(context).size.height * 0.7,
            child: SingleChildScrollView(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(
                    'Exersizes',
                    style: TextStyle(
                      fontSize: 20,
                      fontWeight: FontWeight.bold
                    ),  
                  ),
                  FutureBuilder(
                    future: DBProvider.getData('exerscises'),
                    builder: (ctx, AsyncSnapshot<List<Map<String, dynamic>>> snapshot) => snapshot.connectionState == ConnectionState.waiting
                      ? CircularProgressIndicator()
                      : ListView.builder(
                          shrinkWrap: true,
                          itemCount: snapshot.data!.length,
                          itemBuilder: (ctx, i) => ListTile(
                            title: Text(snapshot.data![i]['exersizeName']),
                            subtitle: snapshot.data![i]['iscardio'] == 1 ? Text('Type: cardio') : Text('Type: weights'),
                            leading: CircleAvatar(
                              backgroundColor: Theme.of(context).primaryColor,
                              child: FittedBox(child: Text(_weekDays[snapshot.data![i]['weekday']]!)),
                                        
                            ),
                            onTap: () {print(snapshot.data![i]['exersizeName']);},
                          )
                        ),
                    ),
          
                ],),
            ),
          ),
          ElevatedButton(
            onPressed: () => Navigator.of(context).pushNamed(FormScreen.routeName), 
            child: Text('Add Exersize')
          )

        ],

      ),
      
    );

CodePudding user response:

If you're having SingleChildScrollView, then you should disable the scrolling of ListView.builder. Try adding NeverScrollableScrollPhysics to physics in the ListView.builder

  • Related