我尝试使用Expanded
并且Flexible
无法修复如何使用 render flex 溢出错误解决此问题
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
class CommPage extends StatefulWidget {
const CommPage({Key? key}) : super(key: key);
@override
State<CommPage> createState() => _CommPageState();
}
class _CommPageState extends State<CommPage> {
@override
Widget build(BuildContext context) {
final size = MediaQuery.of(context).size;
bool isliked = true;
return Scaffold(
backgroundColor: Colors.white,
body: Column(
children: [
Padding(
padding: const EdgeInsets.fromLTRB(30, 50, 60, 50),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
IconButton(
onPressed: () {
Navigator.pop(context);
},
icon: Icon(Icons.keyboard_arrow_down)),
Padding(
padding: const EdgeInsets.fromLTRB(30, 0, 10, 0),
child: ClipRRect(
borderRadius: BorderRadius.circular(10.0),
child: Image.asset(
'assets/55.png',
fit: BoxFit.cover,
height: 50,
width: 50,
),
),
),
Expanded(
child: Text(
'Making your best out of a bad day',
maxLines: 3,
overflow: TextOverflow.ellipsis,
textAlign: TextAlign.justify,
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.black,
fontSize: 17,
overflow: TextOverflow.ellipsis,
),
),
),
],
),
),
Container(
width: size.width,
height: 60,
child: Padding(
padding: const EdgeInsets.fromLTRB(30, 0, 0, 0),
child: Text(
'Comments (56)',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.black,
fontSize: 30,
),
),
),
),
Expanded(
child: ListView.builder(
scrollDirection: Axis.vertical,
shrinkWrap: true,
itemCount: 10,
itemBuilder: (BuildContext context, int index) {
return Flexible(
flex: 5,
fit: FlexFit.tight,
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.fromLTRB(30, 0, 0, 0),
child: Column(
children: [
CircleAvatar(
radius: 16.0,
backgroundImage: NetworkImage(
'_loadedPhotos[index]["thumbnailUrl"],'),
backgroundColor: Colors.red,
),
],
),
),
Padding(
padding: const EdgeInsets.fromLTRB(20, 0, 30, 0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'User Name',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.black,
fontSize: 16,
),
),
SizedBox(
height: 7,
),
Text(
'3 hour ago',
style: TextStyle(
color: Colors.grey,
fontSize: 12,
),
),
SizedBox(
height: 14,
),
Text(
'Lorem ipsum dolor sit amet,consectetur adipiscing elit. dolor sit amet, consectetur adipiscing elit.',
// maxLines: 3,
// overflow: TextOverflow.ellipsis,
// softWrap: true,
// textAlign: TextAlign.justify,
style: TextStyle(
color: Colors.grey,
fontSize: 14,
),
),
SizedBox(
height: 10,
),
Divider(
thickness: 1,
color: Colors.grey,
),
Row(
children: [
IconButton(
icon: Icon(isliked
? Icons.favorite_border
: Icons.favorite),
onPressed: () {
setState(() {
isliked = !isliked;
});
},
),
Text(
'Like',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.black,
fontSize: 14,
),
),
SizedBox(
width: 25,
),
IconButton(
onPressed: () {},
icon: Icon(
FontAwesomeIcons.comment,
size: 20,
)),
Text(
'Comments',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.black,
fontSize: 14,
),
),
],
),
SizedBox(
height: 10,
),
],
),
)
],
),
);
},
),
)
],
),
);
} }