从网络获取

Image.network(
              'https://cn.bing.com/th?id=OIP.xq1C2fmnSw5DEoRMC86vJwD6D6&pid=Api&rs=1',
              scale: 2,
              frameBuilder: (BuildContext context, Widget child, int frame, bool wasSynchronouslyLoaded) {
                return Padding(
                  padding: EdgeInsets.all(10.0),
                  child: child,
                );
              },
              loadingBuilder: (BuildContext context, Widget child, ImageChunkEvent loadingProgress) {
                if (loadingProgress == null)
                    return child;
                    return Center(
                     child: CircularProgressIndicator(
                      value: loadingProgress.expectedTotalBytes != null
                           ? loadingProgress.cumulativeBytesLoaded / loadingProgress.expectedTotalBytes
                      : null,
                  ),
                );
              },
              //fit: BoxFit.fill,
              alignment: Alignment.center,
              repeat: ImageRepeat.noRepeat,
              centerSlice: Rect.fromLTRB(10, 10, 10, 10),
              matchTextDirection:false,
              gaplessPlayback: false,
              filterQuality: FilterQuality.low,
          )

1. scale

是指缩小倍数

2. frameBuilder

图片帧处理 ，比如图片边距设置，加载动画之类的。

3. loadingBuilder

图片加载的时候一些处理

4. fit
类似 Android 的 ImageView 的 scaleType

fit.png

5. alignment

对齐的方式

image.png

6. repeat

控件剩余没占满的空间如何绘制，默认 ImageRepeat.noRepeat

• ImageRepeat.repeat 在x和y方向上重复图像，直到填充框
• ImageRepeat.repeatX 在x方向上重复图像，直到水平填充框
• ImageRepeat.repeatY 在y方向重复图像，直到垂直填充框
• ImageRepeat.noRepeat 将盒子的未覆盖部分保持透明

7. centerSlice

将图片进行切割

image.png

8. matchTextDirection

是否在TextDirection的方向上展开图片。

9. gaplessPlayback

图像路径发生变化时，是否继续不加载新图片，默认 false

10. filterQuality

图像过滤器的质量级别。(渲染模式的质量)，默认 FilterQuality.low

image.png

从本地加载图片

项目中创建 images 文件夹。

images

然后再 pubspec.yaml 里面配置图片

  assets:
      - images/wx_icon.png

最后使用为 ：

Image.asset("images/wx_icon.png")

其他属性和 network 的一样。

从本地文件夹加载图片

new Image.file(new File("对应文件夹里面图片路径")),

加载头像

new CircleAvatar(
              backgroundImage: new NetworkImage('https://cn.bing.com/th?id=OIP.xq1C2fmnSw5DEoRMC86vJwD6D6&pid=Api&rs=1'),
              radius: 100.0,
            ),

image.png