什么颜色系统会颤动使用,为什么我们使用`const Color`而不是`new Color`

Question

今天我来到了以下代码片段,它实现了渐变的渐变

return new Container(
  ...
  decoration: new BoxDecoration(
    gradient: new LinearGradient(
      colors: [
        const Color(0xFF3366FF), 
        const Color(0xFF00CCFF),
      ]
      begin: const FractionalOffset(0.0, 0.0),
      end: const FractionalOffset(1.0, 0.0),
      stops: [0.0, 1.0],
      tileMode: TileMode.clamp
    ),
  ),
),

它提出了2个问题:

1)这是什么颜色系统0xFF3366FF？它看起来有点类似于HEX,但事实并非如此.

2)为什么我们使用const了const Color()反对new Color()我了解双方之间的不同,但在这里感觉常量直观对于我来说,我希望它可以创建一个new Color()类的实例,类似于我们如何使用new Text("Some text").如果它需要是const,为什么不是TileMode.clampconst？

Answer 1

来自Flutter来源

class Color {
  /// Construct a color from the lower 32 bits of an [int].
  ///
  /// The bits are interpreted as follows:
  ///
  /// * Bits 24-31 are the alpha value.
  /// * Bits 16-23 are the red value.
  /// * Bits 8-15 are the green value.
  /// * Bits 0-7 are the blue value.
  ///
  /// In other words, if AA is the alpha value in hex, RR the red value in hex,
  /// GG the green value in hex, and BB the blue value in hex, a color can be
  /// expressed as `const Color(0xAARRGGBB)`.
  ///
  /// For example, to get a fully opaque orange, you would use `const
  /// Color(0xFFFF9000)` (`FF` for the alpha, `FF` for the red, `90` for the
  /// green, and `00` for the blue).
  const Color(int value) : value = value & 0xFFFFFFFF;

const 实例是规范化的.

如果const Color(0xFF00CCFF)代码中有多个,则只会创建一个实例.

const实例在编译时进行评估.在Dart VM中,这是加载代码的时间,但在Flutter生产中使用AoT编译,因此const值提供了很小的性能优势.

另请参见const构造函数如何实际工作？

Answer 2

正如公认的答案所解释的那样,const构造函数是一个小优化.

在飞镖中const MyObject(42),即使你召唤数百次,也只会分配一次.这意味着更少的内存分配>更快

但这不是一个可以忽略不计的优化吗？

嗯,从飞镖的角度来看,是的.但是我们在这里扑了一下.我们还有一个Widget树,也可以使用const构造函数.这意味着我们可以将您的代码示例更改为以下内容:

return const DecoratedBox(
  decoration: const BoxDecoration(
    gradient: const LinearGradient(
      colors: const [
        const Color(0xFF3366FF), 
        const Color(0xFF00CCFF),
      ],
      begin: const FractionalOffset(0.0, 0.0),
      end: const FractionalOffset(1.0, 0.0),
      stops: const [0.0, 1.0],
      tileMode: TileMode.clamp
    ),
  ),
);

在这里,由于Color是一个常数,我们设法得到一个常量LinearGradient,最终一个恒定的DecoratedBox小部件.因此,不仅仅会将DecoratedBox窗口小部件实例化一次; 但是由于小部件是不可变的; Flutter会认识到小部件是相同的.

后果:

• 整个子树DecoratedBox将建成一次.
• 相关的RenderObject(RenderDecoratedBox在本例中)即使在父容器更改时也不会更新

这在"Flutter的分层设计"视频讲话中有所解释. 准确地说是3100万.但我建议从这里开始视频,以便更好地理解跳过的内容.

PS:有些部件没有const构造函数在所有.如Container.但是在Container你的情况下你可以简单地使用一个DecoratedBox代替,这基本上是Container在引擎盖下使用.这里的好处是,DecoratedBox 你有一个常量构造函数.