Flutter 项目图片资源管理

mdk1906

2637人浏览 · 2021-12-30 16:06:57

mdk1906 · 2021-12-30 16:06:57 发布

Flutter 项目图片资源管理

项目中要用到的icon、默认图片、一些图片资源管理方式。

一、脚本管理

读取文件夹所有图片资源，复制粘贴到pubsepec.yaml文件，Pub get
脚本放到Image文件夹下，运行脚本

function echo_name(){ 
 for file in `ls $1` 
 do 
if [ -d $1"/"$file  ]; 
then
  echo "#"$1"/"$file 
else
  echo "    - "$1"/"$file 
fi
  if [ -d $1"/"$file ] 
  then 
   echo_name $1"/"$file 
   fi 
 done 
} 
  
echo_name $1

images % sh flutter_img.sh -image

运行结果：
在这里插入图片描述
复制粘贴后放到pubsepec.yaml文件后可以使用本地图片资源。

二、AndroidStudio flutter-img-sync插件

flutter-img-sync

step1.创建资产图片存放目录
创建资产图片存放目录如:
在这里插入图片描述
step2.修改pubspec.yaml
定义资产图片存放目录，如:

step3.执行扩展命令: FlutterImgSync
在这里插入图片描述
端口随便填4位数字
命令执行后，图片将会被自动放置到pubspec.yaml文件的assets变量中
./lib/r.dart 将会被创建
在代码中导入r.dart文件，然后引用R类的变量

step4.引用R文件，引用图片

开源鸿蒙跨平台开发者社区

开源鸿蒙跨平台开发社区汇聚开发者与厂商，共建“一次开发，多端部署”的开源生态，致力于降低跨端开发门槛，推动万物智联创新。

更多推荐

Flutter 鸿蒙化实战：agora_rtm 适配 OpenHarmony，实时消息通道

随着鸿蒙生态的快速发展，越来越多的 Flutter 应用需要适配 OpenHarmony 平台。但生态早期，大量常用三方库只有 Android / iOS 实现，鸿蒙侧只能自己造轮子。为了解决这个问题，对一批高频使用的 Flutter 三方库做了 OpenHarmony 平台适配，统一托管在 GitCode 的下，全部通过 TAG 版本隔离、配套门禁编译验证，开箱即用。本篇是系列文章之一，主角是—

开源鸿蒙跨平台开发者社区

OpenHarmony平台RN三方库适配情况

该文档旨在帮助开发者在 HarmonyOS 平台使用 React Native OpenHarmony 的第三方库，并呈现每个三方库的信息。欢迎您参与贡献，我们鼓励开发者以各种方式参与文档反馈和贡献。您可以对现有文档进行评价、简单更改、反馈文档质量问题、贡献您的原创内容，详细请参考贡献文档。Github Organization: react-native-oh-library