flutter之资源（assets）

2023年6月11日 267次阅读 来源: 箭雨

资源是指静态数据（如JSON文件）、配置文件、图标、图像。

flutter项目的资源是配置在项目根目录下的pubspec.yaml 文件中的，示例如下：

flutter:
  assets:
    - graphics/background.png //指定主资源的路径

项目在构建（bulid）app的时候，会根据assets中指定的主资源路径，在pubspec.yaml的同级目录下查找同名的background.png所有文件，并把所有同名的background.png文件放进一个专门的资源包（asset bundle），以便app在运行时从这个资源包中加载资源。

主资源的概念示例：

.../pubspec.yaml
  .../graphics/my_icon.png
  .../graphics/background.png //这是pubspec.yaml中的assets指定的主资源   .../graphics/dark/background.png //这个就是同名资源的变体

说明：在pubspec.yaml中的指定的是主资源的路径。

我们的app可以使用逻辑键通过AssetBundle对象来访问该对象的资源，可以使用该对象的loadString来加载该对象中的字符串或文本资源，可以使用load来加载该对象中的图像或二进制资源。

逻辑键映射到pubspec.yaml文件中指定的资源路径。

rootBundle属于AssetBundle类型的对象，它包含了应用在构建时所打包的资源。每个Flutter app都有一个全局rootBundle对象用于容易地访问资源包。

但我们推荐使用DefaultAssetBundle 来为当前的部件得到AssetBundle对象，DefaultAssetBundle为它的子孙确定的默认的资源包。示例如下：

MaterialApp(
     home: DefaultAssetBundle(
       bundle: TestAssetBundle()//为子部件指定默认的资源包 ,      child:  TestWidget()，//子部件      ),

DefaultAssetBundle.of 用来获得类的最近实例的资源包对象。of方法定义如下：

AssetBundle of(
        BuildContext  context 
)

如果在context句柄指向树中的位置处没有祖先DefaultAssetBundle，那么of方法返回rootBundle 。

在一个部件的外部，或一个AssetBundle的句柄无效时，可以使用rootBundle来直接加载资源，示例如下：

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

flutter会为当前像素率的设备加载合适分辨率的图像。图像文件的目录结构如下：

.../my_icon.png //主资源的对应于1.0px像素率的设备，所以没有显式标识1.0x .../2.0x/my_icon.png //对应于2.0px像素率的设备 .../3.0x/my_icon.png

当一个设备的像素率为1.8时，由于2.0x的资源最匹配，所以flutter会选择…/2.0x/my_icon.png。正因此原因，2.0x、3.0x此类被你为名义上的分辨率（nominal resolution）

如果Image部件没有指定要渲染的图像的宽、高，那么名义上的分辨率的资源将被缩放以占据与主资源相同的屏幕空间。也就是说，如果.../my_icon.png的尺寸是72px*72px，那么.../3.0x/my_icon.png的尺寸应该是216px*216px，但是如果Image部件没有指定要渲染的图像的宽、高的话，那么主资源和及变体都会被渲染为72px*72px。

在部件的build方法中使用AssetImage加载图像的示例：

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

使用依赖包中的图像资源示例：

依赖包my_icons的结构

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

加载图像资源要提供包参数：

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

对包的资源打包：

包的pubspec.yaml中指定的资源会和应用一起自动被打包。包自身要使用的资源必须在pubspec.yaml中指定。

对于包中那些没有在pubspec.yaml中指定且存放在 lib/文件夹下的资源，如果要打包的话，必须在应用的pubspec.yaml中指定。示例：如果一个名为fancy_backgrounds的包有下列资源文件：

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

如果要将background1.png一起打包，那么需要在应用 的pubspec.yaml如下指定：

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

更多请参见官方文档。

    原文作者：箭雨
    原文地址: https://zhuanlan.zhihu.com/p/53364230
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