flutter学习之图片显示

flutter图片资源可以放在项目中的任意文件夹下面，之后需要再pubspec.yaml文件夹中add这个图片的目录

框框中图片a在项目根目录的assets文件夹下

该文件夹下创建之文件夹n.0x表示图片的倍率

 

显示一张本地图片

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Welcome to Flutter',
      home: new Scaffold(
        appBar: new AppBar(
          title: new Text('Welcome to Flutter'),
        ),
        body: Image.asset("assets/a.png"),
      ),
    );
  }
}

显示一张网络图片

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Welcome to Flutter',
      home: new Scaffold(
        appBar: new AppBar(
          title: new Text('Welcome to Flutter'),
        ),
        body: Image.network("https://www.baidu.com/img/bd_logo1.png"),
      ),
    );
  }
}

显示一张网络图片，并且存入缓存

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Welcome to Flutter',
      home: new Scaffold(
        appBar: new AppBar(
          title: new Text('Welcome to Flutter'),
        ),
        body: new CachedNetworkImage(
          placeholder: new CircularProgressIndicator(),
          imageUrl:
          'https://github.com/flutter/website/blob/master/_includes/code/layout/lakes/images/lake.jpg?raw=true',
        ),
      ),
    );
  }
}

需要添加依赖

cached_network_image: ^0.4.1

flutter依赖库可以在https://pub.dartlang.org/flutter/查询