22 个简短课程助您成为使用 Flutter 框架的移动程序员

2025-05-28

22 个简短课程助您成为使用 Flutter 框架的移动程序员

这里列出了 22 节简短的视频课程,它们提供了开发移动应用程序所需的基本信息。本速成课程面向初学者非程序员

这些课程并不教授 Flutter 和 Dart 中的抽象概念和思想,而是展示构建实际移动应用程序的过程。

加入我的冒险,成为一名优秀的移动程序员!:)

0.什么是 Flutter?

Flutter是由 Google 开发的移动应用框架。您可以开发 Android 和 iOS 移动应用,这意味着它是一个所谓的“跨平台解决方案”。您只需使用 Dart 编程语言编写的单一代码库,即可一次性开发。无需为 iOS 使用 Swift,为 Android 使用 Java 或 Kotlin。

Flutter 抽象了与 Android 和 iOS 的交互,同时仍然生成原生代码。简而言之,你无需学习为不同移动平台编写移动应用程序的不同方法。这与 React Native 类似,但 Flutter 的优势在于框架、编程语言和工具链均由同一家公司开发,同时仍然是开源的。

1. 开发设置

Visual Studio Code 与 Flutter 完美集成。它有两个很棒的插件:Dart和 ,Flutter可以简化开发流程。此外,它还内置了热重载功能,可在开发应用时提供即时代码重载。

2. 创建第一个 Flutter 应用程序

Flutter 插件添加了 VS Code 命令来创建新的项目样板并启动适用于 Android 和 iOS 的移动设备模拟器。

3. 无状态和有状态的小部件

Flutter 与 React 或 Vue.js 非常相似。组件 (Component) 的概念被 Widget 的概念所取代,两者本质上是一回事。同样,我们将具有状态的 Widget 称为有状态 Widget(React 中的智能组件),将没有状态的 Widget 称为无状态 Widget(React 中的哑组件)。

4. 列表元素

与移动应用交互最常见、最重要的方式之一就是使用列表。在 Flutter 中,借助ListViewWidget,在屏幕上列出元素变得非常容易。

5. 资产

移动设备与网页略有不同。如果需要显示图像或处理离线访问的数据文件,则需要将这些内容作为资产存储在该设备上。

6. 在 Dart 中使用类型

类型使我们能够在代码中提供清晰的意图。它们可以提升底层和微观层面的编码体验。Flutter 使用的语言 Dart 不仅是静态类型的,而且还提供了复杂的类型推断——一种让编译器自动猜测类型的方法。

7.序列化 JSON

在某些时候,我们需要序列化一个有效负载,通常以 JSON 格式通过网络获取。Dart 和 Flutter 为此类任务提供了便捷的辅助工具。

8. 执行 HTTP 请求并解析 HTTP 响应

Dart 中的包http带有一套全面的工具集,可以执行任何类型的 HTTP 请求并有效地解析 HTT 响应。

9. Async/Await 语法

Dart 支持async/await开箱即用的语法。在许多人看来,这使得代码更易于阅读和理解。对于那些更喜欢 概念的人来说Promise,Dart 有Future一个等效的语法。

10. 屏幕间导航

手机屏幕通常比笔记本电脑屏幕小得多。交互会导致屏幕频繁切换。在本课中,我们将详细解释这一机制。

11.创建简单表单

与网页类似,与移动应用交互的常见方式是通过表单。您可以通过输入字段输入数据,或通过单选按钮或下拉菜单选择条件。在 Flutter 中创建表单也非常简单。本课程将介绍该流程的基础知识。

12.创建更复杂的表单

表单通过提交的方式发送。有时,我们不仅需要控制特定字段,还需要控制整个表单。Flutter 允许将不同的字段分组到同一个Form控件下,这样提交表单时就会触发保存该表单中所有字段值的事件。

13. 验证表单

表单需要验证。这是一个接受正确值并拒绝不符合每个字段定义规则的值的过程。Flutter 内置了表单验证机制。

14. 添加侧边菜单

侧边菜单用于显示当前登录用户的允许操作以及个人资料信息。此功能已内置,无需在 Flutter 中重新构建。

15. 使列表项可忽略

如前所述,列表在移动应用中很常见。通过滑动等手势与列表项进行交互也很常见。在 Flutter 中,此功能也内置于DismissibleWidget 中。

16.创建标签栏

移动应用中另一个流行的元素是标签栏,通常位于屏幕顶部。没错,Flutter 也内置了标签栏。无需重新设计轮子,直接使用TabBarView小部件即可。

17.添加导航栏

与标签栏不同,导航栏通常位于屏幕底部。此外,导航栏中每个项目通常都有对应的图标。Flutter 再次为您提供支持,并提供了一个便捷的BottomNavigationBarWidget 来快速创建该功能。

18. 流和 BLoC 模式

Dart 编程语言内置了强大的流支持。这种机制对于处理移动应用中的状态非常有用。借助内置功能,StreamBuilder您可以轻松重建部分 Widget 树,以响应流的变化。

19. 将 Streams 与 Futures 结合起来

流可能需要一些额外的学习,但它们也比常规变量提供了更大的灵活性。一开始,如何将一次性提供值的实体与流(即值的流)的概念结合起来可能并不简单。在本课中,我们将深入探讨这个问题,展示如何在 Flutter 中将 HTTP Future 与流结合起来。

20.创建客户端搜索

搜索功能在移动应用中也相当常见。Flutter 再次提供了内置机制,帮助我们轻松实现该功能。在本课中,我们将展示如何构建一个搜索屏幕。

21. 解释继承的Widget

除了有状态和无状态的 Widget 之外,Flutter 还有一个特殊的 Widget,用于在 Widget 树中共享数据。在本期节目中,我们将深入探讨这个主题,以全面了解如何使用它来为 Widget 提供数据。

22. Sprinkle 架构

在本课中,我们将以花园作为比喻,介绍建筑的思维模型。小部件是植物,而溪流则是洒在它们身上的水,使这些小部件能够生长或变化。


本课程免费,并且永远免费。没有任何附加条件。如果您喜欢它,觉得它有用,或者它对您的职业生涯有所帮助,请给我私信。看到和听到大家喜欢这些课程,真的激励我创作更多。

您还可以订阅我的 YouTube 频道。;)

文章来源:https://dev.to/zaiste/22-short-lessons-to-become-a-mobile-programmer-using-flutter-framework-d9j
PREV
2020 年值得学习的编程语言,助你成为软件开发者
NEXT
你可能不知道的 15 个 Git 命令