I have a problem caused by IntrinsicHeight when i use html. But, it runs fine if I use Text.
html says that it needs a specific height (can’t be dynamic). Whereas, I need dynamic height.
Here is my code :
Widget getContent() {
final textTheme = Theme.of(context).textTheme;
return Container(
child: ListView.separated(
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
itemBuilder: (context, index) {
final item = dataReview[index];
final comment = item['comment'];
return Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
padding: EdgeInsets.symmetric(vertical: 12.0),
child: Text(
item['name'],
style: textTheme.titleLarge?.copyWith(
fontWeight: FontWeight.bold,
),
),
),
Text(
item['date'],
style: textTheme.bodyMedium?.copyWith(
color: Colors.grey,
fontWeight: FontWeight.bold,
),
),
SizedBox(height: 6.0),
Row(
children: [
for (int i = 5; i > 0; i--) ...[
Container(
padding: EdgeInsets.symmetric(vertical: 2.0),
child: SvgPicture.asset(
iconStarSolid,
colorFilter: ColorFilter.mode(
i <= 5 - item['rating']
? Colors.black12
: Colors.amber,
BlendMode.srcIn,
),
),
),
],
],
),
Container(
padding: EdgeInsets.symmetric(vertical: 6.0),
child: VisibilityWidget(
visible: item['review'] != null,
child: Container(
padding: EdgeInsets.only(bottom: 8.0),
child: Html(
data: '<html><head></head><body><p>"Very very bad."</p></body></html>',
style: {
'body': Style(
margin: Margins.zero,
lineHeight: LineHeight.number(1.3),
),
},
shrinkWrap: true,
),
),
),
),
Visibility(
visible: comment != null,
replacement: Container(),
child: Container(
padding: EdgeInsets.only(bottom: 16.0),
child: ContainerShadow(
color: primaryColor.withOpacity(0.1),
paddingVertical: 16.0,
paddingHorizontal: 16.0,
child: IntrinsicHeight(
child: Row(
children: [
Container(
child: VerticalDivider(
color: primaryColor.withOpacity(0.2),
width: 1.0,
thickness: 2.0,
),
),
SizedBox(width: 16.0),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Container(
height: 35.0,
child: FittedBox(
child: CircleAvatar(
backgroundImage: AssetImage(
iconCharger,
),
),
),
),
Container(
padding: EdgeInsets.symmetric(
horizontal: 12.0,
),
child: Text(
'Admin',
style: textTheme.titleLarge?.copyWith(
color: primaryColor,
fontWeight: FontWeight.bold,
),
),
)
],
),
SizedBox(height: 8.0),
Text(
comment != null ? comment['date'] : '',
style: textTheme.bodyMedium?.copyWith(
color: Colors.grey,
fontWeight: FontWeight.bold,
),
),
SizedBox(height: 12.0),
Container(
child: child: Html(
data: '<html><head><title>Page Title</title></head><body><h1>My First Heading</h1><p>My first paragraph.</p></body></html>',
style: {
'h5': Style(
margin: Margins.zero,
lineHeight: LineHeight.number(1.3),
),
},
shrinkWrap: true,
), ),
],
),
),
],
),
),
),
),
),
],
),
);
},
separatorBuilder: (context, index) {
return Divider(
height: 5.0,
thickness: 1.5,
color: Colors.black12,
);
},
itemCount: dataReview.length,
),
);
}
return VisibilityWidget(
visible: !loading,
replacement: Padding(
padding: EdgeInsets.symmetric(vertical: 70.0),
child: AnimateLoadingWidget(),
),
child: VisibilityWidget(
visible: isShowRatingRecap,
replacement: Container(
child: EmptyWidget(
image: placeholderWarning,
description: 'Empty.',
),
),
child: SingleChildScrollView(
padding: EdgeInsets.all(16.0),
child: Column(
children: [
getHeader(),
getContent(),
],
),
),
),
);
expected result :
click here for the image of my expected result
how can i get dynamic height for html when i use IntrinsicHeight?
or maybe there are other options to achieve my goals (drawing vertical line & use html in same time)?
New contributor
Luthfan Alwafi is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.