android - 背景类似于 Flutter 中的 Container

Question

我有一个类似容器的背景(带圆角的容器)。如果作为一个 child 是一个文本，一切都很好。但是，如果 child 是图像，它覆盖了整个容器(甚至角落)。

我的构建方法:

@override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: buildAppBar("", context),
        body: new Container(
            color: Colors.brown,
            child: Material(
              borderRadius: const BorderRadius.only(
                  topLeft: const Radius.circular(16.0),
                  topRight: const Radius.circular(16.0)),
              elevation: 12.0,
              child: new Column(
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                  children: <Widget>[
                    Image(image: NetworkImage('url')),
                  ]),
            )));
  }

如何使图像在半径角内？

Answer 1

使用ClipRRect

ClipRRect(
        borderRadius: BorderRadius.only(topLeft: Radius.circular(16.0), topRight: Radius.circular(16.0)),
        child: Image(image: NetworkImage('url'))),

UPD在 Card 中找到了另一个解决方案 - Clip.antiAlias:

Material(
      child:  Card(
        shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.only(topLeft: Radius.circular(16.0), topRight: Radius.circular(16.0))),
        child: Image(image: NetworkImage('url')),
        elevation: 12.0,
        clipBehavior: Clip.antiAlias,
      ),
    ),