[Flutter]OutlinedButtonを角丸にするには?

Flutter

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

OutlinedButtonを角丸にする方法を紹介します。

スポンサーリンク

方法

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

OutlinedButtonを角丸にするには、まず引数「style」に「OutlinedButton.styleFrom」を指定します。

次に、OutlinedButton.styleFromの引数「shape」に「RoundedRectangleBorder」を指定します。

最後に、指定した「RoundedRectangleBorder」の引数「borderRadius」で、角丸の設定をします。

OutlinedButton(
  style: OutlinedButton.styleFrom(
    shape: RoundedRectangleBorder(
      borderRadius: BorderRadius.circular(20),//角の丸み
    ),
  ),
  onPressed: () {},
  child: Text('Button'),
)

角の丸みは、「BorderRadiusクラス」で設定します。

コメント

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