Why is my widget screen not displaying content? - flutter

Question

I have this page I'm trying to design in XD :
and when I ran the application to render in , the bottom side with content containing the tab did not display and I get these errors but I don't know what they exactly mean :
I/flutter (22774): The following RenderObject was being processed when the exception was fired: RenderViewport#cc2f4 NEEDS-LAYOUT
NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE: I/flutter (22774): needs
compositing I/flutter (22774): creator: Viewport ←
IgnorePointer-[GlobalKey#1f28b] ← Semantics ← _PointerListener ←
Listener ← I/flutter (22774): _GestureSemantics ←
RawGestureDetector-[LabeledGlobalKey#0f747] ←
I/flutter (22774): _PointerListener ← Listener ← _ScrollableScope
← _ScrollSemantics-[GlobalKey#03bee] ← I/flutter (22774):
RepaintBoundary ← ⋯ I/flutter (22774): parentData: (can use
size) I/flutter (22774): constraints: BoxConstraints(0.0<=w<=360.0,
0.0<=h<=Infinity) I/flutter (22774): size: MISSING I/flutter (22774): axisDirection: left I/flutter (22774):
crossAxisDirection: down I/flutter (22774): offset:
_PagePosition#dd846(offset: null, range: null..null, viewport: null, ScrollableState, I/flutter (22774): _ForceImplicitScrollPhysics ->
PageScrollPhysics -> PageScrollPhysics -> ClampingScrollPhysics ->
I/flutter (22774): ClampingScrollPhysics ->
RangeMaintainingScrollPhysics, IdleScrollActivity#2467d, I/flutter
(22774): ScrollDirection.idle) I/flutter (22774): anchor: 0.0
I/flutter (22774): This RenderObject had the following descendants
(showing up to depth 5): I/flutter (22774): center child:
_RenderSliverFractionalPadding#2da9f NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): child:
RenderSliverFillViewport#a0715 NEEDS-LAYOUT NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774):
════════════════════════════════════════════════════════════════════════════════════════════════════
I/flutter (22774): Another exception was thrown: RenderBox was not
laid out: RenderViewport#cc2f4 NEEDS-LAYOUT NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATEI/flutter (22774): Another exception was
thrown: RenderBox was not laid out: RenderViewport#cc2f4 NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): Another exception was
thrown: RenderBox was not laid out: RenderIgnorePointer#d6f43
relayoutBoundary=up10 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
I/flutter (22774): Another exception was thrown: RenderBox was not
laid out: RenderSemanticsAnnotations#55aed relayoutBoundary=up9
NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): Another
exception was thrown: RenderBox was not laid out:
RenderPointerListener#891d5 relayoutBoundary=up8 NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): Another exception was
thrown: RenderBox was not laid out:
RenderSemanticsGestureHandler#40649 relayoutBoundary=up7 NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): Another exception was
thrown: RenderBox was not laid out: RenderPointerListener#0e00a
relayoutBoundary=up6 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
I/flutter (22774): Another exception was thrown: RenderBox was not
laid out: _RenderScrollSemantics#61006 relayoutBoundary=up5
NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): Another
exception was thrown: RenderBox was not laid out:
RenderRepaintBoundary#782fb relayoutBoundary=up4 NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): Another exception was
thrown: RenderBox was not laid out: RenderCustomPaint#3bc15
relayoutBoundary=up3 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
I/flutter (22774): Another exception was thrown: RenderBox was not
laid out: RenderRepaintBoundary#e1816 relayoutBoundary=up2 NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATE I/flutter (22774): Another exception was
thrown: RenderBox was not laid out: RenderFlex#20580
relayoutBoundary=up1 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
I/flutter (22774): Another exception was thrown: NoSuchMethodError:
The method '>' was called on null.
my code is : paybills.dart file (main widget displaying both tabs)
import 'package:flutter/material.dart';
import '../../constans/constants.dart';
import 'first_tab.dart';
import 'second_tab.dart';
class PayBills extends StatefulWidget {
#override
_PayBillsState createState() => _PayBillsState();
}
class _PayBillsState extends State<PayBills>
with SingleTickerProviderStateMixin {
TabController _controller;
#override
void initState() {
super.initState();
_controller = TabController(vsync: this, length: 2);
}
#override
void dispose() {
_controller.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.white,
centerTitle: true,
elevation: 0,
title: Text(
'تسديد فاتورة',
style: TextStyle(
color: leaderLogo,
fontSize: 24,
fontFamily: 'Calibri',
),
),
),
body: Container(
child: Column(children: [
Container(
height: 93,
width: 378,
child: Align(
alignment: Alignment.topCenter,
child: TabBar(
controller: _controller,
tabs: [
Tab(
child: Center(
child: Text(
'فواتير مستحقة',
style: TextStyle(
color: Colors.black,
),
),
),
),
Tab(
child: Center(
child: Text(
'فواتير مدفوعة',
style: TextStyle(
color: Colors.black,
),
),
),
),
],
),
),
),
TabBarView(
controller: _controller,
children: [
PayBillsList(),
SecondTab(),
],
),
]),
),
);
}
}
and this is firsttab.dart file displaying the first tab :
import 'package:flutter/material.dart';
import '../../constans/constants.dart';
class BillDetails extends StatelessWidget {
final String billName;
final String billImage;
final String billDate;
const BillDetails({Key key, this.billName, this.billImage, this.billDate})
: super(key: key);
#override
Widget build(BuildContext context) {
return Card(
child: ListTile(
leading: Container(
width: 40,
height: 40,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage(billImage),
fit: BoxFit.fill,
)),
),
title: Text(
billName,
style: TextStyle(
fontFamily: 'Calibri',
fontSize: 16,
color: Colors.black,
),
),
subtitle: Text(
billDate,
style: TextStyle(
fontFamily: 'Calibri',
fontSize: 12,
color: Colors.black,
),
),
trailing: PayButton(),
),
);
}
}
class PayBillsList extends StatelessWidget {
final List<BillDetails> billsList = [
BillDetails(
billName: 'فاتورة كهرباء',
billImage: 'assets/images/electricity.png',
billDate: '30 / 4 / 2020',
),
BillDetails(
billName: 'فاتورة مياه',
billImage: 'assets/images/water.png',
billDate: '30 / 4 / 2020',
),
];
#override
Widget build(BuildContext context) {
return Container(
width: 378,
height: 93,
decoration: BoxDecoration(
border: Border.all(
width: 1,
color: Colors.grey,
),
shape: BoxShape.circle,
),
child: ListView.builder(
itemBuilder: (context, index) {
return BillDetails(
billName: billsList.elementAt(index).billName,
billImage: billsList.elementAt(index).billImage,
billDate: billsList.elementAt(index).billDate,
);
},
shrinkWrap: true,
itemCount: billsList.length,
scrollDirection: Axis.vertical,
),
);
}
}
class PayButton extends StatelessWidget {
const PayButton({
Key key,
}) : super(key: key);
#override
Widget build(BuildContext context) {
return ButtonTheme(
minWidth: 80,
height: 40,
child: RaisedButton(
onPressed: () {},
color: raisedButtonColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0),
),
child: Center(
child: Text(
//Login button text properties
'دفع',
style: TextStyle(
color: Colors.white,
fontSize: 18,
fontFamily: 'Calibri',
)),
),
),
);
}
}