关于程序员:介绍-10-个有用的-Flutter-软件包

0次阅读

共计 5635 个字符，预计需要花费 15 分钟才能阅读完成。

原文 https://genotechies.medium.co…

FLutter 软件包使您的开发简略疾速。然而，有利有弊。有时候，如果从头开始开发这个个性将是无益的，因为可定制的软件包较少。此外，咱们还能够看到许多风行的软件包，它们总是为这个特定性能提供抉择。在这里，我探讨每个根本细节的十个包。而后你就能够决定是否应用它们。咱们去找他们每一个人。

https://pub.flutter-io.cn/pac…

如何增加一个二维码到你的 Flutter 应用程序。这是最简略的办法做到这一点。

将 qr_flutter 包增加到依赖项中

dependencies:
qr_flutter: ^4.0.0

并将 qr_flutter 包导入到文件中。
能够应用 QR Image widget。

import 'package:flutter/material.dart';
import 'package:qr_flutter/qr_flutter.dart';
void main() => runApp( MyApp());

class MyApp extends StatelessWidget {MyApp({Key? key}) : super(key: key);

@override

Widget build(BuildContext context) {

return MaterialApp(

home: Scaffold(

appBar: AppBar(title:Text("QR Code Flutter"),

),

body: Center(

child:QrImage(

data: "Hello",

version: QrVersions.auto,

size: 200,

),

),

),

);

}

}

这是输入。

您能够在扫描代码时取得插入到数据属性中的输入。

https://pub.flutter-io.cn/pac…

如何应用谷歌 map 在您的 Flutter 应用程序？该软件包用于通过谷歌 map 数据增加 map 数据。应用这个软件包，您能够拜访谷歌 map 服务器，map 显示，并拜访用户手势。此外，您还能够增加 map 标记，创立信息窗口，使 HTTP 申请谷歌方向，API 的路线信息，显示折线和动画的 map。对于所有这些，您须要一起应用上面的 flutter 软件包。

Dio ー这个包用于向 google Directions API 发送 HTTP 申请以获取路由信息

02.Flutter_poliline_points ー这个包用于将折线字符串解码为显示路由所必须的经纬度点

Google_map_flutter ー这个软件包用于向用户显示 map

而后应用 map，它须要有一个来自谷歌控制台的 API 键。在这里，您必须为 ios 启用 map SDK，为 android 和 Directions API 启用 map SDK。而后转到 android 清单文件并给出 API 密钥。而后你能够无效地利用谷歌 map 在您的应用程序在您的形式。

https://pub.flutter-io.cn/pac…

应用这个软件包，您能够应用动画警报对话在您的 Flutter 应用程序，易于应用和定制。而且，从这个包中，您能够取得预约义的题目和款式以及预约义的警报款式。Show() 办法用于显示和定义警报类型。

上面是示例代码。

import 'package:flutter/material.dart';

import 'package:quickalert/quickalert.dart';


void main() {runApp(const MyApp());

}

class MyApp extends StatelessWidget {const MyApp({Key? key}) : super(key: key);

  @override

  Widget build(BuildContext context) {

    return MaterialApp(

      debugShowCheckedModeBanner: false,

      title: 'QuickAlert Demo',

      theme: ThemeData(primarySwatch: Colors.blue,),

      home: const MyHomePage(),);

  }

}

class MyHomePage extends StatefulWidget {const MyHomePage({Key? key}) : super(key: key);

  @override

  State<MyHomePage> createState() => _MyHomePageState();

}

class _MyHomePageState extends State<MyHomePage> {

  @override

  Widget build(BuildContext context) {

    final successAlert = buildButton(onTap: () {

        QuickAlert.show(

          context: context,

          type: QuickAlertType.success,

          text: 'Transaction Completed Successfully!',

          autoCloseDuration: const Duration(seconds: 2),

        );

      },

      title: 'Success',

      text: 'Transaction Completed Successfully!',

      leadingImage: Icon(Icons.add),

    );





    return Scaffold(

      backgroundColor: Colors.white,

      appBar: AppBar(

        elevation: 1,

        centerTitle: true,

        backgroundColor: Colors.white,

        title: Text(

          "QuickAlert Demo",

          style: Theme.of(context).textTheme.titleMedium,

        ),

      ),

      body: ListView(

        children: [const SizedBox(height: 20),

          successAlert,



        ],

      ),

    );

  }

