flutter中的包管理与资源管理

2.0 包管理与资源管理

2.0.1 包管理

在软件开发中,不少时候有一些公共的库或SDK可能会被不少项目用到,所以,将这些代码单独抽到一个独立模块,而后哪一个项目须要使用时再直接集成这个模块,即可大大提升开发效率。不少编程语言或开发工具都支持这种“模块共享”机制,如Java语言中这种独立模块会被打成一个jar包,Android中的aar包,Web开发中的npm包等。为了方便表述,咱们将这种可共享的独立模块统一称为“包”( Package)。html

一个APP在实际开发中每每会依赖不少包,而这些包一般都有交叉依赖关系、版本依赖等,若是由开发者手动来管理应用中的依赖包将会很是麻烦。所以,各类开发生态或编程语言官方一般都会提供一些包管理工具,好比在Android提供了Gradle来管理依赖,iOS用Cocoapods或Carthage来管理依赖,Node中经过npm等。而在Flutter开发中也有本身的包管理工具。本节咱们主要介绍一下flutter如何使用配置文件pubspec.yaml(位于项目根目录)来管理第三方依赖包。node

YAML是一种直观、可读性高而且容易被人类阅读的文件格式,它和xml或Json相比,它语法简单并不是常容易解析,因此YAML经常使用于配置文件,Flutter也是用yaml文件做为其配置文件。Flutter项目默认的配置文件是pubspec.yaml,咱们看一个简单的示例:android

name: flutter_in_actiondescription: First Flutter application.
version: 1.0.0+1
dependencies: flutter: sdk: flutter cupertino_icons: ^0.1.2
dev_dependencies: flutter_test: sdk: flutter
flutter: uses-material-design: true

下面,咱们逐一解释一下各个字段的意义:git

name:应用或包名称。description: 应用或包的描述、简介。version:应用或包的版本号。dependencies:应用或包依赖的其它包或插件。dev_dependencies:开发环境依赖的工具包(而不是flutter应用自己依赖的包)。flutter:flutter相关的配置选项。github

若是咱们的Flutter应用自己依赖某个包,咱们须要将所依赖的包添加到dependencies 下,接下来咱们经过一个例子来演示一下如何添加、下载并使用第三方包。shell

Pub仓库

