/**
const Image({
Key key,
@required this.image,
this.semanticLabel,
this.excludeFromSemantics = false,
//width和height，Image显示区域的宽度和高度，跟要显示的图片没有关系，它只是承载图片的容器
this.width,
this.height,
this.color,
this.colorBlendMode,
//BoxFit.fill 全图显示，显示可能拉伸，充满
//BoxFit.contain 全图显示，显示原比例，不需充满
//BoxFit.cover 显示可能拉伸，可能裁剪，充满
//BoxFit.fitWidth 显示可能拉伸，可能裁剪，宽度充满
//BoxFit.fitHeight 显示可能拉伸，可能裁剪，高度充满
//BoxFit.none
//BoxFit.scaleDown 效果和contain差不多,但是此属性不允许显示超过源图片大小，可小不可大
this.fit,
this.alignment = Alignment.center,//控制图片的摆放位置
//图片太小时重复方式
this.repeat = ImageRepeat.noRepeat,
this.centerSlice,
this.matchTextDirection = false,
//当ImageProvider发生变化后，重新加载图片的过程中，原图片的展示是否保留。若值为true，保留，若为false，不保留，直接空白等待下一张图片加载。
this.gaplessPlayback = false,
})
*/
/**
Image.network(
String src,//网络图片地址
{
Key key,
double scale = 1.0,
...
this.gaplessPlayback = false,
Map<String, String> headers,
}) : image = NetworkImage(src, scale: scale, headers: headers),
assert(alignment != null),
assert(repeat != null),
assert(matchTextDirection != null),
super(key: key);
*/
/**
Image.asset(
String name // 资源图片
,{
...
})
*/
/**
Image.file(
File file // 本地文件图片
,{
...
})
*/
/**
Image.memory(
Uint8List bytes // Uint8List图片
,{
...
})
*/
class Widget_Image_State extends State<Widget_Image_Page> {
var neturl = "https://img4.duitang.com/uploads/item/201210/06/20121006120433_CZXuC.jpeg";
var tempUrl = "http://img5.imgtn.bdimg.com/it/u=2230167403,4188800858&fm=26&gp=0.jpg";
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text("Image"),
),
body: ListView(
children: <Widget>[
Image(
image: NetworkImage(tempUrl),
),
Container(
color: Colors.grey,
child: Column(
children: <Widget>[
Container(
color: Colors.red,
margin: EdgeInsets.only(top: 20.0),
child: Image.network(neturl,
width: 200.0,
height: 200.0,
fit: BoxFit.fill,
),
),
Container(
color: Colors.red,
margin: EdgeInsets.only(top: 20.0),
child: Image.network(neturl,
width: 200.0,
height: 200.0,
fit: BoxFit.contain,
),
),
Container(
color: Colors.red,
margin: EdgeInsets.only(top: 20.0),
child: Image.network(neturl,
width: 200.0,
height: 200.0,
fit: BoxFit.cover,
),
),
Container(
color: Colors.red,
margin: EdgeInsets.only(top: 20.0),
child: Image.network(neturl,
width: 200.0,
height: 200.0,
fit: BoxFit.fitWidth,
),
),
Container(
color: Colors.red,
margin: EdgeInsets.only(top: 20.0),
child: Image.network(neturl,
width: 200.0,
height: 200.0,
fit: BoxFit.fitHeight,
),
),
Container(
color: Colors.red,
margin: EdgeInsets.only(top: 20.0),
child: Image.network(neturl,
width: 200.0,
height: 200.0,
fit: BoxFit.none,
),
),
Container(
color: Colors.red,
margin: EdgeInsets.only(top: 20.0),
child: Image.network(neturl,
width: 200.0,
height: 200.0,
fit: BoxFit.scaleDown,
),
),
],
)
),
Container(
color: Colors.greenAccent,
child: Column(
children: <Widget>[
Container(
color: Colors.blue,
margin: EdgeInsets.only(top: 20.0),
child: Image.asset("images/icon_hongbao.png",
width: 200.0,
height: 200.0,
repeat: ImageRepeat.repeat,
),
),
Container(
color: Colors.blue,
margin: EdgeInsets.only(top: 20.0),
child: Image.asset("images/icon_hongbao.png",
width: 200.0,
height: 200.0,
repeat: ImageRepeat.repeatX,
),
),
Container(
color: Colors.blue,
margin: EdgeInsets.only(top: 20.0),
child: Image.asset("images/icon_hongbao.png",
width: 200.0,
height: 200.0,
repeat: ImageRepeat.repeatY,
),
),
Container(
color: Colors.blue,
margin: EdgeInsets.only(top: 20.0),
child: Image.asset("images/icon_hongbao.png",
width: 200.0,
height: 200.0,
repeat: ImageRepeat.noRepeat,
alignment: Alignment.bottomRight,
),
),
],
),
),
Container(
color: Colors.orange,
child: Column(
children: <Widget>[
Container(
color: Colors.red,
margin: EdgeInsets.only(top: 20.0),
child: Image.network(tempUrl,
width: 200.0,
height: 200.0,
gaplessPlayback: true,
),
),
Container(
color: Colors.red,
margin: EdgeInsets.only(top: 20.0),
child: Image.network(tempUrl,
width: 200.0,
height: 200.0,
gaplessPlayback: false,
),
),
RaisedButton(
child: Text("点击改变图片地址"),
onPressed: (){
setState(() {
tempUrl =
"https://img4.duitang.com/uploads/item/201210/06/20121006120433_CZXuC.jpeg";
});
},
),
],
),
),
Image.asset("images/app.png"),
Image.file(File("")),
// Image.memory("")
],
),
),
);
}
}
网友评论