Flutter:使用 ListTile 时未布局 RenderBox

标签 flutter dart flutter-layout logcat flutter-dependencies

当我将日期选择器插入 ListTile 时,它​​抛出了很多错误。我尝试以各种可能的方式嵌入行、ListTile 小部件(Expanded、SizedBox、Flexible...)。但不幸的是,没有任何效果。


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();
  }
}

关于Flutter:使用 ListTile 时未布局 RenderBox,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64862108/

相关文章:

android - Flutter app gradle构建异常失败

flutter - 如何在flutter_typehead TypeAheadField小部件中设置字段的文本?

flutter - 通过类型作为构造函数,并将其用作提供程序包的泛型

angular - Dart,Angular 2 包/模块的条件加载

flutter - 让小部件静静地溢出外部屏幕

android - 如何通过单击 Flutter 中屏幕的其他区域来管理警报对话框?

flutter - TextFormField根据单选按钮启用/禁用选中的Flutter

android - 如果列表为空,如何启用和禁用 float 操作按钮?

flutter - 当用户使用 flutter 键入某些文本时,如何解析单词并将其替换为主题标签链接?

flutter - 文本字段焦点触发UI的重建