我爱模板网 > 建站教程 > APP开发,混合APP >  Flutter笔记30:本地图片资源加载正文

Flutter笔记30:本地图片资源加载

在assets目录,放不同分辨率的图片,如1.jpg、2.0x/1.jpg、3.0x/1.jpg,在pubspec.yaml中引入此图片,如:
1assets:
2  - assets/images/1.jpg
AssetImage会自动根据不通分辨率去找合适的图片。
ExactAssetImage可以对图片进行缩放,scale数值越小,放的越大,1为原图大小,下面是具体用法
除了AssetImage外,还可以用Image.asset来加载本地图片。下面是具体的代码:
01class MyApp extends StatelessWidget {
02  const MyApp({Key key}) : super(key: key);
03 
04  @override
05  Widget build(BuildContext context) {
06    return MaterialApp(
07      title: 'AssetImage资源图片',
08      home: Scaffold(
09        appBar: AppBar(
10          title: Text('AssetImage资源图片'),
11        ),
12        body: Column(
13          children: [
14            SizedBox(
15              width: 200.0,
16              height: 200.0,
17              child: CircleAvatar(
18                backgroundImage: AssetImage('assets/images/1.jpg'),
19              ),
20            ),
21            Container(
22              child: Image(
23                width: 200.0,
24                height: 200.0,
25                image: AssetImage('assets/images/1.jpg')
26              ),
27            ),
28            Image(
29              image: ExactAssetImage('assets/images/1.jpg', scale: .5),
30            ),
31            Image.asset('assets/images/1.jpg',fit: BoxFit.cover,)
32          ],
33        ),
34      ),
35    );
36  }
37}



部分素材资源来源网站,本站提供免费下载,如有侵权请联系站长马上删除!
上一篇:Flutter笔记29:IconTheme图标主题 下一篇:Flutter笔记31:DecorationImage装饰图片/背景图片
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
选择头像:
最新评论

猜你喜欢