本文介绍了在Flutter中加载网络图片的多种方法，包括直接使用`Image.network`，使用`FadeInImage`实现淡入效果，以及使用`CachedNetworkImage`进行缓存。示例代码展示了如何设置默认占位图、加载 Animated Gif 和应用内图片作为占位图。通过这些方法，可以提升用户体验并优化图片加载过程。
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: ‘Image Demo’,
home: new HomePage(),
);
}
}
class HomePage extends StatefulWidget {
@override
State createState() => new _HomePageState();
}
class _HomePageState extends State {
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(title: new Text(‘Web Image Demo Page’),),
body: new ListView(children: [
Container(
margin: EdgeInsets.only(bottom: 12.0),
decoration: BoxDecoration(color: Colors.grey),
child: Column(children: [
Image.network(
‘https://raw.githubusercontent.com/flutter/website/master/_includes/code/layout/lakes/images/lake.jpg’,
),
Text(‘Image.network’)
],),
),
Container(
margin: EdgeInsets.only(bottom: 12.0),
decoration: BoxDecoration(color: Colors.grey),
child: Column(children: [
Image.network(
‘https://github.com/flutter/plugins/raw/master/packages/video_player/doc/demo_ipod.gif?raw=true’,
),
Text(‘Image.network Animated Gifs’)
],),
),
],),
);
}
}
最低0.47元/天 解锁文章
扫一扫
827
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
