The getter 'visible' was called on null - flutter

Question

I am trying to create a page that consist of Search Bar, Infinite scroll product page and buttons (add product, remove product and notification). There is an error for the below statement...
The getter 'visible' was called on null,
Receiver : null,
Tried calling : null
please help me in rectifying this code.
class Inventory extends StatefulWidget {
#override
_InventoryState createState() => _InventoryState();
}
class _InventoryState extends State<Inventory> {
Color _color = Colors.white;
#override
Widget build(BuildContext context) {
double width = MediaQuery.of(context).size.width;
double height = MediaQuery.of(context).size.height;
return Scaffold(
resizeToAvoidBottomInset: false,
appBar: PreferredSize(
preferredSize: Size.fromHeight(70),
child: AppBar(
backgroundColor: Theme.Colors.darkBlue,
iconTheme: IconThemeData(size: 10, color: Colors.white),
elevation: 0,
title: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
AutoSizeText(
"Inventory ",
style: TextStyle(
fontSize: 35,
),
),
],
)),
),
drawer: MainDrawer(),
backgroundColor: Color(0xFF09182C),
body: Center(
child: Column(
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Container(
height: 70,
width: width * 0.76,
child: TextField(
decoration: InputDecoration(
contentPadding: EdgeInsets.all(10.0),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white),
),
hintText: 'Search Inventory',
hintStyle:
TextStyle(color: Color(0xFFE0E0E0), fontSize: 20),
suffixIcon: Icon(
Icons.search,
color: Colors.white,
size: 30,
)),
style: TextStyle(color: _color),
),
),
Container(
padding: EdgeInsets.only(bottom: 30.0),
child: IconButton(
onPressed: () {},
icon: Icon(Icons.filter_list,
size: 40, color: Color(0xFFFFAE40)),
),
),
],
),
LoadingPage(),
Spacer(),
Container(
margin: EdgeInsets.only(bottom: 70),
padding: EdgeInsets.only(left: 30, right: 30),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Material(
type: MaterialType.transparency,
child: Ink(
decoration: BoxDecoration(
border:
Border.all(color: Color(0xFF57D0F4), width: 2.0),
color: Colors.transparent,
shape: BoxShape.circle,
),
child: InkWell(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => AddProduct()),
);
},
child: Padding(
padding: EdgeInsets.all(13.0),
child: Icon(
Icons.add,
size: 55.0,
color: Color(0xFF57D0F4),
),
),
),
),
),
Material(
type: MaterialType.transparency,
child: Ink(
decoration: BoxDecoration(
border:
Border.all(color: Color(0xFF57D0F4), width: 2.0),
color: Colors.transparent,
shape: BoxShape.circle,
),
child: InkWell(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => RemoveProduct()),
);
},
child: Padding(
padding: EdgeInsets.all(13.0),
child: Icon(
Icons.delete_outline,
size: 55.0,
color: Color(0xFF57D0F4),
),
),
),
),
),
Material(
type: MaterialType.transparency,
child: Ink(
decoration: BoxDecoration(
border:
Border.all(color: Color(0xFF57D0F4), width: 2.0),
color: Colors.transparent,
shape: BoxShape.circle,
),
child: InkWell(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => Notify()),
);
},
child: Padding(
padding: EdgeInsets.all(13.0),
child: Icon(
Icons.notifications_none,
size: 55.0,
color: Color(0xFF57D0F4),
),
),
),
),
),
],
),
)
],
),
));
}
}
class LoadingPage extends StatefulWidget {
#override
_LoadingPageState createState() => _LoadingPageState();
}
class _LoadingPageState extends State<LoadingPage> {
List prd;
ScrollController _scrollController = ScrollController();
int _currentMax = 10;
#override
void initState() {
super.initState();
prd = List.generate(10, (i) => "Product ${i + 1}");
_scrollController.addListener(() {
if (_scrollController.position.pixels ==
_scrollController.position.maxScrollExtent) {
_getMoreData();
}
});
}
_getMoreData() {
for (int i = _currentMax; i < _currentMax + 10; i++) {
return prd.add("Product ${i + 1}");
}
_currentMax = _currentMax + 10;
setState(() {});
}
#override
Widget build(BuildContext context) {
return ListView.builder(
controller: _scrollController,
itemCount: prd.length + 1,
itemExtent: 70,
itemBuilder: (context, i) {
if (i == prd.length) {
return CupertinoActivityIndicator();
}
return ListTile(
title: AutoSizeText(prd[i]),
);
});
}
}

Answer 1

Thanks for your help #Mobina and #JohnJoe.
I wrapped the ListView.builder with Flexible which fixed the problem and added COntainer to put it inside a greyish background.
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.only(top: 10.0, bottom: 10.0),
height: 450,
width: 350,
decoration: BoxDecoration(
color: Color(0xFF707070),
borderRadius: BorderRadius.all(
Radius.circular(
10.0,
),
)),
child: Flexible(
child: ListView.builder(
controller: _scrollController,
itemCount: prd.length + 1,
itemExtent: 42.5,
itemBuilder: (context, i) {
if (i == prd.length) {
return CupertinoActivityIndicator();
}
return ListTile(
title: AutoSizeText(prd[i]),
);
}),
),
);
}