Flutter:RenderBox 使用 ListTile 时未布局
Flutter:RenderBox not laid out while using ListTile
就在我将日期选择器插入 ListTile 时,它抛出了很多错误。我尝试以各种可能的方式(Expanded,SizedBox,Flexible ....)嵌入行,ListTile 小部件。但不幸的是没有任何效果。
body: SingleChildScrollView(
child: Expanded(
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Expanded(
child: Text(
"abcuiop",
style: TextStyle(
color: Color(0xff748A9D),
fontSize: 17,
),
),
),
ListTile(
title: Text("${date.day}-${date.month}-${date.year}"),
trailing: Icon(Icons.edit),
)
],
),
Anotherwidget (),
],
),
),
),
);
下面给出了我在 logcat 中遇到的错误片段:
════════ Exception caught by rendering library
The following assertion was thrown during performLayout():
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:1511:9)
The offending constraints were: BoxConstraints(w=Infinity, 0.0<=h<=Infinity)
The relevant error-causing widget was:
ListTile
When the exception was thrown, this was the stack:
#0 BoxConstraints.debugAssertIsValid.<anonymous closure>.throwError (package:flutter/src/rendering/box.dart:517:9)
#1 BoxConstraints.debugAssertIsValid.<anonymous closure> (package:flutter/src/rendering/box.dart:559:21)
#2 BoxConstraints.debugAssertIsValid (package:flutter/src/rendering/box.dart:565:6)
#3 RenderObject.layout (package:flutter/src/rendering/object.dart:1677:24)
#4 _RenderListTile._layoutBox (package:flutter/src/material/list_tile.dart:1511:9)
...
The following RenderObject was being processed when the exception was fired: _RenderListTile#3caa6 relayoutBoundary=up10 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: offset=Offset(0.0, 0.0) (can use size)
... constraints: BoxConstraints(unconstrained)
... size: MISSING
RenderObject: _RenderListTile#3caa6 relayoutBoundary=up10 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: offset=Offset(0.0, 0.0) (can use size)
constraints: BoxConstraints(unconstrained)
size: MISSING
... title: RenderParagraph#5e5b0 NEEDS-LAYOUT NEEDS-PAINT
... parentData: offset=Offset(0.0, 0.0)
... constraints: MISSING
... size: MISSING
... textAlign: start
... textDirection: ltr
... softWrap: wrapping at box width
... overflow: clip
... locale: en_US
... maxLines: unlimited
... text: TextSpan
... debugLabel: ((englishLike subhead 2014).merge(blackMountainView subtitle1)).copyWith
... inherit: false
... color: Color(0xdd000000)
... family: Roboto
... size: 16.0
... weight: 400
... baseline: alphabetic
... decoration: TextDecoration.none
... "16-11-2020"
... trailing: RenderSemanticsAnnotations#47bff relayoutBoundary=up11 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: offset=Offset(0.0, 0.0) (can use size)
... constraints: BoxConstraints(0.0<=w<=Infinity, 0.0<=h<=56.0)
... size: Size(24.0, 24.0)
... child: RenderExcludeSemantics#580fa relayoutBoundary=up12 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: <none> (can use size)
... constraints: BoxConstraints(0.0<=w<=Infinity, 0.0<=h<=56.0)
... size: Size(24.0, 24.0)
... excluding: true
... child: RenderConstrainedBox#4b382 relayoutBoundary=up13 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: <none> (can use size)
... constraints: BoxConstraints(0.0<=w<=Infinity, 0.0<=h<=56.0)
... size: Size(24.0, 24.0)
... additionalConstraints: BoxConstraints(w=24.0, h=24.0)
... child: RenderPositionedBox#37e14 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: <none> (can use size)
... constraints: BoxConstraints(w=24.0, h=24.0)
... size: Size(24.0, 24.0)
... alignment: center
... textDirection: ltr
... widthFactor: expand
... heightFactor: expand
等等……
请检查以下代码。错误是因为您用 Expanded 包裹了 Column 而没有用 Expanded 包裹了 ListView。请看下面的代码-
import 'package:flutter/material.dart';
final Color darkBlue = Color.fromARGB(255, 18, 32, 47);
void main() {
runApp(MaterialApp(
theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
debugShowCheckedModeBanner: false,
home: MyApp()));
}
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
DateTime pickedDate;
TimeOfDay time;
@override
void initState() {
super.initState();
pickedDate = DateTime.now();
time = TimeOfDay.now();
}
@override
Widget build(BuildContext context) {
_pickDate() async {
DateTime date = await showDatePicker(
context: context,
firstDate: DateTime(DateTime.now().year - 5),
lastDate: DateTime(DateTime.now().year + 5),
initialDate: pickedDate,
);
if (date != null)
setState(() {
pickedDate = date;
});
}
_pickTime() async {
TimeOfDay t = await showTimePicker(context: context, initialTime: time);
if (t != null)
setState(() {
time = t;
});
}
return MaterialApp(
theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
debugShowCheckedModeBanner: false,
home: Scaffold(
appBar: AppBar(
title: Text("Demo"),
),
body: SingleChildScrollView(
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Expanded(
child: Text(
"abcuiop",
style: TextStyle(
color: Color(0xff748A9D),
fontSize: 17,
),
),
),
Expanded(
child: ListTile(
title: Text(
"${pickedDate.day}-${pickedDate.month}-${pickedDate.year}"),
trailing: Icon(Icons.edit),
onTap: _pickDate,
),
),
Expanded(
child: ListTile(
title: Text("Time: ${time.hour}:${time.minute}"),
trailing: Icon(Icons.keyboard_arrow_down),
onTap: _pickTime,
),
)
],
),
Anotherwidget(),
],
),
),
),
);
}
}
class Anotherwidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container();
}
}
就在我将日期选择器插入 ListTile 时,它抛出了很多错误。我尝试以各种可能的方式(Expanded,SizedBox,Flexible ....)嵌入行,ListTile 小部件。但不幸的是没有任何效果。
body: SingleChildScrollView(
child: Expanded(
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Expanded(
child: Text(
"abcuiop",
style: TextStyle(
color: Color(0xff748A9D),
fontSize: 17,
),
),
),
ListTile(
title: Text("${date.day}-${date.month}-${date.year}"),
trailing: Icon(Icons.edit),
)
],
),
Anotherwidget (),
],
),
),
),
);
下面给出了我在 logcat 中遇到的错误片段:
════════ Exception caught by rendering library
The following assertion was thrown during performLayout():
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:1511:9)
The offending constraints were: BoxConstraints(w=Infinity, 0.0<=h<=Infinity)
The relevant error-causing widget was:
ListTile
When the exception was thrown, this was the stack:
#0 BoxConstraints.debugAssertIsValid.<anonymous closure>.throwError (package:flutter/src/rendering/box.dart:517:9)
#1 BoxConstraints.debugAssertIsValid.<anonymous closure> (package:flutter/src/rendering/box.dart:559:21)
#2 BoxConstraints.debugAssertIsValid (package:flutter/src/rendering/box.dart:565:6)
#3 RenderObject.layout (package:flutter/src/rendering/object.dart:1677:24)
#4 _RenderListTile._layoutBox (package:flutter/src/material/list_tile.dart:1511:9)
...
The following RenderObject was being processed when the exception was fired: _RenderListTile#3caa6 relayoutBoundary=up10 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: offset=Offset(0.0, 0.0) (can use size)
... constraints: BoxConstraints(unconstrained)
... size: MISSING
RenderObject: _RenderListTile#3caa6 relayoutBoundary=up10 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: offset=Offset(0.0, 0.0) (can use size)
constraints: BoxConstraints(unconstrained)
size: MISSING
... title: RenderParagraph#5e5b0 NEEDS-LAYOUT NEEDS-PAINT
... parentData: offset=Offset(0.0, 0.0)
... constraints: MISSING
... size: MISSING
... textAlign: start
... textDirection: ltr
... softWrap: wrapping at box width
... overflow: clip
... locale: en_US
... maxLines: unlimited
... text: TextSpan
... debugLabel: ((englishLike subhead 2014).merge(blackMountainView subtitle1)).copyWith
... inherit: false
... color: Color(0xdd000000)
... family: Roboto
... size: 16.0
... weight: 400
... baseline: alphabetic
... decoration: TextDecoration.none
... "16-11-2020"
... trailing: RenderSemanticsAnnotations#47bff relayoutBoundary=up11 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: offset=Offset(0.0, 0.0) (can use size)
... constraints: BoxConstraints(0.0<=w<=Infinity, 0.0<=h<=56.0)
... size: Size(24.0, 24.0)
... child: RenderExcludeSemantics#580fa relayoutBoundary=up12 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: <none> (can use size)
... constraints: BoxConstraints(0.0<=w<=Infinity, 0.0<=h<=56.0)
... size: Size(24.0, 24.0)
... excluding: true
... child: RenderConstrainedBox#4b382 relayoutBoundary=up13 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: <none> (can use size)
... constraints: BoxConstraints(0.0<=w<=Infinity, 0.0<=h<=56.0)
... size: Size(24.0, 24.0)
... additionalConstraints: BoxConstraints(w=24.0, h=24.0)
... child: RenderPositionedBox#37e14 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
... parentData: <none> (can use size)
... constraints: BoxConstraints(w=24.0, h=24.0)
... size: Size(24.0, 24.0)
... alignment: center
... textDirection: ltr
... widthFactor: expand
... heightFactor: expand
等等……
请检查以下代码。错误是因为您用 Expanded 包裹了 Column 而没有用 Expanded 包裹了 ListView。请看下面的代码-
import 'package:flutter/material.dart';
final Color darkBlue = Color.fromARGB(255, 18, 32, 47);
void main() {
runApp(MaterialApp(
theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
debugShowCheckedModeBanner: false,
home: MyApp()));
}
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
DateTime pickedDate;
TimeOfDay time;
@override
void initState() {
super.initState();
pickedDate = DateTime.now();
time = TimeOfDay.now();
}
@override
Widget build(BuildContext context) {
_pickDate() async {
DateTime date = await showDatePicker(
context: context,
firstDate: DateTime(DateTime.now().year - 5),
lastDate: DateTime(DateTime.now().year + 5),
initialDate: pickedDate,
);
if (date != null)
setState(() {
pickedDate = date;
});
}
_pickTime() async {
TimeOfDay t = await showTimePicker(context: context, initialTime: time);
if (t != null)
setState(() {
time = t;
});
}
return MaterialApp(
theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
debugShowCheckedModeBanner: false,
home: Scaffold(
appBar: AppBar(
title: Text("Demo"),
),
body: SingleChildScrollView(
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Expanded(
child: Text(
"abcuiop",
style: TextStyle(
color: Color(0xff748A9D),
fontSize: 17,
),
),
),
Expanded(
child: ListTile(
title: Text(
"${pickedDate.day}-${pickedDate.month}-${pickedDate.year}"),
trailing: Icon(Icons.edit),
onTap: _pickDate,
),
),
Expanded(
child: ListTile(
title: Text("Time: ${time.hour}:${time.minute}"),
trailing: Icon(Icons.keyboard_arrow_down),
onTap: _pickTime,
),
)
],
),
Anotherwidget(),
],
),
),
),
);
}
}
class Anotherwidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container();
}
}