flutter 在UnconstrainedBox中创建一个小部件，然后根据屏幕调整大小，而不会出现RenderOverflow错误

js81xvg6 于 2023-10-22 发布在 Flutter

关注(0)|答案(1)|浏览(113)

我正在尝试创建一个看起来像德国汽车标志的小部件。为此，我阅读了说明书
由于这是一个官方标志，有很多关于尺寸的规格。首先，我只是将官方尺寸（以毫米为单位）Map到像素。例如，标志的官方宽度是520 mm，所以我使用520 px。
我的想法是从一个UnconstrainedBox开始，它具有官方宽度/高度的Container。

UnconstrainedBox(
  child: Container(
  width: _width,
  height: _height,
));

我希望我得到一个RenderOverflow错误，因为小部件将比iPhone 15的视图端口更宽：

所以，我想我可以使用一个Transform.scale并将所有内容缩小，以便它可以放回设备中，就像这样：

Transform.scale(
  scale: 0.5,
  child: GermanCarSign(),
);

但是，我仍然看到RenderOverflow错误。从视觉上看，小部件现在将适合视口。
那么，创建一个遵循特定规范的小部件，然后缩放整个部件使其适合视口而不会出现RenderOverflow错误的正确方法是什么呢？
我试过摆弄AspectRatio或OverflowBox小部件，但我没有成功，也许我做错了。

flutter

来源：https://stackoverflow.com/questions/77220597/create-a-widget-in-an-unconstrainedbox-and-then-size-it-to-the-screen-without-ge

1条答案

按热度按时间

tvokkenx1#

@pskink向我指出了一个正确使用OverflowBox小部件的repo。
在我的例子中，我做了以下事情来获得我想要的结果：

@override
Widget build(final BuildContext context) =>
    LayoutBuilder(
      builder: (final context, final constraints) =>
          Transform.scale(
            scale: constraints.maxWidth / _width, // _width = 520
            child: OverflowBox(
              minWidth: constraints.minWidth,
              minHeight: constraints.minHeight,
              maxWidth: double.infinity,
              maxHeight: double.infinity,
              child: SizedBox(
                width: _width,
                height: _height,
                child: const Placeholder(),
              ),
            ),
          ),
    );

赞(0）回复(0）举报 2023-10-22

我来回答

flutter 在UnconstrainedBox中创建一个小部件，然后根据屏幕调整大小，而不会出现RenderOverflow错误

1条答案

相关问题

热门标签

最新问答