[Flutter]色をRGBで指定するには？

どうも、ちょげ(@chogetarou)です。

色をRGBで指定する方法を紹介します。

方法

色をRGBで指定する方法は、２つあります。

Colors.fromRGB

１つは、Color.fromRGBOを使う方法です。

具体的には、Color.fromRGBOの４つの引数に色の情報を指定します。

//red, green, blueには、「０〜２５５」の値を指定
//opacityには、透明度を「０〜１」で指定（0に近づくほど透明、1に近づくほど不透明）
Color.fromRGBO(red, green, blue, opacity)

使用例

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        body: Center(
          child: Container(
            width: 200,
            height: 200,
            color: Color.fromRGBO(40, 100, 24, 0.5),
          ),
        ),
      ),
    );
  }

Color()

もう１つは、Color()を使う方法です。

具体的には、Colorの引数にRGBを１６進数で指定します。

RGBは、赤、緑、青、透明度（０〜１００%）の順で指定します。

Color(0xffffffff)

使用例

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        body: Center(
          child: Container(
            width: 200,
            height: 200,
            color: Color(0xff2980b9),
          ),
        ),
      ),
    );
  }

まとめ

色をRGBで指定する方法は、次の２つです。

• Color.formRGBOを使う方法
• Color()を使う方法