Geek Answers Handbook

What color system does flutter use and why do we use `const color` instead of` new color`

Today I came to the following code snippet that implements a gradient in flutter

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
    ),
  ),
),

And he raised 2 questions:

1) What is the color system 0xFF3366FF? It looks a bit like HEX, but it is not.

2) Why do we use constfor const Color(), the opposite new Color(), I understand the different between them, but the const here seems unintuitive for me, I expect it to create an instance of the class in the new Color()same way as we use new Text("Some text"). If it should be const, why not TileMode.clampalso const?

+6
source share
2 answers

From flutter source

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?

+5

, const - .

a const MyObject(42) , . >

?

, , . . , 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 ; ; , .

:

  • DecoratedBox .
  • RenderObject (RenderDecoratedBox ) ,

- "Flutter layered design". 31mn, . , , .

PS: const. , Container. Container DecoratedBox, Container . , DecoratedBox const.

+4

More articles:


All Articles