I am trying to include a listview in an already scrollable Column inside an AlertDialog. I saw that if I used NeverScrollablePhysics(), shrinkWrap: true & a SingleChildScrollView() it should work.
I tried solutions I saw on multiple other questions here on StackOverflow & Medium but none of them work here, I suspect the fact it is into a Dialog to cause the issue.
Here is the code of my showDialog method:
showDialog(
context: context,
builder: (context) {
return AlertDialog(
scrollable: true,
insetPadding: EdgeInsets.symmetric(
// vertical: context.height * 0.05,
horizontal: context.width * 0.05,
),
contentPadding: EdgeInsets.symmetric(
vertical: context.height * 0.02,
horizontal: context.width * 0.05,
),
title: Text(
"Booster '${post.title}'",
style: TextStyle(
color: context.thirdColor,
fontSize: context.width * 0.05,
fontWeight: FontWeight.bold,
),
),
content: StatefulBuilder(builder: (context, refresh) {
return SingleChildScrollView(
physics: ScrollPhysics(),
child: Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
height: context.height * 0.06,
width: context.width,
padding: EdgeInsets.symmetric(
horizontal: context.width * 0.02,
),
child: Text(
"Choisissez parmi nos offres pour booster votre annonce",
style: TextStyle(
color: const Color.fromARGB(
255,
87,
87,
87,
),
fontSize: context.height * 0.017,
fontWeight: FontWeight.w500,
),
),
),
Container(
height: context.width * 0.06,
child: Text(
"Les boosts",
style: TextStyle(
color: context.secondaryColor,
fontSize: context.height * 0.02,
fontWeight: FontWeight.bold,
),
),
),
Expanded(
// constraints: BoxConstraints(
// minHeight: context.height * 0.15,
// ),
// width: context.width * 0.9,
child: ListView.builder(
itemCount: getBoosts().length,
physics: NeverScrollableScrollPhysics(),
shrinkWrap: true,
itemBuilder: (context, index) {
Map<String, dynamic> boost = getBoosts()[index];
return ListTile(
contentPadding: EdgeInsets.zero,
dense: true,
tileColor: boost["name"] == selectedBoost["name"]
? context.thirdColor.withOpacity(0.1)
: Colors.transparent,
onTap: () {
if (boost["name"] != selectedBoost["name"]) {
selectedBoost = boost;
refresh(() {});
} else {
selectedBoost = {};
refresh(() {});
}
},
leading: //radio selected if boost["name"] == selectedBoost["name"]
SizedBox(
width: context.width * 0.05,
child: Icon(
Icons.arrow_right_rounded,
color: Colors.grey,
)),
title: Text(
boost["name"],
style: TextStyle(
color: Colors.black,
fontSize: context.height * 0.017,
fontWeight: FontWeight.bold,
),
),
subtitle: Text(
boost["price"] + " FCFA",
style: TextStyle(
color: Colors.grey,
// color: context.thirdColor,
fontWeight: FontWeight.bold,
fontSize: context.height * 0.015,
),
),
trailing: //if boost["name"] == selectedBoost["name"] then show check icon
selectedBoost["name"] == boost["name"]
? Icon(
Icons.check,
color: context.thirdColor,
)
: null,
);
},
),
),
Container(
height: context.width * 0.06,
width: context.width * 0.9,
child: Text(
"Les publicités",
style: TextStyle(
color: context.secondaryColor,
fontSize: context.height * 0.02,
fontWeight: FontWeight.bold,
),
),
),
Expanded(
child: ListView.builder(
itemCount: getAds().length,
physics: NeverScrollableScrollPhysics(),
shrinkWrap: true,
itemBuilder: (context, index) {
Map<String, dynamic> ad = getAds()[index];
return ListTile(
dense: true,
minVerticalPadding: 0,
contentPadding: EdgeInsets.zero,
onTap: () {
if (ad["name"] != selectedAd["name"]) {
selectedAd = ad;
refresh(() {});
} else {
selectedAd = {};
refresh(() {});
}
},
tileColor: ad["name"] == selectedAd["name"]
? context.thirdColor.withOpacity(0.1)
: Colors.transparent,
leading: //radio selected if ad["name"] == selectedAd["name"]
SizedBox(
width: context.width * 0.05,
child: Icon(
Icons.arrow_right_rounded,
color: Colors.grey,
),
),
title: Text(
ad["name"],
style: TextStyle(
color: Colors.black,
fontSize: context.height * 0.017,
fontWeight: FontWeight.bold,
),
),
subtitle: Text(
ad["price"] + " FCFA",
style: TextStyle(
color: Colors.grey,
// color: context.thirdColor,
fontWeight: FontWeight.bold,
fontSize: context.height * 0.015,
),
),
trailing: //if ad["name"] == selectedAd["name"] then show check icon
selectedAd["name"] == ad["name"]
? Icon(
Icons.check,
color: context.thirdColor,
)
: null,
);
},
),
),
],
),
);
}),
actions: [
TextButton(
onPressed: () {
Navigator.pop(context);
},
child: Text(
"Annuler",
style: TextStyle(
color: context.primaryColor,
fontSize: context.height * 0.02,
fontWeight: FontWeight.bold,
),
),
),
ElevatedButton(
onPressed: () {
showDialog(
context: context,
//invisible background
barrierColor: Colors.transparent,
builder: (context) {
return Center(
child: CircularProgressIndicator(),
);
},
);
int total = 0;
String details = "";
if (selectedAd.isEmpty & selectedBoost.isEmpty) {
return;
}
if (selectedAd.isNotEmpty) {
total += int.parse(selectedAd["price"]);
details += selectedAd["name"];
}
if (selectedBoost.isNotEmpty) {
total += int.parse(selectedBoost["price"]);
if (details.isNotEmpty) {
details += " n|| ";
}
details += selectedBoost["name"];
}
CreateBoostPaymentUseCase()
.execute(
post,
total,
details,
categoryAd: selectedBoost["value"] ?? null,
homepageAd: selectedAd["value"] ?? null,
)
.then((value) {
Navigator.pop(context);
});
},
style: ElevatedButton.styleFrom(
backgroundColor: context.primaryColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
),
),
child: Text(
"Valider",
style: TextStyle(
color: Colors.white,
fontSize: context.height * 0.02,
fontWeight: FontWeight.bold,
),
),
),
],
);
},
);
Maybe the problem is due to the way I use the AlertDialog but I’m actually confused on what caused the error. Here is the complete error I have:
he following assertion was thrown during performLayout():
RenderShrinkWrappingViewport does not support returning intrinsic dimensions.
Calculating the intrinsic dimensions would require instantiating every child of the viewport, which defeats the point of viewports being lazy.
If you are merely trying to shrink-wrap the viewport in the main axis direction, you should be able to achieve that effect by just giving the viewport loose constraints, without needing to measure its intrinsic dimensions.
The relevant error-causing widget was:
AlertDialog AlertDialog:file:///Users/pulsar/development/flutter_workspace/smxew-mobile/lib/core/services.dart:1018:16
When the exception was thrown, this was the stack:
I skipped the stacktrace…
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderIntrinsicWidth#3f98f relayoutBoundary=up5 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 2165 pos 12: 'hasSize'
The relevant error-causing widget was:
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: _RenderInkFeatures#597aa relayoutBoundary=up4 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 2165 pos 12: 'hasSize'
The relevant error-causing widget was:
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderCustomPaint#4fa77 relayoutBoundary=up3 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 2165 pos 12: 'hasSize'
The relevant error-causing widget was:
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderPhysicalShape#e022d relayoutBoundary=up2 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 2165 pos 12: 'hasSize'
The relevant error-causing widget was:
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
'package:flutter/src/rendering/shifted_box.dart': Failed assertion: line 345 pos 12: 'child!.hasSize': is not true.
The relevant error-causing widget was:
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderPhysicalShape#e022d relayoutBoundary=up2
'package:flutter/src/rendering/box.dart':
Failed assertion: line 2165 pos 12: 'hasSize'
The relevant error-causing widget was: