Flutter OutlinedButtonを角丸にするサンプル

2023年10月18日

環境
Windows11 pro 64bit
Flutter 3.3.7

構文

style: OutlinedButton.styleFrom(
  shape: RoundedRectangleBorder(
    borderRadius: BorderRadius.circular(xxx),//角の丸み
  ),
),

引数「style」に「OutlinedButton.styleFrom」を指定します。
指定した「RoundedRectangleBorder」の引数「borderRadius」で、角丸の設定をします。

使用例

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