Flutterで角が丸い四角形を作るときはContainer
を利用します。
以下のコードを見てください。
Container( width: 200, height: 200, decoration: BoxDecoration( color: Colors.blue, borderRadius: BorderRadius.circular(16.0), ),),
decoration:
にBoxDecoration
を設定し、その中にContainer
の見た目に関する設定を追加しています。borderRadius:
が角丸の設定ですね。BorderRadius.circular(16.0)
としていますが、この16.0を変えることで丸みの度合いを調節することができます。
ちなみにdecoration:
を使用したときは装飾に関する設定はすべてdecoration:
の中に書かないと動きません。color:
は本来Container
配下でも設定可能ですが、decoration:
を指定しているときはそちらに書かないと動作しなくなってしまうようです。
*「Run」を押すと実行できます。