我看完掘金上的227篇文章,总结出一份 Flutter 入门教程

37,312 阅读5分钟

2018年6月21日,Google 在 GTMC 大会上发布了 Flutter preview 1。这标志着 Flutter 发展已经进入到一个新阶段,即将迎来 1.0 的稳定版本。

本文致力于整理 Flutter 的入门的文章。作为自己学习 Flutter 的学习笔记。同时希望这篇文章能帮助小伙伴入门 Flutter 。

Flutter 简介

如果你第一次接触 Flutter ,你应该从简介开始,在简介中你可以了解到 Flutter 是什么,有哪些优点。 Flutter 和其他的跨平台框架的差异……。总之,它能更好的带你初步了解Flutter。

为什么原生应用开发者需要关注 Flutter

如果你是 iOS、Android 的原生开发者,那你应该看一下这篇文章,这篇文章清晰的说明了为什么原生开发这需要关注 Flutter。简单易学高效的 Dart 语言、反应式的 Flutter、以及一切都是Wiget……,看完这些之后,你会感觉到 Flutter 的简洁强大。你会停止下来手头的正在写的 Swift 和 Kotlin 代码,去了解一下 Flutter 是什么。

Flutter 英文官网

在这个网站中你必须看懂的是怎样配置 Flutter 的开发环境。为什么不用 Flutter 中文网?因为最新特性需要翻译,网站更新需要时间。

Flutter 安装(Windows)

如果你在官网学习如何安装 Flutter 遇到了问题,那么应该找学习一下前人的经验了。这篇文章讲解了如何在 Windows 上安装 Flutter SDK。希望给使用 Windows 作为开发机器的小伙伴一点帮助。

Flutter 安装(Mac)

如果你使用的是 Mac,这篇详细的教程可以帮到你。

Google 跨平台方案 Flutter 从入门到实战

配置好基本环境以后,我们要学习的是 Flutter 的基本语法,内容包括:变量声明、数据类型、判断和循环条件等基础知识。虽然编程语言千变万化,但是学习路径永远是这样。建议你在学习 Flutter 基础知识的时候对照着自己正在使用的编程语言的学习路径,对应起来学习。有对比学的更快些。

如果你一步一步的学习,学到这里,算是完成了小成就。你现在可以轻松的写下几行 Dart 的代码,然后运行一个 Hello World 程序。

Flutter 布局详解

学习过 Hello World 程序之后。我们可以开始学习 Flutter 布局了。学习布局意味着我们可以使用 Flutter 构建移动应用界面,一套代码,可以在 Android 和 iOS 上运行。本文主要介绍了 Flutter 布局的相关内容,从实际的例子出发,讲解该如何使用 Flutter 进行布局。

Flutter 布局(一)- Container详解

本文列举了 Flutter中 最常见的布局 Container, 列举的一些实际应用的例子以及使用方法。

Flutter 布局(二)- Padding、Align、Center详解

这篇文章介绍了 Flutter 常见的集中控件,包括:PaddingAlignCenter。介绍了他们的布局行为以及使用场景。

Flutter 布局(三)- FittedBox、AspectRatio、ConstrainedBox详解

这篇文章介绍了 Flutter 常见的集中控件,包括:FittedBoxAspectRatioConstrainedBox。介绍了他们的布局行为以及使用场景。

Flutter Widgets: Image

介绍了 Flutter 的 Image 控件的使用方法。

Flutter Widgets: Text

介绍了 Flutter 的 Text 控件的使用方法

显然,讲解Flutter布局的文章还不是很全面,在后的更新中会进行补充。

在学习 Dart 基本语法、Flutter布局这些知识之后,距离我们做一个有数据交互的 Flutter App 还需要学习最后一部分知识:网络请求。

浅尝 Flutter 中的 http 请求

这篇文章中,作者介绍了如何在 Flutter 中使用 http 请求来完成一个新闻页面的功能,数据源使用的 Django+Mysql,如果你在未缺少数据源而感到哦困恼,你可以尝试一下豆瓣开发者服务中提供的数据接口。你可以不用很详细的编写页面,但是一定要掌握如何使用 Flutter 进行网络请求。

练习题:

Flutter 实战之实现一个简单的新闻阅读器

作者通过一些公共的数据接口,完成了一个简单的新闻阅读 App,通过这个例子可以完成的使用到Dart语法、布局和控件以及网络请求的相关知识。

基于 Google Flutter 的开源中国客户端,支持Android与iOS

作者通过使用开源中国的相关 API 和数据爬虫,实现了一个有功能的开源中国客户端,通过这个例子也可以完成的使用到 Dart 语法、布局和控件以及网络请求的相关知识。

到此,你可以使用 Flutter 的构建一个具有精美界面、使用 Dart 构建的、有数据请求的 iOS 或 Android 应用。

我的一篇文章承载不了 Flutter 所有的知识点,如果你想了解更多关于 Flutter 的相关知识,你可以关注一下掘金的Flutter 的 Tag,目前该Tag下一共有227篇文章。内容包含从 Flutter Beta 3 以来的所有关于 Flutter 的内容,相信这些文章能够更好的帮助你学习 Flutter 。