MENU

【Flutter】Containerの角を丸めるには?

記事内に商品プロモーションが含まれる場合があります

Containerウィジェットの角を丸くするにはBoxDecorationを使用してborderRadiusプロパティを設定します。

目次

四隅を丸める

Container(
  width: 250,
  height: 250,
  decoration: BoxDecoration(
    color: Colors.blue,
    borderRadius: BorderRadius.circular(16),
  ),
);

一部の角を丸くする

Container(
   width: 250,
   height: 250,
   decoration: const BoxDecoration(
     color: Colors.blue,
     borderRadius: BorderRadius.only(
       topLeft: Radius.circular(25), // 左上の角を丸める
       bottomRight: Radius.circular(25), // 右下の角を丸める
     ),
   ),
);

関連記事

Flutterが学べる書籍

created by Rinker
シーアンドアール研究所
Share
  • URLをコピーしました!

Comment

コメントする

目次