Pub(https://pub.dev/ )是Google官方的Dart Packages仓库,相似于node中的npm仓库,android中的jcenter。咱们能够在Pub上面查找咱们须要的包和插件,也能够向Pub发布咱们的包和插件。咱们将在后面的章节中介绍如何向Pub发布咱们的包和插件。npm

示例

接下来,咱们实现一个显示随机字符串的widget。有一个名为“english_words”的开源软件包,其中包含数千个经常使用的英文单词以及一些实用功能。咱们首先在pub上找到english_words这个包(如图2-5所示),肯定其最新的版本号和是否支持Flutter。编程

咱们看到“english_words”包最新的版本是3.1.3,而且支持flutter,接下来:json

1.微信

将“english_words”(3.1.3版本)添加到依赖项列表,以下:

dependencies: flutter: sdk: flutter
cupertino_icons: ^0.1.0 # 新添加的依赖 english_words: ^3.1.3

2.

下载包。在Android Studio的编辑器视图中查看pubspec.yaml时(图2-6),单击右上角的 Packages get 。

这会将依赖包安装到您的项目。咱们能够在控制台中看到如下内容:

flutter packages getRunning "flutter packages get" in flutter_in_action...Process finished with exit code 0

咱们也能够在控制台,定位到当前工程目录,而后手动运行flutter packages get 命令来下载依赖包。另外,须要注意dependenciesdev_dependencies的区别,前者的依赖包将做为APP的源码的一部分参与编译,生成最终的安装包。然后者的依赖包只是做为开发阶段的一些工具包,主要是用于帮助咱们提升开发、测试效率,好比flutter的自动化测试包等。

3.

引入english_words包。

import 'package:english_words/english_words.dart';

在输入时,Android Studio会自动提供有关库导入的建议选项。导入后该行代码将会显示为灰色,表示导入的库还没有使用。

4.

使用english_words包来生成随机字符串。

class RandomWordsWidget extends StatelessWidget { @override Widget build(BuildContext context) { // 生成随机字符串 final wordPair = new WordPair.random(); return Padding( padding: const EdgeInsets.all(8.0), child: new Text(wordPair.toString()), ); }}

咱们将RandomWordsWidget 添加到 _MyHomePageState.build 的Column的子widget中。

Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ ... //省略无关代码 RandomWordsWidget(), ],)
5.

若是应用程序正在运行,请使用热重载按钮(⚡️图标) 更新正在运行的应用程序。每次单击热重载或保存项目时,都会在正在运行的应用程序中随机选择不一样的单词对。这是由于单词对是在 build 方法内部生成的。每次热更新时,build方法都会被执行,运行效果如图2-7所示。




其它依赖方式

上文所述的依赖方式是依赖Pub仓库的。但咱们还能够依赖本地包和git仓库。

依赖本地包

若是咱们正在本地开发一个包,包名为pkg1,咱们能够经过下面方式依赖:

dependencies: pkg1: path: ../../code/pkg1

路径能够是相对的,也能够是绝对的。

依赖Git:你也能够依赖存储在Git仓库中的包。若是软件包位于仓库的根目录中,请使用如下语法

dependencies: pkg1: git: url: git://github.com/xxx/pkg1.git

上面假定包位于Git存储库的根目录中。若是不是这种状况,可使用path参数指定相对位置,例如:

dependencies: package1: git: url: git://github.com/flutter/packages.git path: packages/package1



上面介绍的这些依赖方式是Flutter开发中经常使用的,但还有一些其它依赖方式,完整的内容读者能够自行查看:https://www.dartlang.org/tools/pub/dependencies 。

2.4 资源管理

Flutter APP安装包中会包含代码和 assets(资源)两部分。Assets是会打包到程序安装包中的,可在运行时访问。常见类型的assets包括静态数据(例如JSON文件)、配置文件、图标和图片(JPEG,WebP,GIF,动画WebP / GIF,PNG,BMP和WBMP)等。

指定 assets

和包管理同样,Flutter也使用pubspec.yaml(https://www.dartlang.org/tools/pub/pubspec)文件来管理应用程序所需的资源,举个例子:

flutter: assets: - assets/my_icon.png - assets/background.png

assets指定应包含在应用程序中的文件, 每一个asset都经过相对于pubspec.yaml文件所在的文件系统路径来标识自身的路径。asset的声明顺序是可有可无的,asset的实际目录能够是任意文件夹(在本示例中是assets文件夹)。

在构建期间,Flutter将asset放置到称为 asset bundle 的特殊存档中,应用程序能够在运行时读取它们(但不能修改)。

Asset 变体(variant)

构建过程支持“asset变体”的概念:不一样版本的asset可能会显示在不一样的上下文中。在pubspec.yaml的assets部分中指定asset路径时,构建过程当中,会在相邻子目录中查找具备相同名称的任何文件。这些文件随后会与指定的asset一块儿被包含在asset bundle中。

例如,若是应用程序目录中有如下文件:

…/pubspec.yaml…/graphics/my_icon.png…/graphics/background.png…/graphics/dark/background.png…etc.

而后pubspec.yaml文件中只需包含:

flutter: assets: - graphics/background.png

那么这两个graphics/background.pnggraphics/dark/background.png 都将包含在您的asset bundle中。前者被认为是main asset (主资源),后者被认为是一种变体(variant)。

在选择匹配当前设备分辨率的图片时,Flutter会使用到asset变体(见下文),未来,Flutter可能会将这种机制扩展到本地化、阅读提示等方面。

加载 assets

您的应用能够经过AssetBundle(https://docs.flutter.io/flutter/services/AssetBundle-class.html)对象访问其asset 。有两种主要方法容许从Asset bundle中加载字符串或图片(二进制)文件。

加载文本assets

经过rootBundle(https://docs.flutter.io/flutter/services/rootBundle.html)对象, 经过它能够轻松访问主资源包,直接使用package:flutter/services.dart中全局静态的rootBundle对象来加载asset便可。经过 DefaultAssetBundle(https://docs.flutter.io/flutter/widgets/DefaultAssetBundle-class.html) 来获取当前BuildContext的AssetBundle。这种方法不是使用应用程序构建的默认asset bundle,而是使父级widget在运行时动态替换的不一样的AssetBundle,这对于本地化或测试场景颇有用。

一般,可使用DefaultAssetBundle.of()在应用运行时来间接加载asset(例如JSON文件),而在widget上下文以外,或其它AssetBundle句柄不可用时,可使用rootBundle直接加载这些asset,例如:

import 'dart:async' show Future;import 'package:flutter/services.dart' show rootBundle;
Future<String> loadAsset() async { return await rootBundle.loadString('assets/config.json');}

加载图片

相似于原生开发,Flutter也能够为当前设备加载适合其分辨率的图像。

声明分辨率相关的图片 assets

AssetImage(https://docs.flutter.io/flutter/painting/AssetImage-class.html) 能够将asset的请求逻辑映射到最接近当前设备像素比例(dpi)的asset。为了使这种映射起做用,必须根据特定的目录结构来保存asset:

…/image.png…/Mx/image.png…/Nx/image.png…etc.

其中M和N是数字标识符,对应于其中包含的图像的分辨率,也就是说,它们指定不一样设备像素比例的图片。

主资源默认对应于1.0倍的分辨率图片。看一个例子:

…/my_icon.png…/2.0x/my_icon.png…/3.0x/my_icon.png

在设备像素比率为1.8的设备上,.../2.0x/my_icon.png 将被选择。对于2.7的设备像素比率,.../3.0x/my_icon.png将被选择。

若是未在Image widget上指定渲染图像的宽度和高度,那么Image widget将占用与主资源相同的屏幕空间大小。也就是说,若是.../my_icon.png是72px乘72px,那么.../3.0x/my_icon.png应该是216px乘216px; 但若是未指定宽度和高度,它们都将渲染为72像素×72像素(以逻辑像素为单位)。

pubspec.yaml中asset部分中的每一项都应与实际文件相对应,但主资源项除外。当主资源缺乏某个资源时,会按分辨率从低到高的顺序去选择 ,也就是说1x中没有的话会在2x中找,2x中尚未的话就在3x中找。

加载图片

要加载图片,可使用AssetImage类。例如,咱们能够从上面的asset声明中加载背景图片:

Widget build(BuildContext context) { return new DecoratedBox( decoration: new BoxDecoration( image: new DecorationImage( image: new AssetImage('graphics/background.png'), ), ), );}

注意,AssetImage 并不是是一个widget, 它其实是一个ImageProvider,有些时候你可能指望直接获得一个显示图片的widget,那么你可使用Image.asset()方法,如:

Widget build(BuildContext context) { return Image.asset('graphics/background.png');}

使用默认的 asset bundle 加载资源时,内部会自动处理分辨率等,这些处理对开发者来讲是无感知的。(若是使用一些更低级别的类,如  ImageStream或 ImageCache 时你会注意到有与缩放相关的参数)

依赖包中的资源图片

要加载依赖包中的图像,必须给AssetImage提供package参数。

例如,假设您的应用程序依赖于一个名为“my_icons”的包,它具备以下目录结构:

…/pubspec.yaml…/icons/heart.png…/icons/1.5x/heart.png…/icons/2.0x/heart.png…etc.

而后加载图像,使用:

 new AssetImage('icons/heart.png', package: 'my_icons')

new Image.asset('icons/heart.png', package: 'my_icons')

注意:包在使用自己的资源时也应该加上package参数来获取

打包包中的 assets

若是在pubspec.yaml文件中声明了指望的资源,它将会打包到相应的package中。特别是,包自己使用的资源必须在pubspec.yaml中指定。

包也能够选择在其lib/文件夹中包含未在其pubspec.yaml文件中声明的资源。在这种状况下,对于要打包的图片,应用程序必须在pubspec.yaml中指定包含哪些图像。例如,一个名为“fancy_backgrounds”的包,可能包含如下文件:

…/lib/backgrounds/background1.png…/lib/backgrounds/background2.png…/lib/backgrounds/background3.png

要包含第一张图像,必须在pubspec.yaml的assets部分中声明它:

flutter: assets: - packages/fancy_backgrounds/backgrounds/background1.png

lib/是隐含的,因此它不该该包含在资产路径中。


本文分享自微信公众号 - flutter开发精选(Study_Knowledge)。
若有侵权,请联系 support@oschina.cn 删除。
本文参与“OSC源创计划”,欢迎正在阅读的你也加入,一块儿分享。

相关文章
相关标签/搜索