Flutter占位图和圆角实现

1.FadeInImage.assetNetwork 实现占位图

FadeInImage.assetNetwork(
              placeholder: 'images/placeholder.png',
              image: imageUrl,
              width: 100,
              fit: BoxFit.fitWidth,
            )

2.CachedNetworkImage实现占位图

CachedNetworkImage(
                          imageUrl:
                             url,
                          placeholder: (context, url) => new Image.asset(
                              "image/placeholder.png",
                              width: 100,
                              height: 100,
                          errorWidget: (context, url, error) =>
                              new Image.asset("image/news_big_default.png"),
                        )

3.既有圆角，又有占位图

Scaffold(
        appBar: AppBar(
          title: Text(widget.title),
        ),
        body: Center(
            child: Container(
          width: 250,
          height: 150,
          child: ClipRRect(
            borderRadius: BorderRadius.circular(10),
            child: FadeInImage.assetNetwork(
              placeholder: "images/ic_device_image_default.png",
              image: imagePath,
              fit: BoxFit.cover,
            ),
          ),
        )));