转载自 https://www.jianshu.com/p/c46545277bbe
Image控件即图片控件,是显示图像的控件,Image控件有多种构造函数:
new Image,用于从ImageProvider获取图像。
new Image.asset,用于使用key从AssetBundle获取图像。
new Image.network,用于从URL地址获取图像。
new Image.file,用于从File获取图像。
获取本地图片
首先最重要的是引入图片, 在pubspec.yaml 文件中添加你要引入的图片
flutter:
assets:
- assets/1.jpg
然后你需要创建一个assets 的文件夹 里面有一个叫做 1.jpg 的图片
new Image.asset(本地静态资源的地址)
import 'package:flutter/material.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Flutter Demo',
home: new MyImg(),
);
}
}
class MyImg extends StatelessWidget{
@override
Widget build(BuildContext context) {
// TODO: implement build
return new MaterialApp(
title:'图片如何放入',
home: new Scaffold(
body: new Center(
child: new Image.asset('assets/1.jpg'),
),
)
);
}
}
还有就是背景图片
class FirstScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('First Screen'),
),
body: Center(
child: Container(
child: new Text('hello'),
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/1.jpg'),
),
),
width: 200,
height: 200,
),
),
);
}
}
获取网络图片
new Images.network(网络资源https/http)
import 'package:flutter/material.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Flutter Demo',
home: new MyImg(),
);
}
}
class MyImg extends StatelessWidget{
@override
Widget build(BuildContext context) {
// TODO: implement build
return new MaterialApp(
title:'图片如何放入',
home: new Scaffold(
body: new Center(
child: new Image.network('https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1533368711441&di=9517daea3b4fc02d74b27a1f0e2d11f8&imgtype=0&src=http%3A%2F%2Fimage13-c.poco.cn%2Fmypoco%2Fmyphoto%2F20121102%2F22%2F66582707201211022200252633924731300_000_640.jpg'),
),
)
);
}
}