抖动问题：RenderFlex在右侧溢出248像素 [英] flutter problem : A RenderFlex overflowed by 248 pixels on the right
本文介绍了抖动问题：RenderFlex在右侧溢出248像素的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我在一列的一侧使用了三个文本，其中一个文本很长，然后我收到此错误&a RenderFlex在右侧溢出248个像素。&q；
我在一列的一侧使用了三个文本，其中一个文本字段很长，然后我收到此错误&A RenderFlex在右侧溢出248个像素。如何修复它？
import 'package:cwc/ApiManager/api_magager.dart';
import 'package:cwc/constants/constants.dart';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:intl/intl.dart';
class EVDetails extends StatefulWidget {
final eventsListDetails;
const EVDetails({Key? key, this.eventsListDetails}) : super(key: key);
@override
State<EVDetails> createState() => _EVDetailsState();
}
class _EVDetailsState extends State<EVDetails> {
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Padding(
padding: const EdgeInsets.fromLTRB(20, 20, 20, 0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.fromLTRB(0, 0, 0, 10),
child:widget.eventsListDetails['image'] == null || widget.eventsListDetails['description'] =="" ?Image.asset(
'assets/video_cover.png',
height: 120,
width: 100,
):Image.network(
imgBaseUrl+'${widget.eventsListDetails['image']}',
height: 120,
width: 100,
fit: BoxFit.fill,
),
),
Padding(
padding: const EdgeInsets.fromLTRB(19, 15, 0, 0),
child: Flexible(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'${widget.eventsListDetails['name']}',
style: GoogleFonts.poppins(
fontSize: 18,
color: Color(0xff444444),
fontWeight: FontWeight.w600,
),maxLines: 1,
overflow: TextOverflow.ellipsis,
),
Text(
'Cancer, Diabetes and Dental
Problems',
style: GoogleFonts.poppins(
fontSize: 12,
color: Color(0xff8F9698),
fontWeight: FontWeight.normal,
),
),
Text(
'For Champion Membership',
style: GoogleFonts.poppins(
fontSize: 14,
color: Color(0xffC691D3),
fontWeight: FontWeight.w600,
),
),
],
),
),
),
],
),
Text(
'Event Description',
style: GoogleFonts.poppins(
fontSize: 18,
// color: Color(0xFFC691D3),
color: Color(0xff444444),
fontWeight: FontWeight.w500),
),
SizedBox(
height: 11,
),
Text(
"${widget.eventsListDetails['description']}",
style:
GoogleFonts.poppins(fontSize: 13, color: Color(0xFF444444)),
textAlign: TextAlign.justify,
),
Padding(
padding: EdgeInsets.fromLTRB(0, 24, 0, 0),
child: Container(
decoration: BoxDecoration(
color: Color(0xffC691D3).withOpacity(0.2),
borderRadius: BorderRadius.only(
topRight: Radius.circular(10.0),
bottomRight: Radius.circular(10.0),
topLeft: Radius.circular(10.0),
bottomLeft: Radius.circular(10.0)),
),
child: Padding(
padding: const EdgeInsets.all(10.0),
child: Row(
children: [
Column( crossAxisAlignment: CrossAxisAlignment.start,
children: [
Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Start Date & Time',
style: GoogleFonts.poppins(
fontSize: 12,
color: Color(0xFF444444),
),
),
Text(
"${formateDat(DateTime.parse(widget.eventsListDetails['startTime']))} at ${DateFormat("hh:mm a").format(DateFormat("yyyy-MM-ddTHH:mm:ssZ").parseUTC("${widget.eventsListDetails['startTime']}").toLocal())} PT",
style: GoogleFonts.poppins(
fontSize: 14,
color: Color(0xFF444444),
),
),
],
),
SizedBox(height: 20,),
Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'End Date & Time',
style: GoogleFonts.poppins(
fontSize: 12,
color: Color(0xFF444444),
),
),
Text(
"${formateDat(DateTime.parse(widget.eventsListDetails['endTime']))} at ${DateFormat("hh:mm a").format(DateFormat("yyyy-MM-ddTHH:mm:ssZ").parseUTC("${widget.eventsListDetails['endTime']}").toLocal())} PT",
style: GoogleFonts.poppins(
fontSize: 14,
color: Color(0xFF444444),
),
),
Padding(
padding: const EdgeInsets.fromLTRB(0, 5, 10, 2),
child: Row(
children: [
Row(
children: [
Icon(
Icons.schedule,
color: Color(0xFFC691D3),
),
SizedBox(
width: 2,
),
Text(
'${widget.eventsListDetails['duration']} mins',
style: GoogleFonts.poppins(
fontWeight: FontWeight.normal,
fontSize: 14,
color: Color(0xFFC691D3)),
),
],
),
SizedBox(
width: 5,
),
Row(
children: [
Icon(
Icons.online_prediction,
color: Color(0xFFC691D3),
),
SizedBox(
width: 2,
),
Text(
'${widget.eventsListDetails['eventMode']}',
style: GoogleFonts.poppins(
fontWeight: FontWeight.normal,
fontSize: 14,
color: Color(0xFFC691D3)),
),
],
),
],
),
),
],
),
],
),
Spacer(),
Image.asset(
'assets/calender.png',
height: 120,
width: 120,
)
],
),
),
),
)
],
),
),
);
}
}
formateDat(DateTime date) {
final DateFormat formatter = DateFormat.MMM();
String formatted = formatter.format(date);
formatted = "${formatted} " +"${date.day}";
var week = DateFormat('EEEE').format(date);
var we = week[0] + week[1] + week[2];
return "$we, " + formatted;
}
推荐答案
这是您的解决方案
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
width: 150,
height: 150,
color: Colors.grey,
),
const SizedBox(width: 10,),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('Lorem ipsum is placeholder text commonly used in the graphic, print, and publishing industries for previewing layouts and visual mockups.')
],
),
)
],
)
这篇关于抖动问题：RenderFlex在右侧溢出248像素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
