CircleAvatar 不是圈子答案

【问题标题】：CircleAvatar not circleCircleAvatar 不是圈子
【发布时间】：2021-04-21 11:34:46
【问题描述】：

我尝试在UserAccountDrawerHeader() 上创建个人资料。我将属性currentAccountPicture: 和CircleAvatar() 用于图像用户。但头像不圆。

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Hello World'),
      ),
      drawer: Drawer(
        child: ListView(
          padding: EdgeInsets.zero,
          children: [
            DrawerHeader(
              child: UserAccountsDrawerHeader(
                accountName: Text('Jo'),
                accountEmail: Text('hello@world.com'),
                currentAccountPicture: CircleAvatar(
                  backgroundColor: Colors.pink,
                  child: Text('JA'),
                ),
              ),
              decoration: BoxDecoration(color: Colors.blue),
            ),
          ],
        ),
      ),
    );
  }
}

我的代码有什么问题？

【问题讨论】：

标签： flutter

【解决方案1】：

这是你的解决方案

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Hello World'),
      ),
      drawer: Drawer(
        child: Column(
          children: [
            UserAccountsDrawerHeader(
                accountName: Text('Jo'),
                accountEmail: Text('hello@world.com'),
                currentAccountPicture: CircleAvatar(
                  maxRadius: 5,
                  backgroundColor: Colors.pink,
                  child: Text('JA'),
                  
                ),
              ),
          ],
        ),
      ),
    );
  }
}

截图

问题：

您使用 DrawerHeader，然后将 UserAccountsDrawerHeader 作为其子代，但未占用足够空间。

DrawerHeader(
              child: UserAccountsDrawerHeader(
                accountName: Text('Jo'),
                accountEmail: Text('hello@world.com'),
                currentAccountPicture: CircleAvatar(
                  maxRadius: 5,
                  backgroundColor: Colors.pink,
                  child: Text('JA'),
                  
                ),
              ),
              decoration: BoxDecoration(color: Colors.blue),
            ),

【讨论】：

啊，我明白了。如果我使用UserAccountsDrawerHeader，我不需要DrawerHeader。
是的，它会自己解决的:)

【解决方案2】：

这是解决方案：

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Hello World'),
      ),
      drawer: Drawer(
        child: Column(
          children: [
            UserAccountsDrawerHeader(
                accountName: Text('Jo'),
                accountEmail: Text('hello@world.com'),
                currentAccountPicture: CircleAvatar(
                  maxRadius: 5,
                  backgroundColor: Colors.pink,
                  child: Text('JA'),
                  
                ),
              ),
          ],
        ),
      ),
    );
  }
}

【讨论】：