Flutter - flutter_gen 资源管理

2024-04-11 18:12
文章标签 资源管理 flutter gen

本文主要是介绍Flutter - flutter_gen 资源管理,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

请添加图片描述

引言:

在开发 Flutter 应用时,我们经常需要使用各种静态资源,如图片、字体和音频等。如何有效地管理和加载这些资源呢?本篇博客将以图片为例带你解密 Flutter 项目中是如何管理资源地。

assets 加载资源

具体文件名引入

  1. 在工程根目录下创建一个images目录,并将图片 avatar.png 拷贝到该目录。
    在这里插入图片描述
  2. 在pubspec.yaml中的flutter部分添加如下内容:
   assets:- images/avatar.png

注意: 由于 yaml 文件对缩进严格,所以必须严格按照每一层两个空格的方式进行
缩进,此处 assets 前面应有两个空格。
快捷方式: 在pubspec.yaml 中将assets的注释打开,编辑添加avatar.png 资源。
在这里插入图片描述

如果图片很多,每张图片都依次引入,会很繁琐,还会导致这个文件臃肿,怎么办呢?

目录批量引入

通过目录批量引入资源

   flutter:assets:- images/

在这里插入图片描述

使用

Image控件

Image(image: AssetImage("images/avatar.png"),width: 100.0
);

在这里插入图片描述
能够使用本地资源了,但我觉得这种使用方式有点古老,感觉不优雅。那么有没有更优雅的加载资源的方式呢?下面将介绍更优雅的资源管理插件 flutter_gen。

flutter_gen 管理资源

flutter_gen是一个Flutter插件,可以用于自动生成资源文件(如图片、字体等)的Dart类,从而避免在手动编写资源路径时出现错误。使用flutter_gen后,你可以通过代码提示直接访问资源,而不是用字符串指定路径,这样可以在编译期间就检测出资源路径的错误。

下面是如何在Flutter项目中启用和使用flutter_gen的步骤:

1. 添加依赖

首先,你需要在pubspec.yaml文件中添加以下开发依赖:
查看pub.dev以获得最新版本

dev_dependencies:flutter_gen_runner: ^5.4.0 build_runner: ^2.4.9

在这里插入图片描述

2. 安装 flutter_gen

运行以下命令来安装flutter_gen:

flutter pub get

在这里插入图片描述

3. 检查 flutter_gen是否安装成功

在 pubspec.lock搜索flutter_gen_runner和build_runner,如果它们存在于该文件中,那么它们已经被安装在项目中。
在这里插入图片描述

4. 配置flutter_gen

你需要添加flutter_gen的配置块在pubspec.yaml中,这将指定生成代码的位置和哪些资源类型需要生成。例如:

flutter_gen:output: lib/gen/ # Optional (default: lib/gen/)line_length: 80 # Optional (default: 80)# Optionalintegrations:flutter_svg: trueflare_flutter: truerive: truelottie: true

配置中的output指定了生成的Dart代码文件存放的目录。
在这里插入图片描述

5. 运行代码生成

每次你想生成代码时,都可以运行以下命令:

flutter pub run build_runner build

在这里插入图片描述
如果生成的代码有冲突或者如果你想覆盖之前生成的文件,可以使用–delete-conflicting-outputs标志:

flutter pub run build_runner build --delete-conflicting-outputs

生成的文件
在这里插入图片描述

6. 使用生成的代码

在Dart文件中导入自动生成的文件:

import 'gen/assets.gen.dart';

然后,你可以使用生成的资源常量,而无需手动输入资源的路径:

Image.asset(Assets.images.avatar.path,width: 100.0),

总结

推荐使用flutter_gen 管理使用资源,这种方式避免了直接使用字符串路径,有助于减少拼写错误,并且资源的任何更改都将在编译时检测到。


感谢您的阅读和参与,HH思无邪愿与您一起在技术的道路上不断探索。如果您喜欢这篇文章,不妨留下您宝贵的赞!如果您对文章有任何疑问或建议,欢迎在评论区留言,我会第一时间处理,您的支持是我前行的动力,愿我们都能成为更好的自己!

这篇关于Flutter - flutter_gen 资源管理的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/894818

相关文章

