BoxConstraints 强制无限宽度。可能的原因：_RenderListTile._layoutBox。违规约束：BoxConstraints(w=Infinity, 0.0<=h<=Infinity)
问题描述 投票：0回答：1
我的 Flutter 应用程序遇到错误并寻求帮助来解决该问题。这是错误消息：
FlutterError (BoxConstraints forces an infinite width.
These invalid constraints were provided to RenderParagraph's layout() function by the following function, which probably computed the invalid constraints in question:
_RenderListTile._layoutBox (package:flutter/src/material/list_tile.dart:1274:9)
The offending constraints were:
BoxConstraints(w=Infinity, 0.0<=h<=Infinity))
代码片段：
import 'package:blood_token_app/models/services_model/blood_request_model.dart';
import 'package:blood_token_app/screens/main_screens/details_screen.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_svg/svg.dart';
class MainScreen extends StatefulWidget {
const MainScreen({Key? key}) : super(key: key);
@override
State<MainScreen> createState() => _MainScreenState();
}
class _MainScreenState extends State<MainScreen> {
@override
Widget build(BuildContext context) {
final Size size = MediaQuery.of(context).size;
return Scaffold(
appBar: AppBar(
title: Text('Blood Token'),
),
body: Container(
height: size.height,
width: size.width,
child: SingleChildScrollView(
child: Column(
children: [
SizedBox(
child: Padding(
padding:
const EdgeInsets.symmetric(vertical: 10, horizontal: 10),
child: Center(
child: Card(
color: Theme.of(context).scaffoldBackgroundColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
SvgPicture.asset(
"assets/logos/032-blood_bag.svg",
height: size.height * 0.18,
),
Text(
"Donate Blood\n Save Lives",
textAlign: TextAlign.center,
style: TextStyle(
fontSize: size.height * 0.030,
color: Colors.black,
),
),
],
),
),
),
),
),
Column(
children: [
ListTile(
title: Text(
'Current Requests',
style: TextStyle(fontSize: 20.0),
),
trailing: Text('See all'),
),
Expanded(
child: StreamBuilder<QuerySnapshot>(
stream: FirebaseFirestore.instance
.collection('blood_requests')
.snapshots(),
builder: (context, snapshot) {
if (snapshot.connectionState ==
ConnectionState.waiting) {
return AppUtils.customProgressIndicator();
}
if (snapshot.hasError) {
return Text('Error: ${snapshot.error}');
}
final List<BloodRequestModel> bloodRequests = snapshot
.data!.docs
.map((doc) => BloodRequestModel.fromJson(
doc.data() as Map<String, dynamic>))
.toList();
return Container(
width: MediaQuery.of(context)
.size
.width, // Ensure finite width
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
children: bloodRequests.map((value) {
return Padding(
padding: const EdgeInsets.symmetric(
horizontal: 10, vertical: 10),
child: Container(
width:
300, // Set a finite width as per your design
decoration: BoxDecoration(
shape: BoxShape.rectangle,
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.5),
spreadRadius: 5,
blurRadius: 7,
offset: Offset(0, 3),
),
],
color: Theme.of(context)
.scaffoldBackgroundColor,
borderRadius: BorderRadius.circular(20.0),
border: Border.all(
color: Colors.grey.shade100,
width: 0.0,
),
),
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
ListTile(
title: Text(
"Requester Name",
textAlign: TextAlign.left,
overflow: TextOverflow.ellipsis,
),
subtitle: Text(
"${value.requesterName}",
textAlign: TextAlign.left,
overflow: TextOverflow.ellipsis,
),
trailing: Column(
mainAxisAlignment:
MainAxisAlignment.center,
children: [
Text("Urgency Level"),
Text(
"${value.urgencyLevel}",
textAlign: TextAlign.left,
overflow: TextOverflow.ellipsis,
),
],
),
),
ListTile(
title: Text("Location"),
subtitle:
Text("${value.customLocation}"),
trailing: Column(
mainAxisAlignment:
MainAxisAlignment.center,
children: [
Text("Blood Type"),
Text("${value.bloodType}"),
],
),
),
ListTile(
leading: Icon(Icons.watch_outlined),
title: Text(
"${value.formattedTimestamp()}"),
),
MaterialButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(20),
bottomRight: Radius.circular(20),
),
),
height: size.height * 0.060,
minWidth: size.width,
color: AppUtils.redColor,
onPressed: () {
if (mounted) {
Navigator.push(context,
MaterialPageRoute(
builder: (_) {
return DetailsScreen(
requesterName:
value.requesterName,
bloodType: value.bloodType,
quantityNeeded:
value.quantityNeeded,
urgencyLevel:
value.urgencyLevel,
location: value.location,
contactNumber:
value.contactNumber,
patientName:
value.patientName,
date: value
.formattedTimestamp(),
customLocation:
value.customLocation,
// Convert latitude string to double
latitude: double.parse(value
.location!
.split(', ')[0]),
// Convert longitude string to double
longitude: double.parse(
value.location!
.split(', ')[1]));
}));
}
},
child: Text(
"Details",
style: TextStyle(
color: AppUtils.whiteColor,
),
),
),
],
),
),
);
}).toList(),
),
),
);
},
),
),
],
),
],
),
),
),
);
}
}
您尝试了什么以及您期待什么？
我尝试使用
ListViewSingleChildScrollViewColumnException has occurred.
FlutterError (BoxConstraints forces an infinite width.
These invalid constraints were provided to RenderParagraph's layout() function by the following function, which probably computed the invalid constraints in question:
_RenderListTile._layoutBox (package:flutter/src/material/list_tile.dart:1274:9)
The offending constraints were:
BoxConstraints(w=Infinity, 0.0<=h<=Infinity))
我希望卡片能够平滑滚动，在可用的屏幕宽度内水平显示所有捐赠请求。但是，错误消息表明存在约束问题，特别是在宽度方面。
1个回答
0
投票
投票
删除
ExpandedStreamBuilderStreamBuilderSingleChildScrollView我尝试使用虚拟数据运行您的代码，结果如下：
这是你的小部件，我使用了一个虚拟流来模拟你的数据：
class MainScreen extends StatefulWidget {
const MainScreen({Key? key}) : super(key: key);
@override
State<MainScreen> createState() => _MainScreenState();
}
class _MainScreenState extends State<MainScreen> {
@override
Widget build(BuildContext context) {
final Size size = MediaQuery.of(context).size;
return Scaffold(
appBar: AppBar(
title: Text('Blood Token'),
),
body: Container(
height: size.height,
width: size.width,
child: SingleChildScrollView(
child: Column(
children: [
SizedBox(
child: Padding(
padding:
const EdgeInsets.symmetric(vertical: 10, horizontal: 10),
child: Center(
child: Card(
color: Theme.of(context).scaffoldBackgroundColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Container(
width: 100,
height: 100,
color: Colors.purple,
child: Text(
'Your Picture'
,
style: TextStyle(
color: Colors.white,
)
)
),
Text(
"Donate Blood\n Save Lives",
textAlign: TextAlign.center,
style: TextStyle(
fontSize: size.height * 0.030,
color: Colors.black,
),
),
],
),
),
),
),
),
Column(
children: [
ListTile(
title: Text(
'Current Requests',
style: TextStyle(fontSize: 20.0),
),
trailing: Text('See all'),
),
StreamBuilder(
stream: getStream(),
builder: (context, snapshot) {
if (snapshot.connectionState ==
ConnectionState.waiting) {
return CircularProgressIndicator();
}
if (snapshot.hasError) {
return Text('Error: ${snapshot.error}');
}
final list = [for(int i = 0 ; i < 10 ; i++) i];
return Container(
width: MediaQuery.of(context)
.size
.width, // Ensure finite width
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
children: list.map((value) {
return Padding(
padding: const EdgeInsets.symmetric(
horizontal: 10, vertical: 10),
child: Container(
width:
300, // Set a finite width as per your design
decoration: BoxDecoration(
shape: BoxShape.rectangle,
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.5),
spreadRadius: 5,
blurRadius: 7,
offset: Offset(0, 3),
),
],
color: Theme.of(context)
.scaffoldBackgroundColor,
borderRadius: BorderRadius.circular(20.0),
border: Border.all(
color: Colors.grey.shade100,
width: 0.0,
),
),
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
ListTile(
title: Text(
"Requester Name",
textAlign: TextAlign.left,
overflow: TextOverflow.ellipsis,
),
subtitle: Text(
"${value}",
textAlign: TextAlign.left,
overflow: TextOverflow.ellipsis,
),
trailing: Column(
mainAxisAlignment:
MainAxisAlignment.center,
children: [
Text("Urgency Level"),
Text(
"${value}",
textAlign: TextAlign.left,
overflow: TextOverflow.ellipsis,
),
],
),
),
ListTile(
title: Text("Location"),
subtitle:
Text("${value}"),
trailing: Column(
mainAxisAlignment:
MainAxisAlignment.center,
children: [
Text("Blood Type"),
Text("${value}"),
],
),
),
ListTile(
leading: Icon(Icons.watch_outlined),
title: Text(
"${value}"),
),
MaterialButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(20),
bottomRight: Radius.circular(20),
),
),
height: size.height * 0.060,
minWidth: size.width,
color: Colors.red,
onPressed: () {
},
child: Text(
"Details",
style: TextStyle(
color: Colors.orange,
),
),
),
],
),
),
);
}).toList(),
),
),
);
},
),
],
),
],
),
),
),
);
}
Stream<int> getStream()async*{
for(int i = 0 ; i < 10 ; i++)
yield i;
}
}
希望对您有帮助。
最新问题
- 在 venv、Windows 10 中使用 pip 安装 psycopg2 时遗留安装失败
- 如何@autowire一些bean到JsonSerializer中？
- 如何避免从main返回Result时出现“Error:”输出？
- 未捕获类型错误：无法读取属性“1”
- NestJS - 基于一个属性有条件地验证主体
- 未捕获的 TypeError 无法读取属性“0”
- 在map()内使用公式()创建多个公式
- 无限循环播放 HTML 中的 Gif 图像
- 如何将这个简单的CLI程序转换为在浏览器上运行？
- c# 表达式中闭包变量捕获的问题
- kubectl 顶级节点无法工作，显示：“错误：您必须登录到服务器（未经授权）”
- 跳转到长模式 x86_64 时出现三重故障
- 显示检测到但无法识别的面孔的名称时出现问题
- 消息队列IPC无法正常工作
- 通过 JavaScript 应用 CSS 转换
- 设计 MS Access SQL 查询来模仿“删除重复”Excel 功能
- 如果没有 .then 链接，Mongoose Update 方法是否不起作用？
- 如何在 Svelte 中删除并重新添加点击侦听器？
- 如何将集合的参数包展平为成员初始化的 std::array ？
- 有没有办法将组件（同时设置其属性）v-bind 作为另一个组件的属性，如下所示
© www.soinside.com 2019 - 2024. All rights reserved.