跳到主内容

使用包

如何在你的 Flutter 应用中使用包。

Flutter 支持使用其他开发者贡献给 Flutter 和 Dart 生态系统的共享包。这使得构建应用变得快速,而无需从头开始开发所有内容。

现有的包支持许多用例——例如,发出网络请求(http)、导航/路由处理(go_router)、与设备 API 集成(url_launcherbattery_plus)以及使用 Firebase 等第三方平台 SDK(FlutterFire)。

要编写新包,请参阅 开发包。 要添加资源、图像或字体,无论存储在文件中还是包中,请参阅 添加资源和图像

使用包

#

以下部分描述了如何使用现有的已发布包。

搜索包

#

包发布到 pub.dev

pub.dev 上的 Flutter 登录页面 显示与 Flutter 兼容的顶级包(那些声明通常与 Flutter 兼容的依赖项的包),并支持在所有已发布包中进行搜索。

pub.dev 上的 Flutter Favorites 页面列出了在编写应用时应首先考虑使用的插件和包。 有关成为 Flutter Favorite 的含义的更多信息,请参阅 Flutter Favorites 程序

你还可以通过过滤 AndroidiOSWebLinuxWindowsmacOS 或上述任何组合来浏览 pub.dev 上的包。

使用 flutter pub add 命令向应用添加包依赖项

#

要将包 css_colors 添加到应用

  1. 从项目目录中使用 pub add 命令

    • flutter pub add css_colors
  2. 导入它

    • 在 Dart 代码中添加相应的 import 语句。
  3. 如果需要,停止并重新启动应用

    • 如果该包带来了特定于平台的代码(Android 的 Kotlin/Java,iOS 的 Swift/Objective-C),则必须将该代码构建到你的应用中。 热重载和热重启仅更新 Dart 代码,因此可能需要完全重启应用才能避免在使用该包时出现 MissingPluginException 之类的错误。

向应用添加包依赖项

#

要将包 css_colors 添加到应用

  1. 依赖它

    • 打开位于应用文件夹内的 pubspec.yaml 文件,并在 dependencies 下添加 css_colors: ^1.0.0
  2. 安装它

    • 从终端:运行 flutter pub get
      或者
    • 从 VS Code:单击位于 pubspec.yaml 顶部操作功能区右侧的 获取包,该功能区由下载图标指示。
    • 从 Android Studio/IntelliJ:单击 pubspec.yaml 顶部操作功能区中的 Pub get
  3. 导入它

    • 在 Dart 代码中添加相应的 import 语句。
  4. 如果需要,停止并重新启动应用

    • 如果该包带来了特定于平台的代码(Android 的 Kotlin/Java,iOS 的 Swift/Objective-C),则必须将该代码构建到你的应用中。 热重载和热重启仅更新 Dart 代码,因此可能需要完全重启应用才能避免在使用该包时出现 MissingPluginException 之类的错误。

使用 flutter pub remove 命令从应用中移除包依赖项

#

要从应用中移除包 css_colors

  1. 从项目目录中使用 pub remove 命令
    • flutter pub remove css_colors

pub.dev 上任何包页面的 安装选项卡 是这些步骤的便捷参考。

有关完整示例,请参阅下面的 css_colors 示例

冲突解决

#

假设你想在应用中使用 some_packageanother_package,并且这两个包都依赖于 url_launcher,但版本不同。 这会导致潜在的冲突。 避免此问题最好的方法是包作者在指定依赖项时使用 版本范围 而不是特定版本。

yaml
dependencies:
  url_launcher: ^5.4.0    # Good, any version >= 5.4.0 but < 6.0.0
  image_picker: '5.4.3'   # Not so good, only version 5.4.3 works.

如果 some_package 声明了上述依赖项,而 another_package 声明了兼容的 url_launcher 依赖项,例如 '5.4.6'^5.5.0,则 pub 会自动解决问题。 对 Gradle 模块 和/或 CocoaPods 的特定于平台的依赖项以类似的方式解决。

即使 some_packageanother_package 声明了 url_launcher 的不兼容版本,它们实际上可能以兼容的方式使用 url_launcher。 在这种情况下,可以通过将依赖项覆盖声明添加到应用的 pubspec.yaml 文件,强制使用特定版本来解决冲突。

例如,要强制使用 url_launcher 版本 5.4.0,请对应用的 pubspec.yaml 文件进行以下更改

yaml
dependencies:
  some_package:
  another_package:
dependency_overrides:
  url_launcher: '5.4.0'

如果冲突的依赖项本身不是包,而是 Android 特定的库,例如 guava,则必须将依赖项覆盖声明添加到 Gradle 构建逻辑中。

要强制使用 guava 版本 28.0,请对应用的 android/build.gradle 文件进行以下更改

android/app/build.gradle.kts
kotlin
configurations.all {
    resolutionStrategy {
        force("com.google.guava:guava:28.0-android")
    }
}
android/app/build.gradle
groovy
configurations.all {
    resolutionStrategy {
        force 'com.google.guava:guava:28.0-android'
    }
}

CocoaPods 目前不提供依赖项覆盖功能。

开发新包

#

如果不存在针对你的特定用例的包,你可以 编写自定义包

管理包依赖项和版本

#

为了最大限度地降低版本冲突的风险,请在 pubspec.yaml 文件中指定版本范围。

包版本

#

所有包都有一个版本号,在包的 pubspec.yaml 文件中指定。 包的当前版本显示在其名称旁边(例如,请参阅 url_launcher 包),以及所有先前版本的列表(请参阅 url_launcher 版本)。

