【问题标题】:Flutter: SizedBox Vs Container, why use one instead of the other?Flutter:SizedBox Vs Container,为什么使用一个而不是另一个?
【发布时间】:2019-09-07 00:54:10
【问题描述】:

当我开始考虑这两个组成部分时,我发现自己在争论为什么我应该使用一个而不是另一个。我想到的一些问题:

  1. Container 和 SizedBox 有什么区别?

  2. 我知道 Container 可以有其他参数,例如 padding 或 decoration,但如果我不使用这些参数,为什么要使用 SizedBox 而不是 Container?

  3. 它们之间有性能差异吗?

【问题讨论】:

    标签: flutter


    【解决方案1】:

    小更新:When used for whitespace, there is now even a linter warning to prefer SizedBox instead of Container。主要优势似乎是 SizedBox 可以是 const 并且在运行时甚至不会创建新实例。


    得益于开源的魔力,您不必猜测太多。

    Container 基本上只是一个方便的小部件,它有时可以让您省去嵌套 4 个其他小部件。如果您将宽度/高度传递给Container

           constraints =
            (width != null || height != null)
              ? constraints?.tighten(width: width, height: height)
                ?? BoxConstraints.tightFor(width: width, height: height)
              : constraints,
    

    这将导致:

        if (constraints != null)
          current = ConstrainedBox(constraints: constraints, child: current);
    

    ConstrainedBox 实际上与SizedBox 几乎相同,只是更灵活。

    SizedBox 可以:

      @override
      RenderConstrainedBox createRenderObject(BuildContext context) {
        return RenderConstrainedBox(
          additionalConstraints: _additionalConstraints,
        );
      }
    
      BoxConstraints get _additionalConstraints {
        return BoxConstraints.tightFor(width: width, height: height);
      }
    

    即。它实际上是相同的。如果您只使用Container 作为宽度/高度,则可能会产生非常小的性能开销,可以忽略不计。但你肯定无法测量它。但我仍然推荐SizedBox,因为它更清晰。恕我直言。

    【讨论】:

    • 所以关于这个问题(链接),我想知道哪个更适合两者之间的空占位符,它们不需要任何参数? stackoverflow.com/q/57703182/5060513
    • 恕我直言,别担心,使用适合情况的任何东西。空容器几乎不可能成为性能问题。所以使用任何更自然的东西。当我只想隐藏某些东西时,我个人使用 Container()用于加载(这基本上只在我懒于加载指标等的原型制作时发生)。如果我想要特定尺寸,我使用SizedBox。最近我什至一直在使用SizedBox 代替填充来分隔ColumnRow 中的项目.. ymmv
    【解决方案2】:

    我想补充一点,SizedBox 不仅更简单,而且const 也可以,而Container 不能。这可能是您需要的,也可能不是。

    如果你需要一个有颜色的盒子,你不能使用SizedBox。但是https://pub.dev/packages/assorted_layout_widgetsBox 小部件,介于SizedBoxContainer 之间:你可以有颜色,也可以做成const注意我是这个包的作者。

    【讨论】:

    • 您能解释一下const 在您的构建函数中的好处吗?或者指出任何解释它的好处的资源?谢谢。
    • 当然:Const 对象是最终的/不可变的,并且在编译时创建。因此,您不会浪费时间创建它们。此外,所有具有相同参数的相同类型的 const 对象都是相同的实例。因此,您不会浪费内存创建多个它们。换句话说,const 对象使您的程序更快,内存效率更高。
    • 哇,感谢您花时间解释这一点!我现在将更频繁地在我的小部件树中使用const
    • 另外,我昨天才读到,flutter 知道一个元素是否为 const,因此可以在重建时跳过它。
    • CONST 绝对不会提高速度。我对此进行了广泛的测试。不确定它是否可以节省内存。
    猜你喜欢
    • 2015-04-23
    • 1970-01-01
    • 2020-05-26
    • 2013-08-05
    • 1970-01-01
    • 1970-01-01
    • 2015-03-03
    • 2015-08-12
    • 1970-01-01
    相关资源
    最近更新 更多