I have a UI like this:
The ListView still appears, but the last element is not visible unless I scroll down and hold it. Why is that? I want the items to be fully visible when I scroll. I use a Stack because the list is overlaid on top of the image, that's why I did it that way. Help me!
This code:
SafeArea(
child: Stack(
children: [
Image.asset(
AppImages.backgroundTechnicalSupport,
fit: BoxFit.fill,
),
Positioned(
top: 20,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: PaddingConstants.h20R,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
LocaleKeys.technicalSupport_title.tr(),
maxLines: 2,
style: TextStyle(
fontSize: 24.zsp(context),
fontWeight: FontWeight.w600,
color: Colors.white,
),
),
],
),
),
],
),
),
Positioned(
top: 280.wh,
child: Container(
width: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
borderRadius: BorderRadiusConstants.tl15tr15,
color: ThemeHelper.backgroundRealm(context),
),
padding: PaddingConstants.h20v10R,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
14.wVerticalSpace,
Text(
LocaleKeys.technicalSupport_supportType.tr(),
style: TextStyle(
fontSize: 20.zsp(context),
fontWeight: FontWeight.w600,
color: ThemeHelper.black(context),
),
),
16.wVerticalSpace,
Container(
constraints: BoxConstraints(
maxHeight:
MediaQuery.of(context).size.height - 260.wh,
),
child: ListView.separated(
shrinkWrap: true,
itemBuilder: (_, index) {
return Container(
padding: PaddingConstants.h20v10R,
decoration: BoxDecoration(
border: Border.all(
color: ThemeHelper
.borderDateMeetingRoom(context),
),
borderRadius:
BorderRadiusConstants.c15wr,
),
child: Row(
children: [
16.wHorizontalSpace,
Expanded(
child: Padding(
padding: PaddingConstants.v20R,
child: Text(
'Cai dat tai khoan',
style: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 18.zsp(context),
color: ThemeHelper
.primaryBlueColor(
context),
),
),
),
),
SvgPicture.asset(
AppImages.arrowRight,
colorFilter:
ThemeHelper.primaryBlueColor(
context)
.toSvgColor,
),
],
),
);
},
separatorBuilder: (_, __) =>
15.wVerticalSpace,
itemCount: 6,
)
),
],
),
),
),
],
),
)
Im not good in english, sorry for this
This is demo code also i am providing dart pad code https://dartpad.dev/?id=e75b493dae1287757c5e1d77a0dc73f1 so you can checkout if any error or issue in your code then message me if it's work then up vote.
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: SafeArea(
child: Stack(
children: [
// Image.asset(
// AppImages.backgroundTechnicalSupport,
// fit: BoxFit.fill,
// ),
Positioned(
top: 20,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding:EdgeInsets.only(right: 20),
// padding: PaddingConstants.h20R,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
// LocaleKeys.technicalSupport_title.tr(),
"Testing"
, maxLines: 2,
style: TextStyle(
fontSize: 24,//.zsp(context),
fontWeight: FontWeight.w600,
color: Colors.white,
),
),
],
),
),
],
),
),
Positioned.fill(
top: 280,
child: Container(
width: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
// borderRadius: BorderRadiusConstants.tl15tr15,
// color: ThemeHelper.backgroundRealm(context),
),
// padding: PaddingConstants.h20v10R,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// 14.wVerticalSpace,
Text(
// LocaleKeys.technicalSupport_supportType.tr(),
"Test",
style: TextStyle(
// fontSize: 20.zsp(context),
fontWeight: FontWeight.w600,
// color: ThemeHelper.black(context),
),
),
// 16.wVerticalSpace,
Expanded(
// constraints: BoxConstraints(
// // maxHeight:
// // MediaQuery.of(context).size.height - 260.wh,
// ),
child: ListView.separated(
shrinkWrap: true,
itemBuilder: (_, index) {
return Container(
// padding: PaddingConstants.h20v10R,
decoration: BoxDecoration(
border: Border.all(
// color: ThemeHelper
// .borderDateMeetingRoom(context),
),
// borderRadius:
// BorderRadiusConstants.c15wr,
),
child: Row(
children: [
// 16.wHorizontalSpace,
Expanded(
child: Text(
'Cai dat tai khoan $index',
style: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 18,//.zsp(context),
// color: ThemeHelper
// .primaryBlueColor(
// context),
),
),
),
// SvgPicture.asset(
// AppImages.arrowRight,
// colorFilter:
// ThemeHelper.primaryBlueColor(
// context)
// .toSvgColor,
// ),
],
),
);
},
separatorBuilder: (_, __) =>SizedBox(height:15,),
// 15.wVerticalSpace,
itemCount: 60,
)
),
],
),
),
),
],
),
)
)
);
}
}