dart - 如何在AppBar上制作圈子资料图片(操作按钮)

同伴开发:D
目前，我正在搜索或用我通过URL获得的个人资料图片替换Appbar操作按钮图标的方法。唯一的问题是，我似乎找不到使它循环的方法。任何的想法？

这是我的AppBar类

class MyAppBar extends AppBar {
  MyAppBar({Key key, String  urlFoto})
  : super(
    key: key,
    title: Text(
      "Himatif App",
      style: TextStyle(fontFamily: 'Strasua'),
    ),
    backgroundColor: Color(0xff3a3637),
    actions: <Widget>[
      // Something here
    ]
  );
}

我找到并尝试过的一些代码

Padding(
  padding: const EdgeInsets.all(8.0),
  child: new Material(
    shape: new CircleBorder(),
  ),
),

/////////////

Material(
  elevation: 4.0,
  shape: CircleBorder(),
  color: Colors.transparent,
  child: Ink.image(
    image: CachedNetworkImageProvider(urlFoto),
    fit: BoxFit.cover,
    width: 120.0,
    height: 120.0,
    child: InkWell(
      onTap: () {},
      child: null,
    ),
  ),
)

/////////////

CircleAvatar(
  minRadius: 5.0,
  maxRadius: 10.0,
  backgroundImage: CachedNetworkImageProvider(urlFoto),
),

类似应用栏右上角的图标，但已替换为用户个人资料图片

最佳答案

ClipRRect小部件使其子小部件循环。您可以将其用墨水瓶包裹起来，使其可用作按钮。

InkWell(
  onTap: () {},
  child: ClipRRect(
    borderRadius: BorderRadius.circular(60),
    child: CachedNetworkImage(
      width: 120,
      height: 120,
      fit: BoxFit.cover,
      imageUrl: "imageUrl goes here",
      placeholder: Center(
        child: CircularProgressIndicator(),
      ),
    ),
  ),
)