how to make this table scrollable to bottom - flutter

Question

i am beginner in flutter , i wrote a code with a leagueboard table from api , after i executed i found that my table is not scrolling , the scroll appears only on the top but no scrolling to bottom
here what i have tried:
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:http/http.dart' as http;
class LeagueBoard extends StatefulWidget {
#override
_LeagueBoardState createState() => _LeagueBoardState();
}
class _LeagueBoardState extends State<LeagueBoard> {
List<Club> clubs = [];
getTable() async {
http.Response response = await http.get(
'http://api.football-data.org/v2/competitions/PL/standings',
headers: {'X-Auth-Token': '86014f6025ae430dba078acc94bb2647'});
String body = response.body;
Map data = jsonDecode(body);
List table = data['standings'][0]['table'];
// for (var team in table) {
// clubs.add(Club(team['team']['crestUrl'].toString(), team['position'].toString(),team['points'].toString(),team['points'].toString(),team['playedGames'].toString(),team['won'].toString(),
// team['draw'].toString(),team['lost'].toString(),team['goalsFor'],team['goalsAgainst']));
// print(team);
// }
// for (var team in table) {
// clubs.add(Club(team['team']['crestUrl'].toString(), team['position'].toString(),team['points'].toString(),team['points'].toString(),team['playedGames'].toString(),team['won'].toString(),
// team['draw'].toString(),team['lost'].toString(),team['goalsFor'],team['goalsAgainst']));
// print(team);
// }
// for (var team in clubs) {
// debugPrint(team.toString());
// }
setState(() {
for (var team in table) {
clubs.add(Club(team['team']['name'],team['team']['crestUrl'], team['position'].toString(),team['points'].toString(),team['playedGames'].toString(),team['won'].toString(),
team['draw'].toString(),team['lost'].toString(),team['goalsFor'],team['goalsAgainst']));
print("hello");
}
});
}
// List<Club> clubs = [ Club("Manchester City","https://upload.wikimedia.org/wikipedia/fr/thumb/b/ba/Logo_Manchester_City_2016.svg/1200px-Logo_Manchester_City_2016.svg.png","1","77","17","15","1","1",25,5),
// Club("Chelsea","https://upload.wikimedia.org/wikipedia/fr/thumb/5/51/Logo_Chelsea.svg/768px-Logo_Chelsea.svg.png","2","70","17","13","2","3",19,8),
// Club("Manchester City","https://upload.wikimedia.org/wikipedia/fr/thumb/b/ba/Logo_Manchester_City_2016.svg/1200px-Logo_Manchester_City_2016.svg.png","1","77","17","15","1","1",25,5),
// Club("Chelsea","https://upload.wikimedia.org/wikipedia/fr/thumb/5/51/Logo_Chelsea.svg/768px-Logo_Chelsea.svg.png","2","70","17","13","2","3",19,8),
// Club("Manchester City","https://upload.wikimedia.org/wikipedia/fr/thumb/b/ba/Logo_Manchester_City_2016.svg/1200px-Logo_Manchester_City_2016.svg.png","1","77","17","15","1","1",25,5),
// Club("Chelsea","https://upload.wikimedia.org/wikipedia/fr/thumb/5/51/Logo_Chelsea.svg/768px-Logo_Chelsea.svg.png","2","70","17","13","2","3",19,8),
// Club("Manchester City","https://upload.wikimedia.org/wikipedia/fr/thumb/b/ba/Logo_Manchester_City_2016.svg/1200px-Logo_Manchester_City_2016.svg.png","1","77","17","15","1","1",25,5),
// Club("Chelsea","https://upload.wikimedia.org/wikipedia/fr/thumb/5/51/Logo_Chelsea.svg/768px-Logo_Chelsea.svg.png","2","70","17","13","2","3",19,8),
// Club("Manchester City","https://upload.wikimedia.org/wikipedia/fr/thumb/b/ba/Logo_Manchester_City_2016.svg/1200px-Logo_Manchester_City_2016.svg.png","1","77","17","15","1","1",25,5),
// Club("Chelsea","https://upload.wikimedia.org/wikipedia/fr/thumb/5/51/Logo_Chelsea.svg/768px-Logo_Chelsea.svg.png","2","70","17","13","2","3",19,8),
// Club("Manchester City","https://upload.wikimedia.org/wikipedia/fr/thumb/b/ba/Logo_Manchester_City_2016.svg/1200px-Logo_Manchester_City_2016.svg.png","1","77","17","15","1","1",25,5),
// Club("Chelsea","https://upload.wikimedia.org/wikipedia/fr/thumb/5/51/Logo_Chelsea.svg/768px-Logo_Chelsea.svg.png","2","70","17","13","2","3",19,8),
// Club("Manchester City","https://upload.wikimedia.org/wikipedia/fr/thumb/b/ba/Logo_Manchester_City_2016.svg/1200px-Logo_Manchester_City_2016.svg.png","1","77","17","15","1","1",25,5),
// Club("Chelsea","https://upload.wikimedia.org/wikipedia/fr/thumb/5/51/Logo_Chelsea.svg/768px-Logo_Chelsea.svg.png","2","70","17","13","2","3",19,8),];
#override
void initState() {
super.initState();
getTable();
}
#override
Widget build(BuildContext context) {
return clubs == null
? Container(
color: Colors.white,
child: Center(
child: CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(
Color(0xFFe70066),
),
),
),
)
: Scaffold(
appBar: AppBar(
title: Text("LeagueBoard"),
backgroundColor: Colors.blue[300],
elevation: 0.0,
),
body: SingleChildScrollView(
child: Column(
children: [
TopRow(),
ListView.builder(
shrinkWrap: true,
// physics: NeverScrollableScrollPhysics(),
itemCount: clubs.length,
itemBuilder: (context, index) {
return TableRow(index: index, clubs:clubs);
},
),
],
),
),
);
}
}
class TopRow extends StatelessWidget {
const TopRow({
Key key,
}) : super(key: key);
#override
Widget build(BuildContext context) {
TextStyle textStyle = TextStyle(fontSize: 11, fontWeight: FontWeight.bold);
TextStyle textStyle2 = TextStyle(fontSize: 13);
return Container(
child: Row(
children: [
Container(
alignment: Alignment.center,
width: 30,
height: 30,
child: Text('#'),
),
SizedBox(width: 20),
Container(alignment: Alignment.center, child: Text('Team')),
Spacer(),
Container(
width: 28,
child: Text('MP', style: textStyle),
),
SizedBox(
width: 5,
),
Container(
width: 28,
child: Text('W', style: textStyle),
),
SizedBox(
width: 5,
),
Container(
width: 28,
child: Text('D', style: textStyle),
),
SizedBox(
width: 5,
),
Container(
width: 28,
child: Text('L', style: textStyle),
),
SizedBox(
width: 5,
),
Container(
width: 28,
child: Text('GD', style: textStyle),
),
SizedBox(
width: 5,
),
Container(
width: 28,
child: Text('Pts', style: textStyle),
),
SizedBox(
width: 5,
),
Container(
width: 5,
height: 20,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(5),
color: Colors.grey[800],
),
padding: EdgeInsets.fromLTRB(10, 5, 2, 5),
),
],
),
);
}
}
class TableRow extends StatelessWidget {
final int index;
final List<Club> clubs;
const TableRow({
this.index,
this.clubs,
Key key,
}) : super(key: key);
/////////////////////////////////////////////////////////////////////linkwell
////////////////////////////////////////////////////////////////////
#override
Widget build(BuildContext context) {
TextStyle textStyle = TextStyle(fontSize: 11, fontWeight: FontWeight.bold);
TextStyle textStyle2 = TextStyle(fontSize: 13, fontWeight: FontWeight.bold);
return Container(
width: double.infinity,
height: 40,
decoration: BoxDecoration(
border: Border.all(color: Colors.black38, width: 0.2),
color: index == 0 ? Colors.yellow[100] : Colors.purpleAccent[20],
),
child: Row(
children: [
Container(//iinkwell
alignment: Alignment.center,
width: 30,
height: 40,
color: index < 2
? Colors.blue
: index == 2
? Colors.red[400]
: index > 11
? Colors.red[800]
: Colors.grey[700],
child: Text(
(index + 1).toString(),
style: TextStyle(color: Colors.white),
),
),
SizedBox(width: 20),
Row(children: [
SvgPicture.network(clubs[index].image,
width: 24.0, height: 24.0,
),
SizedBox(width: 5.0),
clubs[index].name.length > 11
? Text(clubs[index].name
.toString()
.substring(0, 11) +
'...')
: Text(clubs[index].name.toString(), style: textStyle2),
],),
Spacer(),
Container(
width: 28,
child: Text(clubs[index].matches, style: textStyle2),
),
SizedBox(
width: 5,
),
Container(
width: 28,
child: Text(clubs[index].wins, style: textStyle2),
),
SizedBox(
width: 5,
),
Container(
width: 28,
child: Text(clubs[index].draws, style: textStyle2),
),
SizedBox(
width: 5,
),
Container(
width: 28,
child: Text(clubs[index].loss, style: textStyle2),
),
SizedBox(
width: 5,
),
Container(
width: 28,
child: Text((clubs[index].goals - clubs[index].goalsIn).toString(), style: textStyle2),
),
SizedBox(
width: 5,
),
Container(
width: 28,
child: Text(clubs[index].points, style: textStyle2),
),
SizedBox(
width: 5,
),
Container(
width: 5,
height: 20,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(5),
color: Colors.grey[600],
),
padding: EdgeInsets.fromLTRB(10, 5, 2, 5),
),
],
),
);
}
}
class Club {
String name;
String image;
String rank;
String points;
String matches;
String wins;
String loss;
String draws;
int goals;
int goalsIn;
Club(this.name,this.image,this.rank,this.points, this.matches,this.wins,this.loss,this.draws,this.goals,this.goalsIn);
}
I am trying to make my table scrolling because i can not see all of the teams that came from becand due to non scrolling reasons

Answer 1

You are using ListView inside SingleChildScrollView. So set that ListView as non-primary.
primary: false
Change at this point in your code
ListView.builder(
shrinkWrap: true,
primary: false,
// physics: NeverScrollableScrollPhysics(),
itemCount: clubs.length,
itemBuilder: (context, index) {
return TableRow(index: index, clubs:clubs);
},
),