The SingleChildScrollView is not scrollable

Question

This widget renders with no errors except it is not scrollable

SingleChildScrollView(
 child: Column(
 children: [
 ListView(
 shrinkWrap: true,
 children: [
 ListTile(
 title: Row(
 children: const [
 Expanded(child: Text('text'),),
 Expanded(child: Text('text'),),
 ],
 ),
 ),
 ],
 ),
 RapportList(), // this is not scrollable
 ],
 ),
),

Where RapportList() is a stateful widget which builds a

ListView.builder(
 shrinkWrap: true,
 itemCount: _rapports.length,
 itemBuilder: (context, index) {
 return ListTile(
 title: Row(
 children: <Widget>[
 ...

I tried to wrap the ListView.builder with SingleChildScrollView but with no result. It is still not scrollable.

Answer 1

I think you just need to add:

physics: const NeverScrollableScrollPhysics(),

to your RapportList().

Here is the code I tested:

import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
 return MaterialApp(
 title: 'Flutter Demo',
 theme: ThemeData(
 primarySwatch: Colors.blue,
 ),
 home: MyHomePage(title: 'Flutter Demo Home Page'),
 );
 }
}
class MyHomePage extends StatefulWidget {
 MyHomePage({Key key, this.title}) : super(key: key);
 final String title;
 @override
 _MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
 @override
 Widget build(BuildContext context) {
 return Scaffold(
 appBar: AppBar(
 title: Text(widget.title),
 ),
 body: SingleChildScrollView(
 child: Column(
 children: <Widget>[
 ListView(
 shrinkWrap: true,
 children: <Widget>[
 ListTile(
 title: Row(
 children: const <Widget>[
 Expanded(child: Text('text'),),
 Expanded(child: Text('text'),),
 ],
 ),
 ),
 ],
 ),
 ListView.builder( //<--RapportList().
 physics: const NeverScrollableScrollPhysics(), //<--here
 shrinkWrap: true,
 itemCount: 100,
 itemBuilder: (context, index){
 return ListTile(
 title: Row(
 children: <Widget>[
 Text("ListTile with index ${index}")
 ],
 ),
 );
 },
 ),
 ],
 ),
 ),
 );
 }
}

In this way, RapportList() will not be scrollable and when you try to 'scroll' one of its elements, you will scroll the entire SingleChildScrollView();.

enter image description here

Answer 2

Wrap it with an Expanded widget: Sometimes, a SingleChildScrollView widget might not be scrollable if it doesn't have enough space to expand. You can try wrapping it with an Expanded widget to give it more space to expand vertically. For example:

Expanded(
 child: SingleChildScrollView(
 child: // your code 
 ),
)

Answer 3

@override
 Widget build(BuildContext context) {
 // TODO: implement build
 return Scaffold(body: SingleChildScrollView(
 child: Column(
 children: <Widget>[
 ListView(
 shrinkWrap: true,
 children: <Widget>[
 ListTile(
 title: Row(
 children: const <Widget>[
 Expanded(child: Text('text'),),
 Expanded(child: Text('text'),),
 ],
 ),
 ),
 ],
 ),
 SizedBox(height: 6000,),
 Text("...."),
 Container(
 ),
 ],
 ),
)
 ); 
 }
}

• Pedro Massango: Can you edit your answer and explain why your solution should work?