  Card buildButton({

    required onTap,

    required title,

    required text,

    required leadingImage,

  }) {

    return Card(shape: const StadiumBorder(),

      margin: const EdgeInsets.symmetric(horizontal: 20,),

      clipBehavior: Clip.antiAlias,

      elevation: 1,

      child: ListTile(

        onTap: onTap,

        leading: CircleAvatar(

          backgroundColor: Colors.green,

          radius: 16,

        ),



        title: Text(title ?? ""),

        subtitle: Text(text ?? ""),

        trailing: const Icon(Icons.keyboard_arrow_right_rounded,),

      ),

    );

  }

}

这是输入

能够应用警报对话显示谬误警报、警报、信息警报、确认警报和加载警报，还能够创立自定义警报对话。

https://pub.flutter-io.cn/pac…

这个包将帮忙您进行代码从新生成和应用程序的单元测试。你能够在 mockito.pub.dev.com 找到这个包裹。对于如何应用它有很好的文档。如果您不相熟测试 Flutter 应用程序，强烈推荐应用此软件包来测试您的应用程序。

https://pub.flutter-io.cn/pac…

这个软件包能够让你轻松地增加 Material 动画到你的应用程序。在这个软件包中，你能够应用你的应用程序的所有根本动画，利用广泛冀望的成果。此外，如果你违心，你能够增加一些自定义动画到你的应用程序。

物质静止定义了下列过渡模式:

container 转换
共享轴
淡出
隐没

https://pub.flutter-io.cn/pac…

此包可用于为我的项目增加 SVG 图像和网络 SVG 图像。您能够通过 flutter_svg.pub.dev.com 取得这个包。上面的五个用例将帮忙您在应用这个包时。

您的设计器创立一个向量资产，您心愿包含在内，而不须要转换为 5 种不同的光栅格局分辨率。
矢量绘图应该是动态的、非交互的 (或者最低限度的)。
您心愿在运行时从网络源动静加载 SVG。
您心愿绘制 SVG 数据并将其出现为图像。

https://pub.flutter-io.cn/pac…

此包将解决应用程序中与州相干的所有内容。您能够在编译时而不是在编译时捕捉对于状态的谬误。它为侦听 / 组合对象标识和删除嵌套。最初，您能够确保代码在运行之前是齐全可测试的。这是一个包，您能够应用 Hooks、Riverpord 和 state notifier。你能够在 Hook_Riverpod 包中找到所有的货色。Pub.dev.

https://pub.flutter-io.cn/pac…

这个包是对于应用程序图标的。如果您应用这个软件包，您能够在替换图标时节俭大量的工夫。您能够从此包中取得所需的图形和图形作为图标。您能够遵循包文档并应用应用程序图标所需的步骤。

https://pub.flutter-io.cn/pac…

如果您已经不得不实现 auth，那么您可能晓得它有多乏味。下次如果你须要给应用程序增加身份验证，试试 Firebase 身份验证和 flutter_auth_ui 包，只须要几行代码就能够给你的应用程序增加身份验证。FirebaseUI for auth 是一个官网的 Firebase 产品，包含 widget 和全屏幕，以简化实现 auth。

您能够应用登录屏幕 widget 向应用程序增加一个页面，该页面将率领用户实现整个身份验证流程。首先，在应用程序中增加一个登录门路，该门路指向登录屏幕 widget。接下来，您须要通知登录屏幕哪些类型的身份验证提供者是 Firebase 我的项目用户，而后屏幕将向屏幕填充适当的表单元素。

