flutter - Flutter 中的 Row/Column Widget 中的约束高度是无穷大

Question

我正在 flutter 中创建一个新的自定义小部件。我的要求是提供自定义小部件约束作为父小部件约束。

我在这里遇到了一个小问题，当我将小部件放入容器(父小部件)时，我得到了最大高度和最大宽度的正确值，如下所示

size = Size(this.constraints.maxWidth, constraints.maxHeight);

但是当我将自定义小部件放在 Column 或 Row Widget 中时。我将父约束高度设置为 Infinity。

当高度变为无穷大时，我无法呈现我的自定义小部件。这是 Column 或 Row 小部件中的默认行为吗？请找到我的 customWidget 代码片段

class CustomWigetContainer extends SingleChildRenderObjectWidget {
CustomWigetContainer(
 {
     Widget child
  }): super(child: child);
@override
RenderObject createRenderObject(BuildContext context) {
  return CustomWigetContainerBox();
  }
 }

class CustomWigetContainerBox extends RenderShiftedBox {
 CustomWigetContainerBox() : super(null);

  @override

   void performLayout() {
     child.layout(BoxConstraints(
       minHeight: 0.0,
       maxHeight: constraints.maxHeight,
       minWidth: 0.0,
       maxWidth: constraints.maxHeight
     ), parentUsesSize: true);

    size = Size(this.constraints.maxWidth, constraints
    .maxHeight); // constraints.maxHeight become infinity when widget is placed inside row/column
   }


 @override
  void paint(PaintingContext context, Offset offset) {
    // TODO: implement paint
   super.paint(context, offset);

    final Paint paint = new Paint()
     ..isAntiAlias = true
     ..strokeWidth = 1.0
     ..color = Colors.blue
     ..style = PaintingStyle.fill;
     context.canvas.drawRect(new Rect.fromLTWH(50, 20, 100, 200), paint);
     }
   }

Answer 1

是的，这是 Column 或 Row 小部件沿其主轴的预期怪异行为，因为 Box 约束 按 Column 或 Row 传递给他们的 child 。

在您的情况下，由于您依赖于父项的约束，因此 Column 小部件的子项将扩展到无限高度，因为这是 Column 传递下来的约束对于它的子项，同样对于 Row，子项可以扩展到无限宽度。这可能是针对不同屏幕的响应能力。

为了了解更多，我写了一个article在 Medium 上介绍框约束的一般工作原理以及它们如何与 Column 和 Row 一起工作。

希望这对您有所帮助!