未放置导致 RenderBox 的卡片中的 ListTile

Posted 2023-03-28

【中文标题】未放置导致 RenderBox 的卡片中的 ListTile

【英文标题】：ListTile within a Card causing RenderBox was not laid

【发布时间】：2021-11-17 14:54:41

【问题描述】：

我试图将 ListTile 放入卡片中，但出现渲染框错误

════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderPhysicalShape#c872a relayoutBoundary=up7
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1930 pos 12: 'hasSize'

The relevant error-causing widget was
Card
lib/…/task/make_offer.dart:100


ListView(children: [
        Padding(
          padding: const EdgeInsets.symmetric(
            horizontal: 16.0,
            vertical: 10.0,
          ),
          child: TextFormField(
            controller: _offerController,
            textInputAction: TextInputAction.next,
            // textCapitalization: TextCapitalization.words,
            // maxLength: 40,
            decoration: const InputDecoration(
              hintText: '5-9999',
              prefixIcon: Icon(Icons.attach_money_rounded),
              labelText: 'Your Offer',
            ),
            keyboardType: TextInputType.number,
            inputFormatters: <TextInputFormatter>[
              FilteringTextInputFormatter.singleLineFormatter
            ],
            onChanged: (offerAmount) => _offerAmount = offerAmount as int,
          ),
        ),
        Card(
            child: ListTile(
                leading: Text('Fee'),
                trailing: Text(_offerController.toString())))
      ]),

【参考方案1】：

问题来自ListTile 的trailing，你可以用SizedBox(width:x) 包裹Text。大文本出现问题。

  Card(
            child: ListTile(
              leading: Text('Fee'),
              trailing: SizedBox(
                width: 40,
                child: Text(
                  "_offerController.toString()xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxsd",
                     /// you can add others property here
                ),
              ),
            ),
          )

此外，您可以创建自定义 ListTile，而它的默认行为。这是sample

它能解决你的问题吗？

【讨论】：

有趣，因为文本最多只有 5 位数字，但这似乎可以解决问题

它可能与我的设备不同。我正在使用chrome，只有当测试足够长时才会产生问题，这就是我使用 5 位数的原因，我找不到任何问题，可能只是因为屏幕分辨率。跨度>

我认为现在看到它的问题是在前导中使用 Row