Flr：一個出色的Flutter資源管理工具

前言

做爲一名Flutter開發者，若是你正在煩惱如何簡單快捷地在pubspec.yaml中爲多張圖片、文本、字體資源添加聲明，若是你正在煩惱如何簡單安全地在代碼中引用資源，那麼如今你能夠很簡單地解決這些問題了——只要你使用了Flr。

Flr簡介

Flr，讀做Flutter-R，是一個由網易嚴選智造團隊研發的，用於管理Flutter資源的開發工具。

Flr能夠幫助Flutter開發者在修改項目資源後，自動爲資源添加聲明到pubspec.yaml以及生成r.g.dart文件。藉助r.g.dart，Flutter開發者能夠在代碼中經過資源ID函數的方式應用資源，例如：

import 'package:flutter_r_demo/r.g.dart';

// test_sameName.png
var normalImageWidget = Image(
  width: 200,
  height: 120,
  image: R.image.test_sameName(),
);

// test_sameName.gif
var gifImageWidget = Image(
  image: R.mage.test_sameName_gif(),
);

// test.svg
var svgImageWidget = Image(
  width: 100,
  height: 100,
  image: R.svg.test(width: 100, height: 100),
);

// test.json
var jsonString = await R.text.test_json();

// test.yaml
var yamlString = await R.text.test_yaml();

// Amiri Font Style
var amiriTextStyle = TextStyle(fontFamily: R.fontFamily.amiri);
複製代碼

Flr特性

截止到目前，Flr已經支持如下特性：

• 支持「自動添加資源聲明到 pubspec.yaml 和自動生成r.g.dart文件」的自動化服務，該服務能夠經過手動觸發，也能夠經過監控資源變化觸發
• 支持R.x（如 R.image.test()，R.svg.test(width: 100, height: 100)，R.txt.test_json()）的代碼結構
• 支持處理圖片資源（ .png、 .jpg、 .jpeg、.gif、 .webp、.icon、.bmp、.wbmp、.svg ）
• 支持處理文本資源（.txt、.json、.yaml、.xml）
• 支持處理字體資源（.ttf、.otf、.ttc）
• 支持處理圖片資源變體
• 支持處理帶有壞味道的文件名的資源：
  • 文件名帶有非法字符，如空格、~、# 等（非法字符是指不在合法字符集合內的字符；合法字符集合的字符有：0-9、A-Z、 a-z、 _、+、-、.、·、 !、 @、 &、$、￥）
  • 文件名以數字或者_或者$字符開頭
• 支持處理文件名相同但路徑不一樣的資源

Flr工具

爲了更好地知足Flutter開發者的使用需求，咱們提供瞭如下3個版本的Flr工具：

1. Flr Android Studio Plugin 版本

   • GitHub: github.com/Fly-Mix/flr…

   • Plugin Homepage: plugins.jetbrains.com/plugin/1378…

   • flr-as-plugin Usage Example Gif:

2. Flr CLI 版本

   • GitHub: github.com/Fly-Mix/flr…

   • CLI Homepage: rubygems.org/gems/flr

   • flr-cli Usage Example Gif:

     

3. Flr VSCode Extension 版本

   • GitHub: github.com/Fly-Mix/flr…

   • Extension Homepage: marketplace.visualstudio.com/items?itemN…

   • flr-vscode-extension Usage Example:

     

最後，但願該工具能夠幫助各個Flutter開發者提高Flutter的開發效率。使用過程當中有任何疑問，歡迎經過GitHub或者郵件反饋給咱們。