如果您只应用电子邮件和明码登录，那么您曾经实现了。Firebase 身份验证和 Firebase UI 反对各种其余身份验证提供商，如 Google 登录、GitHub 登录、Apple 登录等。查看残缺列表的包文档。将这些身份验证提供程序中的任何一个增加到登录屏幕 widget 提供程序配置中，并为其提供特定于提供程序的配置。

如果你正在应用像 Google 登录这样的受权提供商，你只须要给它你的 Google 登录客户端 ID，它就会失常工作。FirebaseUIforauth 包包含用户注册屏幕、被忘记的明码屏幕、用户配置文件屏幕等。

Firebase UI widget 是可定制的。它甚至包含 widget 和控制器，容许您为任何受反对的提供程序编写齐全自定义的敞开流。因而，如果你想构建你关怀的应用程序局部，让 Firebase 身份验证和 Firebase UI 包为你解决身份验证。无关用于 auth 和所有 Firebase 包的 Firebase UI 的更多信息，请转到 pub.dev 获取原始文档。

https://pub.flutter-io.cn/pac…

一个由来已久的 Flutter 传统是运行 Flutter 创立，删除所有，而后辛苦地复制和粘贴在所有的规范样板。这须要很长时间，非常容易出错，而且没有征税那么乏味。肯定要这样吗？增加 Mason，这个软件包次要是用预约义的砖块疾速组装新我的项目或个性。Mason 的工作形式是蕴含它依据特定于您的我的项目的值出现的模板的整个目录。

例如，假如您正在应用 pubspec.yaml 文件和一块对于舒服袜子的泥砖来实现一个新的 flutter 我的项目。用那块砖，可能看起来像这样。如果应用 firebase，它将生成一个 pubspec.yaml 文件，其中蕴含 firebase 依赖项。如果您不应用 firebase，那么这些依赖关系将被跳过。但 Mason 怎么晓得你我的项目的名字，或者你是否应用了 Firebase？装置 Mason CLI，就像 Flutter 创立的那样，然而更加灵便，因为它应用了泥瓦匠和定制砖块。装置实现后，你能够运行 Mason make 命名为 brick Mason 会读取 brick 清单文件并问你一些问题。在这种状况下，它会心愿晓得您的我的项目的名称，以及您是否正在应用 firebase。

Mason-CLI 反对各种数据类型，包含字符串、布尔值、数字和枚举。这就只剩下一个问题了。咱们如何找到咱们想要应用的砖块的名称？为此，请拜访 brickhub.dev，查看世界各地那些曾经在上传本人回心转意的样板文件以帮忙您节省时间的开发人员能够应用的公开版块。如果你没有找到一个你喜爱的，将你首选的 Flutter 我的项目构造转换成一块砖，并上传它，以节俭本人的工夫在将来。顺便说一句，砖块能够是任何大小，而不仅仅是整个我的项目。发现自己每次开始一个新个性时都会创立一些反复的启动文件。这块砖头也不错。有了 Mason，你能够比以前更快地写出应用程序中令人兴奋的局部。

如果本文对你有帮忙，请转发让更多的敌人浏览。

兴许这个操作只有你 3 秒钟，对我来说是一个激励，感激。

祝你有一个美妙的一天~

微信 ducafecat
https://wiki.ducafecat.tech
https://video.ducafecat.tech

本文由 mdnice 多平台公布

正文完

程序员

发表至：程序员

2022-11-27

0

关于程序员:前端开发应该掌握的查找算法

关于程序员:翻译图像到Base64字符串转换

关于程序员:彻底搞懂-etcd-系列文章六etcd-核心-API-v3

关于程序员:彩神下载app是正规的吗

关于linux:如何通过-kubectl-进入-node-shell

关于程序员:介绍-10-个有用的-Flutter-软件包

介绍 10 个有用的 Flutter 软件包

前言

注释

qr_flutter

Flutter Google Maps(google_maps_flutter)

Quick Alerts

mockito

Animations

Flutter Svg

Hooks_Riverpod

Flutter_launcher_icons

Firebase UI auth

mason Package in Flutter

结束语

站内搜索