如何用自定义的Flutter包避免项目失败

155 阅读6分钟

领导一个成功的Flutter应用程序开发项目往往来自于应用程序架构的强大组织。 使用Flutter包是将您的应用程序文件和功能部分分组为可重复使用的组件的绝佳方式,使团队协作更容易。本教程将带您完成为您的下一个Flutter项目创建一个自定义包所需的所有步骤。

还提供了一个完整的分步视频和完整的代码

概述

在解释如何创建自定义包之前,让我们回顾一下为什么Flutter开发人员需要使用包以及如何使用自定义包。 包的目标是隔离可重用的功能,并使其易于被您的应用程序的其他部分访问。一个应用程序可以有多个自定义包。

例如,我们可以创建一个自定义包来处理不同按钮的HTTP网络API连接,将结果显示在不同的屏幕上。 组织代码的一个好方法是将所有的连接功能隔离到一个新的目录中,称为,connection 。这个连接目录成为连接包。你也可以为动画创建另一个包,并在该包中组织你的自定义动画。 你创建的每个包都被放入一个名为packages 的公共目录。

一旦代码被隔离在一个包中,你就可以在你的主项目pubspec.yaml 应用程序配置文件中让你的应用程序访问这个包。pubspec.yaml 文件的语法略有不同,这取决于你如何分发你的包。

一旦使用pubspec.yaml 使包对应用程序可用,每个使用该包的文件都使用语法导入该包。import 'package:name/file.dart`;

让我们用例子来说明这个过程,从pubspec.yaml 的配置开始。

3种包的依赖性配置格式

有三种策略用于构建和发布您的自定义Flutter包。

  1. 发布到pub.dev。
  2. 发布到GitHub或相当于独立的仓库。
  3. 将包存储在您的主项目库中。

1.pub.dev

如果你把包发布到pub.dev,你可以从pubspec.yaml ,在依赖项下访问它。由于我的库不在pub.dev上,我将展示与HTTP包的语法。

2.远程 Git 服务器

在大多数情况下,你不需要让你的包被很多人访问。 在这种情况下,你可以用下面的语法从网络上访问该库。

在上面的例子中,包的名字是theta 。该包在GitHub的main 分支下可用。

3.你的项目的包文件夹

你也可以将包存储在你的主应用项目文件夹中。如果包的名字是theta ,那么将其存储在主项目目录下packages/theta

如果包存储在本地,pubspec.yaml 语法如下。

使用一个自定义包

在这三种方法中,你都要把你的自定义包导入到你的应用程序中来使用它。

应用程序代码

自定义包代码

为了说明哪些部分的代码来自于包,我将包括一个简短的库片段。

在上面的例子中,Camera.info 部分是位于包中的一个静态getter,地址是theta/lib/src/protocols.dart

一旦创建了包,就很容易访问包中的所有类和方法。

关于发布策略的建议

你应该先把你的包放在你的应用仓库packages 目录内,最初只为你的一个应用使用该包。一旦应用和包稳定了,你就可以在GitHub上发布它,让你的团队或组织的其他成员直接从他们的pubspec.yaml 文件中使用。

在你让其他组的人可以使用该包,并且他们开始使用它之后,你就需要花更多的时间来进行包的版本管理。

创建一个包

创建一个新项目,我把我的项目称为theta_api_intro_tutorial

在主项目的顶层目录下创建一个文件夹,名为packages。

Packages in Top-Level Directory

进入该目录并创建一个新的包。在这个例子中,我的包被称为,theta_connection

flutter create --template=package theta_connection

当你用flutter create 创建一个包时,它将自动创建另一组libpubspec.yaml 、和README.md 文件。

在新创建的lib 目录下,有一个主要的theta_connection.dart 文件,它的功能是作为你包中其他文件的中心连接点。

删除theta_connection.darttest/theta_connection.dart两个文件中的示例代码。

library theta_connection

第一部分

创建一个新的文件来存放你的新包的第一个方法。 我把我的文件称为protocols/test_hello.dart

这个文件的关键学习点是学习如何将part of '../theta_connection.dart' 包括在文件的顶部。这是从你的包中的每个文件到主包文件的连接点,以后将允许你的应用程序访问这个方法。

test_hello.dart

第二部分

除了将带有该方法的文件连接到theta_connection.dart ,你还需要从theta_connection.dart 添加一个连接到protocols/test_hello.dart

part 'protocols/test_hello.dart'

恭喜你,你刚刚创建了一个自定义包!

回顾一下步骤

  1. 创建一个名称为flutter create --template=package 的包。
  2. 为你的包的功能创建一个新的文件,并将其与主包文件链接到part of
  3. 在主包文件中,用part 链接到新文件。

使用你的新包

在你的主项目目录下的pubspec.yaml 文件中,添加你的新包的路径。

path:packages/theta_connection

main.dart 中导入包,并通过调用方法hello() 来使用它。

hello() Method

当你按下按钮时,你应该在控制台看到 "Hello, world"。
Hello World in Console

扩展你的包

使用这种技术,你可以在每个新目录中添加额外的目录和文件。 你也可以为不同类型的功能创建不同的包。

随着你的应用程序的增长,你将需要管理你的应用程序的状态。 我以前的文章,Flutter 2.0状态管理介绍与提供者5.0,解释了如何用提供者管理你的Flutter应用程序的状态。

总结

对您的应用程序架构进行强有力的组织是项目成功的关键。 如果不能对功能和状态等基本领域进行管理,会导致项目的延误,在某些情况下会导致项目的未完成。 有效使用标准的 Flutter 包系统是组织您的应用程序架构的一个伟大工具。为了保持开发的简单性,把你的包放在你的主应用仓库里面,以减少你的包的版本管理的复杂性。 通过减少包的版本管理的复杂性,你增加了你和你的团队使用包的机会,使每个人都能成功地启动项目。