为了确保应用在更新包时不会中断,请使用以下格式之一指定版本范围。

  • 范围约束: 指定最小版本和最大版本。

    yaml
    dependencies:
      url_launcher: '>=5.4.0 <6.0.0'
    
  • 使用 插入符号语法 的范围约束: 指定作为包含的最小版本的版本。 这涵盖了从该版本到下一个主要版本的所有版本。

    yaml
    dependencies:
      collection: '^5.4.0'
    

    此语法与第一个要点中的语法相同。

要了解更多信息,请查看 包版本控制指南

更新包依赖项

#

首次在添加包后运行 flutter pub get 时,Flutter 会将 pubspec.lock lockfile 中找到的具体的包版本保存起来。 这可确保你再次获得相同版本,如果你或团队中的其他开发人员运行 flutter pub get

要升级到包的新版本,例如使用该包中的新功能,请运行 flutter pub upgrade 以检索 pubspec.yaml 中指定的版本约束允许的包的最高可用版本。 请注意,这与 flutter upgradeflutter update-packages 不同,后者都会更新 Flutter 本身。

对未发布的包的依赖

#

即使未发布到 pub.dev,也可以使用包。 对于私有包或尚未准备好发布的包,可以使用其他依赖项选项

路径依赖项

Flutter 应用可以使用文件系统 path: 依赖项依赖于一个包。 路径可以是相对路径或绝对路径。 相对路径相对于包含 pubspec.yaml 的目录进行评估。 例如,要依赖于位于应用旁边目录中的包 packageA,请使用以下语法

yaml
  dependencies:
  packageA:
    path: ../packageA/
Git 依赖项

你还可以依赖于存储在 Git 存储库中的包。 如果该包位于存储库的根目录中,请使用以下语法

yaml
  dependencies:
    packageA:
      git:
        url: https://github.com/flutter/packageA.git
使用 SSH 的 Git 依赖项

如果存储库是私有的,并且你可以使用 SSH 连接到它,请通过使用存储库的 SSH url 依赖于该包

yaml
  dependencies:
    packageA:
      git:
        url: git@github.com:flutter/packageA.git
Git 依赖项中的包位于文件夹中

Pub 假定该包位于 Git 存储库的根目录中。 如果不是这样,请使用 path 参数指定位置。 例如

yaml
dependencies:
  packageA:
    git:
      url: https://github.com/flutter/packages.git
      path: packages/packageA

最后,使用 ref 参数将依赖项固定到特定的 git 提交、分支或标签。 有关更多详细信息,请参阅 包依赖项

示例

#

以下示例介绍了使用包的必要步骤。

示例:使用 css_colors 包

#

css_colors 包定义了 CSS 颜色的常量,因此请在 Flutter 框架期望 Color 类型的地方使用这些常量。

要使用此包

  1. 创建一个名为 cssdemo 的新项目。

  2. 打开 pubspec.yaml,并添加 css-colors 依赖项

    yaml
    dependencies:
      flutter:
        sdk: flutter
      css_colors: ^1.0.0
    
  3. 在终端中运行 flutter pub get,或在 VS Code 中单击 获取软件包

  4. 打开 lib/main.dart 并替换其全部内容为

    dart
    import 'package:css_colors/css_colors.dart';
    import 'package:flutter/material.dart';
    
    void main() {
      runApp(const MyApp());
    }
    
    class MyApp extends StatelessWidget {
      const MyApp({super.key});
    
      @override
      Widget build(BuildContext context) {
        return const MaterialApp(home: DemoPage());
      }
    }
    
    class DemoPage extends StatelessWidget {
      const DemoPage({super.key});
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(body: Container(color: CSSColors.orange));
      }
    }
    
  5. 运行该应用。该应用的背景现在应该为橙色。

示例:使用 url_launcher 包启动浏览器

#

url_launcher 插件包允许在移动平台上打开默认浏览器以显示给定的 URL,并支持 Android、iOS、Web、Windows、Linux 和 macOS。此包是一个特殊的 Dart 包,称为 *插件包*(或 *插件*),其中包含特定于平台的代码。

要使用此插件

  1. 创建一个名为 launchdemo 的新项目。

  2. 打开 pubspec.yaml,并添加 url_launcher 依赖项

    yaml
    dependencies:
      flutter:
        sdk: flutter
      url_launcher: ^5.4.0
    
  3. 在终端中运行 flutter pub get,或在 VS Code 中单击 获取软件包

  4. 打开 lib/main.dart 并替换其全部内容为以下内容

    dart
    import 'package:flutter/material.dart';
    import 'package:url_launcher/url_launcher.dart';
    
    void main() {
      runApp(const MyApp());
    }
    
    class MyApp extends StatelessWidget {
      const MyApp({super.key});
    
      @override
      Widget build(BuildContext context) {
        return const MaterialApp(home: DemoPage());
      }
    }
    
    class DemoPage extends StatelessWidget {
      const DemoPage({super.key});
    
      void launchURL() {
        launchUrl(Uri.parse('https://flutterdart.cn'));
      }
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: Center(
            child: ElevatedButton(
              onPressed: launchURL,
              child: const Text('Show Flutter homepage'),
            ),
          ),
        );
      }
    }
    
  5. 运行该应用(或停止并重新启动它,如果它在添加插件之前已经运行)。单击 显示 Flutter 主页。您应该看到设备上打开的默认浏览器,显示 flutter.dev 的主页。