I cant get my listview.builder to scroll inside a column which is inside a container which is inside a stack
Listview.builder code
SizedBox( height: 150.h, width: width, child: ListView.builder( scrollDirection: Axis.horizontal, shrinkWrap: true, itemCount: 10, physics: const BouncingScrollPhysics(), itemBuilder: (context, index) { return Padding( padding: EdgeInsets.only(left: 24.0.w, right: 16.w), child: Container( width: 319.w, height: 150.h, decoration: BoxDecoration( borderRadius: BorderRadius.circular(16.r), color: secondaryColor), child: Padding( padding: const EdgeInsets.all(16.0), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Row( children: [ CircleAvatar( radius: 16.r, backgroundColor: primaryColor, child: Image.asset( Assets.reviewsImagesRione, width: 32.w, height: 32.h, ), ), addHorizontalSpacing(8.w), Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text('Sharon gem', style: kNormalStyleWhite.copyWith( fontSize: 16.sp, fontWeight: FontWeight.w600), ), Text('2 days ago', style: kNormalStyleWhite.copyWith( fontSize: 12.sp, ), ), ], ), ], ), addVerticalSpacing(8.h), Text('Had such an amazing session with Maria. She instantly picked up on the level of my fitness and adjusted the workout to suit me whilst also pushing me to my limits.', style: kNormalStyleWhite.copyWith( fontSize: 13.sp, ), ), ], ), )), ); }), ),Full screen code
// ignore_for_file: prefer_const_literals_to_create_immutablesimport 'package:dev_muscles/constants/colors.dart';import 'package:dev_muscles/constants/styles.dart';import 'package:dev_muscles/custom_paints/achievements.dart';import 'package:dev_muscles/generated/assets.dart';import 'package:dev_muscles/ui/widgets/reused_heading.dart';import 'package:dev_muscles/ui/widgets/reviews_avatar%20widget.dart';import 'package:dev_muscles/ui/widgets/spacings.dart';import 'package:flutter/material.dart';import 'package:flutter_screenutil/flutter_screenutil.dart';class TrainerDetails extends StatefulWidget { const TrainerDetails({super.key}); @override State<TrainerDetails> createState() => _TrainerDetailsState();}class _TrainerDetailsState extends State<TrainerDetails> { @override Widget build(BuildContext context) { final width = MediaQuery.of(context).size.width; return Scaffold( backgroundColor: backgroundColor, body: Stack( clipBehavior: Clip.none, children: [ Image.asset(Assets.imagesTrainerDetailImage), Positioned( top: 45.h, left: 20.w, child: CircleAvatar( radius: 16.r, backgroundColor: textColorWhite.withOpacity(0.2), child: Center( child: IconButton( icon: const Icon(Icons.arrow_back_ios), onPressed: () { Navigator.pop(context); }, color: textColorWhite, ), ), ), ), Positioned( top: 250, child: Container( height: 611.h, width: width, decoration: BoxDecoration( color: backgroundColor, borderRadius: BorderRadius.only( topRight: Radius.circular(30.r), topLeft: Radius.circular(30.r), ), ), child: Column( children: [ Padding( padding: EdgeInsets.only( left: 8.w, right: 8.w, top: 16.h, bottom: 16.h), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text('Jennifer James', style: TextStyle( color: textColorWhite, fontSize: 24.sp, fontWeight: FontWeight.w600, ), ), addVerticalSpacing(8.h), Text('Functional Strength', style: TextStyle( color: textColorWhite.withOpacity(0.5), fontSize: 14.sp, ), ), ], ), // call phone button CircleAvatar( radius: 27.r, backgroundColor: primaryColor, child: Image.asset( Assets.iconsCallIcon, width: 19.w, height: 19.h, ), ) ], ), ), Padding( padding: const EdgeInsets.all(8.0), child: CustomPaint( size: Size( 327.w, (327.w * 0.3333333333333333) .toDouble()), //You can Replace [WIDTH] with your desired width for Custom Paint and height will be calculated automatically painter: AchievementCustomPainter(), child: Padding( padding: const EdgeInsets.only( left: 32, top: 19, right: 32, bottom: 19), child: Row( mainAxisAlignment: MainAxisAlignment.spaceAround, children: [ Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Text('6', style: kNormalStyleWhite.copyWith(fontSize: 22), ), Text('Experience', style: kNormalStyleWhite.copyWith(fontSize: 11), ) ], ), Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Text('46', style: kNormalStyleWhite.copyWith(fontSize: 22), ), Text('Completed', style: kNormalStyleWhite.copyWith(fontSize: 11), ) ], ), Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Text('65', style: kNormalStyleWhite.copyWith(fontSize: 22), ), Text('Active clients', style: kNormalStyleWhite.copyWith(fontSize: 11), ) ], ), ], ), ), ), ), const ReusedHeader( heading: 'Reviews', subHeading: '', ), addVerticalSpacing(14.h), Padding( padding: EdgeInsets.only(left: 8.0.w, right: 8.0.w), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ ProgressiveAvatars( numberOfAvatars: 4, avatarRadius: 16.r, height: 32.h, extraAvatarText: '174', imageUrls: [ Assets.reviewsImagesRione, Assets.reviewsImagesRitwo, Assets.reviewsImagesRithree, Assets.reviewsImagesRifour, ], ), Text('Read all reviews', style: kNormalStyleWhite.copyWith( fontSize: 14.sp, color: primaryColor)), ]), ), addVerticalSpacing(32.h), SizedBox( height: 150.h, width: width, child: ListView.builder( scrollDirection: Axis.horizontal, shrinkWrap: true, itemCount: 10, physics: const BouncingScrollPhysics(), itemBuilder: (context, index) { return Padding( padding: EdgeInsets.only(left: 24.0.w, right: 16.w), child: Container( width: 319.w, height: 150.h, decoration: BoxDecoration( borderRadius: BorderRadius.circular(16.r), color: secondaryColor), child: Padding( padding: const EdgeInsets.all(16.0), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Row( children: [ CircleAvatar( radius: 16.r, backgroundColor: primaryColor, child: Image.asset( Assets.reviewsImagesRione, width: 32.w, height: 32.h, ), ), addHorizontalSpacing(8.w), Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text('Sharon gem', style: kNormalStyleWhite.copyWith( fontSize: 16.sp, fontWeight: FontWeight.w600), ), Text('2 days ago', style: kNormalStyleWhite.copyWith( fontSize: 12.sp, ), ), ], ), ], ), addVerticalSpacing(8.h), Text('Had such an amazing session with Maria. She instantly picked up on the level of my fitness and adjusted the workout to suit me whilst also pushing me to my limits.', style: kNormalStyleWhite.copyWith( fontSize: 13.sp, ), ), ], ), )), ); }), ), ], ), ), ) ], ), ); }}What modifications do i need to do? The first generated widget is showing but it isnt scrolling, and if i reduce the width of the generated widget, i can see that it shows a couple of them but still doesnt scroll to reveal the rest.
Any help would be greatly appreciated
