flutter控件之图片控件

Image控件即图片控件，是显示图像的控件，Image控件有多种构造函数：

new Image，用于从ImageProvider获取图像。
new Image.asset，用于使用key从AssetBundle获取图像。
new Image.network，用于从URL地址获取图像。
new Image.file，用于从File获取图像。

为了自动执行像素密度感知资源分辨率，使用AssetImage指定图像，需要确保在控件树中的图片控件上方存在MaterialApp、WidgetsApp和MediaQuery控件。

下面是一个从URL地址获取图像的实例，并通过scale属性设置缩放比例：

下面是一个从本地文件目录中获取图像的实例：

上面的代码会在一个容器里显示一张图片，但是不同的手机有不同的像素比率，这时就需要根据手机的像素比率来加载不同图片，做法很简单，只需要在图片同级目录下创建2.0x/…和3.0/…的目录就可以了。

通过URL获取图片：

import 'package:flutter/material.dart';
class ImageDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('从URL地址获取图像'),
      ),
      body: new Center(
        child: new Image.network(
          'http://pic.baike.soso.com/p/20130828/20130828161137-1346445960.jpg',
          scale: 2.0,
        ),
      ),
    );
  }
}
void main() {
  runApp(
    new MaterialApp(
      title: 'Flutter教程',
      home: new ImageDemo(),
    ),
  );
}

效果：

flutter控件之图片控件

获取本地的图片：

1.新建放置图片的目录，把图片导入其中

2.在pubspec .yaml中设置参数如图所示

flutter控件之图片控件

3.进行代码的书写

flutter控件之图片控件

效果如图所示：

flutter控件之图片控件