RenderBox 没有在 flutter 中布局

Question

我制作了一个自定义的 appBar，它有一个搜索栏，并且在搜索栏旁边有一个文本搜索

 appBar: AppBar(
          backgroundColor: Colors.white,
          actions: <Widget>[
            Row(
              children: <Widget>[
                Expanded(
                  child: Container(
                    margin: EdgeInsets.all(8.0),
                    decoration: BoxDecoration(
                      border: Border.all(color: Colors.grey, width: 1),
                      borderRadius: BorderRadius.all(Radius.circular(12.0)),
                    ),
                    child: TextField(
                      autofocus: false,
                      onChanged: (value) {
                      ....
                      },
                      keyboardType: TextInputType.text,
                      decoration: InputDecoration(
                          hintText: "Search",
                          prefixIcon: Icon(Icons.search),
                          border: InputBorder.none),
                    ),
                  ),
                ),
                Text("search")
              ],
            )
          ],
          elevation: 0,
        ),

错误

════════ Exception caught by rendering library ═════════════════════════════════
RenderFlex children have non-zero flex but incoming width constraints are unbounded.
The relevant error-causing widget was
    Row 
lib/ui/search_unit_owner.dart:49
════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderFlex#fe581 relayoutBoundary=up13 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1687 pos 12: 'hasSize'

Answer 1

您必须添加 Container 并为屏幕尺寸指定宽度。

 AppBar(
        backgroundColor: Colors.white,
        actions: <Widget>[
          Container(
            width: MediaQuery.of(context).size.width,
            child: Row(
              children: <Widget>[
                Expanded(
                  child: Container(
                    margin: EdgeInsets.all(8.0),
                    decoration: BoxDecoration(
                      border: Border.all(color: Colors.grey, width: 1),
                      borderRadius: BorderRadius.all(Radius.circular(12.0)),
                    ),
                    child: TextField(
                      autofocus: false,
                      onChanged: (value) {},
                      keyboardType: TextInputType.text,
                      decoration: InputDecoration(
                          hintText: "Search",
                          prefixIcon: Icon(Icons.search),
                          border: InputBorder.none),
                    ),
                  ),
                ),
                Text("search")
              ],
            ),
          )
        ],
        elevation: 0,
      ),

Answer 2

Appbar 中的操作用于添加诸如 IconButon 之类的东西...
自定义带有搜索框的AppBar，可以创建Widget实现PreferredSizeWidget 示例：

https://gist.github.com/dangngocduc/27f10cb0860ede6c8da6d280b4f917b9

RenderBox 没有在 flutter 中布局

RenderBox was not laid out in flutter

widget

dart

flutter