Flutter 本地图片配置和使用,添加启动图和Icon
1.配置启动图和Icon
在Flutter开发中，Android和iOS对应的图片资源要放到对应的资源文件夹中，有一定的共同点，也有不一样的地方：
1.1 iOS图片配置
在iOS中，直接在Assets中拖入对应尺寸的Icon和LaunchImage即可，运行效果就不展示了。
iOS-Icon配置
1.2 Android 图片配置
在Android中，也是需要将图片导入指定的文件夹中：
android图片放置文件夹
- 各文件夹对应的图片尺寸：
- mipmap-hdpi： 1x 图片
- mipmap-mdpi： 1.5x 图片
- mipmap-xhdpi： 2x 图片
- mipmap-xxhdpi： 3x 图片
- mipmap-xxxhdpi：4x 图片
配置Android图片路径和启动图的文件夹需要用到两个文件：
- AndroidManifest.xml ：配置app名称，icon图片路径等；
AndroidManifest.xml
-
launch_background.xml: 位置在res-drawable文件夹下，主要是配置启动图相关信息；
注意：启动图的放置路径：mipmap-hdpi文件夹下，和launch_background.xml不在同一路径下！
launch_background.xml
启动效果如下展示：
android启动图示例
2. 公共资源图片配置和使用
2.1 本地图片的路径配置
除了Icon和启动图这类对应的需要适配的图片外,有些iOS和Android可以共同使用的图片,可以使用package配置到工程的路径下,然后在使用Asset管理图片,在pubspec.yaml文件中指定图片的路径;
pubspec.yaml格式和配置
注意: 可能报错
flutter: The following assertion was thrown resolving an image codec:
flutter: Unable to load asset: images/tabbar_chat_hl.png
flutter: Another exception was thrown: Unable to load asset: images/tabbar_friends.png
如果文件的路径层级缩进不对,就回导致load图片失败的问题,所以要注意assets配置的空格层级;
2.2 本地图片的使用
以底部tabbar的图片配置使用为例:
BottomNavigationBarItem(
icon:Image(height:20,width: 20,image: AssetImage('images/tabbar_chat.png')),
activeIcon: Image(height:20,width: 20,image: AssetImage('images/tabbar_chat_hl.png')),
title: Text('微信')),
注意,使用AssetImage()函数直接调取本地图片即可, activeIcon为tabbar选中的图片;
tabbar示例