Flutter 进阶:绘制加载动画

绘制加载动画:由小圆组成的大圆 1. 定义 LoadingScreen 类2. 实现 _LoadingScreenState 类3. 定义 LoadingPainter 类4. 总结 实现加载动画 我们需要定义两个类:LoadingScreen 和 LoadingPainter。LoadingScreen 负责控制动画的状态,而 LoadingPainter 则负责绘制动画。

Flutter Button使用

Material 组件库中有多种按钮组件如ElevatedButton、TextButton、OutlineButton等,它们的父类是于ButtonStyleButton。         基本的按钮特点:         1.按下时都会有“水波文动画”。         2.onPressed属性设置点击回调,如果不提供该回调则按钮会处于禁用状态,禁用状态不响应用户点击。

【Python知识宝库】上下文管理器与with语句:资源管理的优雅方式

🎬 鸽芷咕:个人主页  🔥 个人专栏: 《C++干货基地》《粉丝福利》 ⛺️生活的理想,就是为了理想的生活! 文章目录 前言一、什么是上下文管理器?二、上下文管理器的实现三、使用内置上下文管理器四、使用`contextlib`模块五、总结 前言 在Python编程中,资源管理是一个重要的主题,尤其是在处理文件、网络连接和数据库

flutter开发实战-flutter build web微信无法识别二维码及小程序码问题

flutter开发实战-flutter build web微信无法识别二维码及小程序码问题 GitHub Pages是一个直接从GitHub存储库托管的静态站点服务,‌它允许用户通过简单的配置,‌将个人的代码项目转化为一个可以在线访问的网站。‌这里使用flutter build web来构建web发布到GitHub Pages。 最近通过flutter build web,通过发布到GitHu

理解C++全局对象析构顺序与 IPC 资源管理:避免 coredump

文章目录 0. 概述1. 问题背景2. 问题分析3. 解决方案:手动释放资源4. 深入剖析:为什么手动调用 `reset()` 有效?5. 延伸思考:如何避免全局对象带来的问题?6. 总结 0. 概述 在编写 C++ 程序时,使用全局或静态对象有时可能会导致不可预期的崩溃(如 coredump)。这类崩溃通常源于对象的析构顺序、资源的管理方式,以及底层资源(如 IPC 通道或共

Flutter 中的低功耗蓝牙概述

随着智能设备数量的增加,控制这些设备的需求也在增加。对于多种使用情况,期望设备在需要进行控制的同时连接到互联网会受到很大限制,因此是不可行的。在这些情况下,使用低功耗蓝牙(也称为 Bluetooth LE 或 BLE)似乎是最佳选择,因为它功耗低,在我们的手机中无处不在,而且无需连接到更广泛的网络。因此,蓝牙应用程序的需求也在不断增长。 通过阅读本文,您将了解如何开始在 Flutter 中开

业务资源管理模式语言09

示例: 图13 表示了QuoteTheMaintenance 模式的一个实例,在汽车修理店系统中,其中“Vehicle”扮演“Resource”,“Repair Quotation”扮演“Maintenance Quotation”,“Repair shop branch”扮演“Source-party”,“Customer”扮演“Destiny-Party”。 图13——QuoteThe

Winsock服务器内存资源管理

一般来讲, 在服务器上,如果有足够的资源,Winsock server,理论上可以支持成千的并发连接。而现实是,我们没有足够的资源可供使用,分配。本文主要来讨论一下内存资源之于Winsock server开发的重要性。 一)基本概念。 -> Pages,Locked Pages.         在现代操作系统中,内存管理会把主存(RAM)分成Pages来管理。 Paging(或者swap

flutter开发多端平台应用的探索 下 (跨模块、跨语言通信之平台通道)

前文 Flutter 是一个跨平台的开发框架,它允许开发者使用相同的代码库来构建 iOS、Android、Web 和桌面应用程序。 上文flutter开发多端平台应用的探索 上(基本操作)-CSDN博客列举了一些特定平台的case(桌面端菜单,鼠标快捷键)的使用方法,有些是flutter提供了对应能力,只需要学习如何调API,有些事三方库支持,本文要探讨的平台通道是更为强大的工具,很多三方插件