How to remove UserAccountsDrawerHeader outline on flutter

user_17599261 0
Viewed 167

I'm learning flutter. I used the UserAccountsDrawerHeader widget using the Drawer widget, but when setting Radius, unnecessary line appears below. How can you remove it?

Here's my code

drawer: Drawer(
        child: ListView(
          padding: EdgeInsets.zero,
          children: [
            UserAccountsDrawerHeader(
              currentAccountPicture: CircleAvatar(
                child: Image.asset('assets/nyancat_bg.png'),
                backgroundColor: Colors.white,
              ),
              accountName: Text('NYAN CAT'),
              accountEmail: Text('nyancat@abc.com'),
              onDetailsPressed: () {
                debugPrint("arrow is clicked");
              },
              decoration: BoxDecoration(
                  color: Colors.indigo[400],
                  borderRadius: BorderRadius.only(
                      bottomLeft: Radius.circular(20.0),
                      bottomRight: Radius.circular(20.0))),
            )
          ],
        ),
      ),

screenshot

flutter
2 Answers

Use a ClipRRect to make the border radius. Like so:

    ClipRRect(
      borderRadius: BorderRadius.only(
        topLeft: Radius.circular(20),
        topRight: Radius.circular(20),
      ),
      child: UserAccountsDrawerHeader(
        currentAccountPicture: CircleAvatar(
          child: Image.asset('assets/nyancat_bg.png'),
          backgroundColor: Colors.white,
        ),
        accountName: Text('NYAN CAT'),
        accountEmail: Text('nyancat@abc.com'),
        onDetailsPressed: () {
          debugPrint("arrow is clicked");
        },
        decoration: BoxDecoration(
          color: Colors.indigo[400],
        ),
      ),
    )
user_114525110

Use ClipRRect
ex)

drawer: Drawer(
        child: ListView(
//           padding: EdgeInsets.zero,
          children: [
            ClipRRect(
              borderRadius: BorderRadius.only(
                  bottomLeft: Radius.circular(20.0),
                  bottomRight: Radius.circular(20.0)),
              child: UserAccountsDrawerHeader(
                margin: EdgeInsets.zero,
                currentAccountPicture: CircleAvatar(
                  child: Image.asset('assets/nyancat_bg.png'),
                  backgroundColor: Colors.white,
                ),
                accountName: Text('NYAN CAT'),
                accountEmail: Text('nyancat@abc.com'),
                onDetailsPressed: () {
                  debugPrint("arrow is clicked");
                },
                decoration: BoxDecoration(
                  color: Colors.indigo[400],
//                   borderRadius: BorderRadius.only(
//                       bottomLeft: Radius.circular(20.0),
//                       bottomRight: Radius.circular(20.0)),
                ),
              ),
            ),
          ],
        ),
      ),

안녕하세요! https://open.kakao.com/o/gsshoXJ 로 오시면 더 자세하고 많은 이야기를 나누실 수 있습니다.

user_89120430
Related