This code is displaying screen like below in which when we scroll the list of transaction its going beyond specific area of widget(i.e. White coloured screen area).But it needs to be scrolled without going beyond white screen. Can anyone guide me regarding it.I have taken list view and card inside expanded widge.
class InvTransactions extends StatefulWidget {
@override
State<InvTransactions> createState() => _InvTransactionsState();
}
class _InvTransactionsState extends State<InvTransactions> {
int currentIndex = 0;
List docs = ['1', '2', '3', '4', '5', '6'];
@override
Widget build(BuildContext context) {
GetCompany company = GetCompany();
int? indexOfCompany = getIt<SharedPreferences>().getInt('companyIndex');
if (indexOfCompany != null) {
company =
Provider.of<TransactionManager>(context).companyList[indexOfCompany];
}
// List<Widget> screens = [
PaidInvoices();
dynamic companyId = getIt<SharedPreferences>().getString('companyId');
return LayoutBuilder(builder: (context, constraints) {
double maxHeight = constraints.maxHeight;
double maxWidth = constraints.maxWidth;
double h1p = maxHeight * 0.01;
double h10p = maxHeight * 0.1;
double w10p = maxWidth * 0.1;
return Scaffold(
backgroundColor: Colours.black,
body: ProgressHUD(
child: Builder(
builder: (context) {
final progress = ProgressHUD.of(context);
return Column(children: [
Container(
child: Column(children: [
Padding(
padding: const EdgeInsets.only(
left: 19,
right: 7,
top: 70,
),
// mainAxisAlignment: MainAxisAlignment.spaceBetween,
child: Container(
height: h10p * 2.6,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
SizedBox(
width: w10p * 1.2,
height: h10p * 0.3,
child:
Image.asset("assets/images/xuriti1.png"),
),
// const Text(
// "Level 2",
// style: TextStyle(color: Colours.white),
// )
GestureDetector(
onTap: () {
progress!.show();
Navigator.pushNamed(
context, homeCompanyList);
progress.dismiss();
},
child: Container(
height: 50,
width: 50,
decoration: BoxDecoration(
borderRadius:
BorderRadius.circular(100),
border: Border.all(
width: 1, color: Colors.white)
//more than 50% of width makes circle
),
child: Icon(
Icons.business_center,
color: Colours.tangerine,
),
))
],
),
SizedBox(
height: 12,
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
// crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
'Transaction Statement',
style: TextStyle(
color: Color.fromARGB(255, 228, 131, 20),
fontSize: 25,
fontWeight: FontWeight.bold),
),
],
),
Padding(
padding: const EdgeInsets.only(
left: 15,
right: 15,
top: 45,
),
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
'INV_0098',
style: TextStyle(
color: Color.fromARGB(
255, 255, 255, 255),
fontSize: 16,
),
),
SizedBox(
height: 7,
),
Text(
'AVISHEK_TEST_SELLER',
style: TextStyle(
color: Color.fromARGB(
255, 255, 255, 255),
fontSize: 12,
),
)
],
),
Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
'Invoice Date',
style: TextStyle(
color: Color.fromARGB(
255, 250, 250, 250),
fontSize: 16,
),
),
SizedBox(
height: 7,
),
Text(
' 21/09/2022',
style: TextStyle(
color: Color.fromARGB(
255, 248, 248, 248),
fontSize: 12,
),
),
],
),
],
),
)
],
),
),
),
]),
),
Expanded(
child: Container(
width: maxWidth,
height: maxHeight,
// height: h10p*3,
decoration: const BoxDecoration(
color: Colours.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(26),
topRight: Radius.circular(26),
)),
child: ListView.builder(
itemCount: 9,
itemBuilder: (context, index) {
return Padding(
padding:
const EdgeInsets.symmetric(vertical: 2),
child: Card(
shadowColor: Colors.black,
elevation: 7,
child: Padding(
padding: const EdgeInsets.all(5),
child: Column(
// mainAxisAlignment:
// MainAxisAlignment.spaceAround,
children: [
Padding(
padding: const EdgeInsets.all(11),
child: Row(
mainAxisAlignment:
MainAxisAlignment
.spaceBetween,
children: [
Column(
children: [
Text(
"Transaction Type",
style: TextStyle(
fontSize: 12,
),
),
Text(
"Cr",
style: TextStyle(
fontSize: 15,
fontWeight:
FontWeight
.bold),
),
],
),
Column(
children: [
Text(
"Transaction Amount",
style: TextStyle(
fontSize: 12,
),
),
Text(
"34890",
style: TextStyle(
fontSize: 15,
fontWeight:
FontWeight
.bold),
),
],
),
],
),
),
Padding(
padding: const EdgeInsets.all(11),
child: Row(
mainAxisAlignment:
MainAxisAlignment
.spaceBetween,
children: [
Column(
children: [
Text(
"Transaction Date",
style: TextStyle(
fontSize: 12,
),
),
Text(
"23/09/2023",
style: TextStyle(
fontSize: 15,
fontWeight:
FontWeight
.bold),
),
],
),
Column(
children: [
Text(
"Remark",
style: TextStyle(
fontSize: 12,
),
),
Text(
"Discount applied",
style: TextStyle(
fontSize: 15,
fontWeight:
FontWeight
.bold),
),
],
)
],
),
),
Padding(
padding: const EdgeInsets.all(11),
child: Row(
mainAxisAlignment:
MainAxisAlignment
.spaceBetween,
children: [
Column(
children: [
Text(
"Interest",
style: TextStyle(
fontSize: 12,
),
),
Text(
"2023",
style: TextStyle(
fontSize: 15,
fontWeight:
FontWeight
.bold),
),
],
),
Column(
children: [
Text(
"Discount",
style: TextStyle(
fontSize: 12,
),
),
Text(
"1987",
style: TextStyle(
fontSize: 15,
fontWeight:
FontWeight
.bold),
),
],
)
],
),
),
],
),
)));
})))
]);
},
),
),
);
});
}
}
