[Flutter]Containerの色を半透明にするには?

Flutter

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

Containerの色を半透明にする方法を紹介します。

スポンサーリンク

方法

インターフェース, インターネット, プログラム, ブラウザ, Www

まず、Containerの色を引数「color」もしくは「BoxDecoration」の引数「color」にColorsクラスで指定します。

Container(
  color: Colors.blue, //色を指定
),
Container(
  decoration: BoxDecoration(
    color: Colors.blue,
  ),
),

そして、指定したColorsクラスの末尾に「withOpacity(0.5)」をつけます。

Container(
  color: Colors.blue,withOpacity(0.5),
),
Container(
  decoration: BoxDecoration(
    color: Colors.blue.withOpacity(0.5),
  ),
),

これで指定した色が半透明になります。

withOpacityは、色の透明度を設定するものです。

透明度は、0〜1(0が透明、1が不透明)の値で指定します。

半透明の場合は、中間なので「0.5」となります。

コメント

タイトルとURLをコピーしました