Byte Bank: 创建一个银行App

GitHub Github InDev GitHub Version

在本实践中,我们将创建第一个Flutter应用程序。这里的想法是做一些实际的、大多数人熟悉的事情,并借此机会解释一些在应用程序开发中有用的概念。

实践目标

我们的最终应用应该看起来像这样

带亮度的开始屏幕 添加转账 带转账明细的屏幕
WhatsApp Image 2022-04-01 at 02 39 56 image WhatsApp Image 2022-04-02 at 01 17 50 (2)
带暗黑模式的开始屏幕 添加转账 带转账明细的屏幕
image WhatsApp Image 2022-04-02 at 01 17 50 (3) WhatsApp Image 2022-04-02 at 01 17 50

1. 下载 Flutter

为了开始我们的实践,我们将下载SDK。请访问下面的链接并下载。

下载 Flutter

注意: 在下载 Flutter 的同时,我们也可以打开 Android Studio IDE,以便它下载一些东西。

1.1 选择一个文件夹

我们应该选择一个文件夹来存放我们的 Flutter SDK。

注意: 建议不要将其放在需要特权访问的文件夹中。

1.2 添加到 PATH

我们的 Flutter 已经可以运行了,如果我们直接通过 bin 文件夹访问,就可以执行一些命令了,但为了能够通过终端访问而无需指向该文件夹,将其添加到 PATH 会更方便。

在 Windows 系统上


在开始菜单中,我们搜索“编辑此账户的环境变量”。我们将查找 PATH 并添加一个新的条目,该条目将指向我们从 Flutter 下载的文件中的 bin 文件夹。

例如,假设 Flutter 文件位于路径 C:\opt\flutter。在我们的 PATH 中,我们将添加条目 C:\opt\flutter\bin

之后,只需重启即可在 PowerShell 中访问该命令。

为了测试,我们可以执行命令 flutter --version

在 Linux 系统上


敬请期待……。

模拟器

在创建项目并开始编写代码之前,创建模拟器很重要。我们可以通过 Android Studio 的 AVD Manager 来完成。

所以在 Android Studio 中,进入 Tools > AVD Manager,然后创建一个新的设备。

我们可以使用默认配置,然后下载一个 Android 映像,以便我们的模拟器能够运行。(可以先让它下载,然后继续)

如果您想使用自己的手机,可以随意使用,实际上更好。您可以把您做的带回家。

为此,我们只需启用开发者选项。进入 设置 > 系统 > 关于设备。

连续点击版本号 7 次。

启用 USB 调试,然后连接您的设备。

执行命令 flutter doctor 来查看您的设备是否被识别。

一个崭新的 Flutter 项目。

入门

本项目是 Flutter 应用程序的起点。

如果您这是您的第一个 Flutter 项目,这里有一些入门资源

要开始使用 Flutter,请参阅我们的 在线文档,其中提供了教程、示例、有关移动开发的指南以及完整的 API 参考。

GitHub

查看 Github