入坑fluter第二天攀涵,遇到Flutter對本地圖片的使用不是很友好,遂去查找是否有相關(guān)的插件可使用羡铲,驚喜發(fā)現(xiàn)了這個庫: flr弧岳,中文readme,其中也包含使用方法
全名讀作Flutter - R,跟之前在原生項目中使用的三方庫R.swift寫法很像,功能上也是用來管理疫赎,圖片、JSON文件碎节、Font等
本人使用的是Mac開發(fā)捧搞,接入方法如下:
1.控制臺中安裝flr
cd 你的flutter工程目錄
flr init
2.打開你的工程中的pubspec.yaml文件,并按照以下配置去填寫钓株,否則文件生成時會報錯,本人目前core_version版本是3.2.0故填寫最新的版本號
flr:
core_version: 3.2.0
# config the line length for formatting r.g.dart
dartfmt_line_length: 80
# config the image and text resource directories that need to be scanned
assets:
- lib/assets/images
- lib/assets/texts
# config the font resource directories that need to be scanned
fonts:
- lib/assets/fonts
3.插件作者推薦的資源項目結(jié)構(gòu),避免報錯陌僵,初期建議參照這個結(jié)構(gòu)去管理
flutter_project_root_dir
├── build
│ ├── ..
├── lib
│ ├── assets
│ │ ├── images // 所有模塊的圖片資源總目錄
│ │ │ ├── #{module} // 某個模塊的圖片資源總目錄
│ │ │ │ ├── #{main_image_asset}
│ │ │ │ ├── #{variant-dir} // 某個變體版本的圖片資源總目錄
│ │ │ │ │ ├── #{image_asset_variant}
│ │ │ │
│ │ │ ├── home // home模塊的圖片資源總目錄
│ │ │ │ ├── home_badge.svg
│ │ │ │ ├── home_icon.png
│ │ │ │ ├── 3.0x // 3.0倍分辨率版本的圖片資源總目錄
│ │ │ │ │ ├── home_icon.png
│ │ │ │
│ │ ├── texts // 文本資源總目錄
│ │ │ │ // (你也可以根據(jù)模塊進一步細分)
│ │ │ └── test.json
│ │ │ └── test.yaml
│ │ │ │
│ │ ├── fonts // 所有字體家族的字體資源總目錄
│ │ │ ├── #{font-family} // 某個字體家族的字體資源總目錄
│ │ │ │ ├── #{font-family}-#{font_weight_or_style}.ttf
│ │ │ │
│ │ │ ├── Amiri // Amiri字體家族的字體資源總目錄
│ │ │ │ ├── Amiri-Regular.ttf
│ │ │ │ ├── Amiri-Bold.ttf
│ │ │ │ ├── Amiri-Italic.ttf
│ │ │ │ ├── Amiri-BoldItalic.ttf
│ ├── ..
4.執(zhí)行,會進行資源掃描并在項目中生成r.g.dart文件
flr run
5.可以使用實時資源監(jiān)聽命令進行管理轴合,會自動更新r.g.dart文件內(nèi)容
flr run --auto
6.開始使用吧!
import 'r.g.dart';
var image = R.image.yourImage();
最后十分感謝插件作者貢獻代碼碗短,希望大家也能給作者點顆星??