IconButton CircleAvatar不显示图像

时间:2019-08-22 13:57:57

标签: flutter flutter-layout

我正在为我的应用程序创建一个AppBar,但是无法在CircleAvatar按钮(此蓝色圆圈)中插入图片:

enter image description here

我现在用来创建CircleAvatar按钮的代码如下:

main.dart:

appBar: AppBar(
          actions: <Widget>[
            IconButton(
                icon: CircleAvatar(
                    child: new Image.asset("assets/images/example.jpeg")),
                onPressed: () {}),
          ]),

pubspec.yaml:

assets:
     - assets/images/example.jpeg

我正在尝试使用此图片:

enter image description here

所以我需要使该图像出现并适合那个蓝色的CircleAvatar按钮,但我不明白为什么它无法正常工作。

有人可以帮助我解决这个问题吗?

PS:如果有人知道要求用户以他或她想要的方式拟合图像的程序包或代码示例,这对我会有很大帮助,因为我希望用户能够拟合以最佳尺寸显示图像。例如:

enter image description here

发生以下错误:

enter image description here

有人知道如何解决吗?

3 个答案:

答案 0 :(得分:3)

child替换为backgroundImage

所以,不要使用

CircleAvatar(
  child: AssetImage("assets/images/example.jpeg"),
)

使用

CircleAvatar(
  backgroundImage: AssetImage("assets/images/example.jpeg"),
)

答案 1 :(得分:0)

您可以使用ClipRRect小部件

ClipRRect(
  child: AssetImage("assets/images/example.jpeg"),
  borderRadius: BorderRadius.circular(16)
)

答案 2 :(得分:0)

如果您使用的是 android studio,“文件”选项中的“无效缓存/重启”将起作用。