扩大库比蒂诺NavigationBar领先区域

Question

我用来CupertinoNavigationBar制作预期的布局，如下图所示

\n\n

\n\n

在左侧/leading区域，我覆盖默认后退按钮来创建布局，但我得到了溢出

\n\n

\n\n

return CupertinoPageScaffold(\n  ...\n  leading: Row(\n    children: <Widget>[\n      UtomoDeckNavigationBar.getDefaultBackButton(context: context, isLightTheme: true),\n        Column(\n          crossAxisAlignment: CrossAxisAlignment.start,\n          mainAxisAlignment: MainAxisAlignment.center,\n          children: <Widget>[\n            Text(widget.chat.name,\n              style: TextStyle(\n                color: CupertinoColors.black,\n                fontWeight: FontWeight.bold,\n                fontSize: 14.0)),\n            Text(\'Online\',\n              style: TextStyle(color: CupertinoColors.black, fontSize: 12.0))\n        ],\n      )\n    ],\n  )\n)\n

\n\n

和错误

\n\n

Performing hot reload...\nSyncing files to device iPhone SE...\nflutter: \xe2\x95\x90\xe2\x95\x90\xe2\x95\xa1 EXCEPTION CAUGHT BY RENDERING LIBRARY \xe2\x95\x9e\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\nflutter: The following assertion was thrown during layout:\nflutter: A RenderFlex overflowed by 34 pixels on the right.\nflutter:\nflutter: The overflowing RenderFlex has an orientation of Axis.horizontal.\nflutter: The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and\nflutter: black striped pattern. This is usually caused by the contents being too big for the RenderFlex.\nflutter: Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the\nflutter: RenderFlex to fit within the available space instead of being sized to their natural size.\nflutter: This is considered an error condition because it indicates that there is content that cannot be\nflutter: seen. If the content is legitimately bigger than the available space, consider clipping it with a\nflutter: ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex,\nflutter: like a ListView.\nflutter: The specific RenderFlex in question is: RenderFlex#d650f relayoutBoundary=up2 OVERFLOWING:\nflutter:   creator: Row \xe2\x86\x90 IconTheme \xe2\x86\x90 Builder \xe2\x86\x90 Padding \xe2\x86\x90 KeyedSubtree-[GlobalKey#fab21 Leading] \xe2\x86\x90\nflutter:     LayoutId-[<_ToolbarSlot.leading>] \xe2\x86\x90 CustomMultiChildLayout \xe2\x86\x90 NavigationToolbar \xe2\x86\x90 Padding \xe2\x86\x90\nflutter:     MediaQuery \xe2\x86\x90 Padding \xe2\x86\x90 SafeArea \xe2\x86\x90 \xe2\x8b\xaf\nflutter:   parentData: offset=Offset(16.0, 0.0) (can use size)\nflutter:   constraints: BoxConstraints(0.0<=w<=90.7, h=44.0)\nflutter:   size: Size(90.7, 44.0)\nflutter:   direction: horizontal\nflutter:   mainAxisAlignment: start\nflutter:   mainAxisSize: max\nflutter:   crossAxisAlignment: center\nflutter:   textDirection: ltr\nflutter:   verticalDirection: down\nflutter: \xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\nflutter: \xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\nReloaded 11 of 687 libraries in 407ms.\n\n

\n\n

我可以扩大领先区域的约束，或者也许有更好的方法来做到这一点？

\n\n

谢谢。

\n

Answer 1

为了解决这个问题，我使用Rowwith MainAxisAlignment.startinsidemiddle而不是leading.

编辑：

使用Container无穷大width而不是 Row，如果其子窗口部件比父窗口部件多（Row），则其子窗口部件将溢出，并且TextOverflow.ellipsis无济于事