Flutter 中的依赖管理

移动的小太阳
1,934 阅读5分钟

Flutter 中的依赖管理

在APP的开发中，我们知道一个应用程序主要由两部分内容组成：代码和资源。代码关注逻辑功能，而如图片、字符串、字体、配置文件等资源则关注视觉功能。之前更多的是学习了代码相关的，今天就一起来学习Flutter 整体的资源管理机制。

现在的UI框架中，大多数使用：资源外部化，即把代码与资源分离。如：在Android 中，资源文件都是放在 res 目录下，drawable 放置图片、value 里面则是放置一些 用到的string、color、theme等。在 Flutter 中并没有指定资源放置在哪里，只需要最后在 pubspace.ymal 文件中声明即可。

pubspace.ymal

  assets:
    - assets/ic_campaign_charity.png #指定到具体文件
    - assets/icon/ic_campaign_diamond.png #指定到具体文件
    - assets/image/ #指定文件夹
    - assets/result.json #指定到具体文件

Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Text("data"),
          Image.asset("assets/ic_campaign_charity.png",width: 100,height: 100,),
          Image.asset("assets/icon/ic_campaign_diamond.png"),
          Image.asset("assets/image/ic_ranking_medal_1.png"),
          Image.asset("assets/image/ic_ranking_medal_2.png"),
          Image.asset("assets/image/ic_ranking_medal_3.png"),
          MaterialButton(child: Text("加载json文件"),onPressed: (){
            //加载
            rootBundle.loadString('assets/result.json').then((msg)=>print(msg));
          })
        ],
      ),
    );
  }

对于字符串文件资源，我们使用 loadString 方法；而对于二进制文件资源，则通过 load 方法。

根据像素密度加载图标

在开发中，为了给不同像素密度手机加载到合适的图标，通常会把不同的图标放在不同的文件夹下，flutter 是如何处理的呢？

与Android、iOS 开发类似，Flutter 也遵循了基于像素密度的管理方式，如 1.0x、2.0x、3.0x 或其他任意倍数，Flutter 可以根据当前设备分辨率加载最接近设备像素比例的图片资源。而为了让 Flutter 更好地识别，我们的资源目录应该将 1.0x、2.0x 与 3.0x 的图片资源分开管理。

在目录下创建 2.0x 和3.0x 目录，把对应的icon 放到里面；然后在 pubspace.ymal 里面进行声明

  assets:
    - assets/ic_campaign_charity.png #指定到具体文件
    - assets/icon/ic_campaign_diamond.png #指定到具体文件
    - assets/image/ #指定文件夹
    - assets/result.json #指定到具体文件
    - assets/icon/
    - assets/icon/2.0x/
    - assets/icon/3.0x/

image.png

可以看到我并没有放置 1.0 的icon，但是运行还是没问题了，这就给我们提示，并不是要放置所有像素密度的icon，当没有放置的时候，系统会自动去查找到和当前像素密度最相近的icon进行加载，如 放置了1.0x和2.0x的icon，但当前手机的像素密度是3，那系统就会先从3.x里面找，没有找到再到2.0x里面找，找到了直接加载显示。

字体资源的管理

字体则是另外一类较为常用的资源。手机操作系统一般只有默认的几种字体，在大部分情况下可以满足我们的正常需求。但是，在一些特殊的情况下，我们可能需要使用自定义字体来提升视觉体验。

在 pubspace.ymal 中声明


fonts:
  - family: RobotoCondensed  #字体名字
    fonts:
      - asset: assets/fonts/RobotoCondensed-Regular.ttf #普通字体
      - asset: assets/fonts/RobotoCondensed-Italic.ttf 
        style: italic  #斜体
      - asset: assets/fonts/RobotoCondensed-Bold.ttf 
        weight: 700  #粗体

然后再 Text 中使用


Text("这是 普通字体", style: TextStyle(
    fontFamily: 'RobotoCondensed',//普通字体
));
Text("这是 粗体", style: TextStyle(
    fontFamily: 'RobotoCondensed',
    fontWeight: FontWeight.w700, //粗体
));
Text("这是 斜体", style: TextStyle(
  fontFamily: 'RobotoCondensed',
  fontStyle: FontStyle.italic, //斜体
));

原生平台的资源设置

Flutter 应用，实际上最终会以原生工程的方式打包运行在 Android 和 iOS 平台上，因此 Flutter 启动时依赖的是原生 Android 和 iOS 的运行环境。

所以上面提到的资源的管理是 Flutter 启动之后才可以的，但一些要在启动Flutter之前管理的资源就需要在原生去配置了，如APP的启动图标。

Android 中的启动图标： 在 mipmap 目录下，如果更换择要在里面更换；

iOS的启动图标：启动图位于根目录 ios/Runner/Assets.xcassets/AppIcon.appiconset 下。同样地，我们只需要遵守对应的像素密度标准，将其替换为目标资源并保留原始图标名称即可。

第三方库在Flutter中的管理

pubspace.ymal 里面不仅仅可以管理资源文件，更为重要的作用是管理 Flutter 工程代码的依赖，比如第三方库、Dart 运行环境、Flutter SDK 版本都可以通过它来进行统一管理。

首先来看看pub是什么？

Dart 提供了包管理工具 Pub，用来管理代码和资源。与 Android 中的 JCenter/Maven、iOS 中的 CocoaPods、前端中的 npm 库类似，Dart 提供了官方的包仓库 Pub。通过 Pub，我们可以很方便地查找到有用的第三方包。pub官网

可以看看 pubspace.yaml

name: flutter_base_app #应用名称
description: A new Flutter application. #应用描述
publish_to: 'none' # Remove this line if you wish to publish to pub.dev
version: 1.0.0+1 #应用的版本
#Dart运行环境区间，可以指定一个版本区间，也可以指定特定版本，在正式开发中一般都明确指定版本
environment:
  sdk: ">=2.7.0 <3.0.0"
#Flutter依赖库
dependencies:
  flutter:
    sdk: flutter
  cupertino_icons: ^1.0.0 #依赖第三方库，name: vesion

dev_dependencies:
  flutter_test:
    sdk: flutter
flutter:
  uses-material-design: true
  
# 资源管理依赖
  assets:
    - assets/ic_campaign_charity.png #指定到具体文件
    - assets/icon/ic_campaign_diamond.png #指定到具体文件
    - assets/image/ #指定文件夹
    - assets/result.json #指定到具体文件
    - assets/icon/
    - assets/icon/2.0x/
    - assets/icon/3.0x/

当我们依赖的 第三方库，不对外公开发布，或者目前处于开发调试阶段的包，我们需要设置数据源，使用本地路径或 Git 地址的方式进行包声明。


dependencies:
  package1:
    path: ../package1/  #路径依赖
  date_format:
    git:
      url: https://github.com/xxx/package2.git #git依赖

然后，在完成了所有依赖包的下载后，Pub 会在应用的根目录下创建.packages 文件，将依赖的包名与系统缓存中的包文件路径进行映射，方便后续维护。

最后，Pub 会自动创建 pubspec.lock 文件。pubspec.lock 文件的作用类似 iOS 的 Podfile.lock 或前端的 package-lock.json 文件，用于记录当前状态下实际安装的各个直接依赖、间接依赖的包的具体来源和版本号。

总结

通过学习Flutter 对资源和第三方库的管理，了解了 Flutter 是 通过在pubSspace.ymal 文件中声明资源文件的路径，通过在 dependencies节点下 通过 name:version 的形式，添加第三方库，这些库使用 官方的包仓库 Pub进行管理。

avatar
文章
阅读
粉丝