1. 犀牛前端部落首页
  2. flutter

22个适合小白的flutter实战视频教程

本文章的flutter视频教程适合新手学习flutter,是一个国外大佬开发的相当不错的flutter入门教程。

以下是22个简短的视频课程的列表,这些课程提供了开始开发移动应用程序的基本信息。 本速成课程面向初学者和非程序员。

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

视频观看地址在文章底部

视频介绍

什么是Flutter?

Flutter是由Google创建的用于构建移动应用程序的框架。 您可以同时开发Android和iOS移动应用程序,这意味着它是所谓的“跨平台解决方案”。 您只需使用一种称为Dart的编程语言编写的单个代码库来进行一次开发。 而不是使用iOS和Java的Swift或Android的Kotlin。

Flutter提取了与Android和iOS的交互,同时仍在生成本地代码。 简而言之,您不需要学习为不同的移动平台编写移动应用程序的不同方法,这类似于React Native,但是Flutter的优势在于框架,编程语言和工具链由单个公司开发,而仍然 开源。

环境安装

Visual Studio Code与Flutter完美地集成在一起。 有两个很棒的插件:Dart和Flutter,可以简化开发过程。 还有一个内置的热重载功能,可在开发应用程序时立即重载代码。

创建第一个Flutter程序

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

无状态和有状态组件

Flutter与React或Vue.js非常相似。 Component的概念被Widget的概念所取代,这基本上是同一件事。 同样,我们区分状态为有状态的小部件(React中的智能组件)和没有状态的小部件为无状态的小部件(React中的哑组件)。

列表元素

与移动应用程序进行交互的最常见的导入方式之一就是使用列表。 在Flutter中,借助ListView小部件,在屏幕上列出元素非常容易。

Assets

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

在Dart中使用类型

类型允许在我们的代码中提供明确的意图。 它们改善了较低级别和微观规模的编码体验。 Dart是Flutter使用的语言,不仅是静态类型化的,而且还提供了复杂的类型推断-编译器为您猜测类型的一种方式。

序列化JSON

有时需要对有效负载进行序列化,该负载通常是通过JSON格式通过网络获取的。 Dart&Flutter为此类任务提供了方便的助手。

进行HTTP请求并解析HTTP响应

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

 Async / Await 语法

Dart开箱即用地支持async / await语法。 在许多人看来,这导致了更易于阅读和理解的代码。 对于那些喜欢Promise的人来说,Dart拥有Futures的等效功能。

导航

手机上的屏幕通常比笔记本电脑的屏幕小得多。 交互作用经常导致屏幕变化。 在本课程中,我们将详细说明该机制。

创建简单表格

与网页相似,与移动应用程序进行交互的一种常见方式是通过表单。 您可以通过输入字段输入一些数据,也可以通过单选按钮或下拉菜单选择一些条件。 在Flutter中创建表单也非常简单。 本课说明了该过程的基础。

创建更复杂的表格

通过提交表单来发送表单。 可能不仅需要控制特定字段,还需要控制整个表单。 Flutter允许在Form小部件下对不同字段进行分组,以便表单提交触发将所有字段值保存在该表单中。

验证表格

表格需要验证。 这是一个接受适当值并拒绝不符合为每个字段定义的规则的值的过程。 Flutter带有用于验证表单的内置机制。

侧边栏

侧面菜单用于显示允许的操作以及当前登录用户的配置文件信息。 由于Flutter内置,因此无需从头开始构建此功能。

列表项交互

如前所述,列表在移动应用程序中很常见。 通过诸如轻扫之类的手势与列表项进行交互也很流行。 在Flutter中,此功能也是内置的,可作为Dismissible小部件使用。

创建tab bars

移动应用程序中另一个流行的元素是标签栏,通常位于屏幕顶部。 是的,这也是Flutter中内置的。 无需重新发明轮子,只需使用TabBarView小部件即可。

添加导航栏

与标签栏相反,导航栏通常位于屏幕底部。 此外,它们通常具有与栏中每个项目相关联的图标。 Flutter再次支持您,并提供了一个方便的BottomNavigationBar小部件来快速创建该功能。

Streams & The BLoC 模式

Dart编程语言具有强大的内置流支持。 此机制对于处理移动应用程序中的状态非常有用。 与内置的StreamBuilder一起,您可以轻松地重建小部件树的一部分,以响应流中的更改。

组合 Streams与Futures

Streams可能需要一些额外的学习,但与常规变量相比,它们还提供了更大的灵活性。 在开始时,如何将一次提供值的实体与流的概念(流是值的流)结合起来并不是一件容易的事。 在本课程中,我们将通过展示如何在Flutter中结合使用HTTP Future和流来深入探讨该主题。

创建客户端搜索

搜索功能对于移动应用程序也很常见。 再一次,Flutter通过提供内置机制来轻松实现该功能来帮助我们。 在本课程中,我们将展示如何构建搜索屏幕。

解释继承的小部件

除了有状态和无状态小部件,Flutter还有一个特殊的小部件,用于在小部件树之间共享数据。 在本集中,我们深入探讨了该主题,以充分理解如何使用这些信息来为我们的小部件提供数据。

分散架构

在本课程中,我们将花园作为隐喻,为建筑引入一种心理模型。 小部件是植物,而溪流是水在上面洒,所以这些小部件可以生长或改变。

本课程是免费的,并且它将永远是免费的。

视频链接地址如下:地址

 

 

原创文章,作者:犀牛前端部落,如若转载,请注明出处:https://www.pipipi.net/2846.html

发表评论

登录后才能评论