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

環境
Windows11 pro 64bit
Flutter 3.3.7

構文
borderRadius: BorderRadius.circular(xxx),
DrawerHeaderを角丸にするには、BoxDecorationを使います。

作成方法
1.引数「decoration」にBoxDecorationを指定します。
decoration: BoxDecoration(xxx

2.BoxDecorationの引数「borderRadius」に、「BorderRadius.circular(/*丸み*/)」を指定します。
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(xxx),
),

使用例

 @override
Widget build(BuildContext context) {
  return SafeArea(
    child: Scaffold(
      appBar: AppBar(),
      drawer: Drawer(
        child: ListView(
          children: [
            DrawerHeader(
              decoration: BoxDecoration(
                color: Colors.yellow,
                borderRadius: BorderRadius.circular(40),
              ),
              child: Container(),
            ),
          ],
        ),
      ),
    ),
  );
}

 

Flutter

Posted by arkgame