flutter教程

📄️ 1. flutter架构什么的,看完这篇文章就全懂了

Flutter是google开发的一个跨平台的UI构建工具，flutter目前最新的版本是3.0.1。使用flutter你可以使用一套代码搭建android，IOS，web和desktop等不同平台的应用。做到一次编写到处运行的目的。

📄️ 2. widgets,构成flutter的基石

flutter中所有的组件都是由widgets组成的，flutter中有各种各样的widgets，这些widgets构成了flutter这个大厦。

📄️ 3. 用来管理复杂状态的State详解

Flutter的基础是widget,根据是否需要跟用户进行交互，widget则可以分为StatelessWidget和StatefulWidget。StatelessWidget只能根据传入的状态进行简单的初始化widget，如果要实现跟用户交互这种复杂的功能，则需要用到StatefulWidget。

📄️ 4. 构建Widget的上下文环境BuildContext详解

我们知道Flutter中有两种Widget，分别是StatelessWidget和StatefulWidget，StatelessWidget中有一个build方法来创建对应的Widget，虽然StatefulWidget中没有对应的build方法，但是和StatefulWidget对应的State中也有同样的build方法。

📄️ 6. 移动端的手势基础GestureDetector

移动的和PC端有什么不同呢？同样的H5可以运行在APP端，也可以运行在PC端。两者最大的区别就是移动端可以用手势。手势可以做到一些比如左滑右滑，上滑下滑，缩放等操作。

📄️ 7. Material主题的基础-MaterialApp

为了简化大家的使用，虽然flutter推荐所有的widget都有自己来进行搭建，但是在大框架上面，flutter提供了Material和Cupertino两种主题风格的Widgets集合，大家可以在这两种风格的继承上进行个性化定制和开发。

📄️ 8. UI layout简介

对于一个前端框架来说，除了各个组件之外，最重要的就是将这些组件进行连接的布局了。布局的英文名叫做layout，就是用来描述如何将组件进行摆放的一个约束。

📄️ 9. flutter中常用的container layout详解

在上一篇文章中，我们列举了flutter中的所有layout类，并且详细介绍了两个非常常用的layout:Row和Column。

📄️ 10. flutter中常用的GridView layout详解

GridView是一个网格化的布局，如果在填充的过程中子组件超出了展示的范围的时候，那么GridView会自动滚动。

📄️ 12. flutter中常用的ListView layout详解

ListView是包含多个child组件的widget，在ListView中所有的child widget都是以list的形式来呈现的，你可以自定义List的方向，但是和GridView不同的是ListView中的每一个List里面都只包含一个widget。

📄️ 13. flutter中常用的Stack layout详解

对于现代APP的应用来说，为了更加美观，通常会需要用到不同图像的堆叠效果，比如在一个APP用户背景头像上面添加一个按钮，表示可以修改用户信息等。

📄️ 14. Material中的3D组件Card

除了通用的组件之外，flutter还提供了两种风格的特殊组件，其中在Material风格中，有一个Card组件，可以很方便的绘制出卡片风格的界面，并且还带有圆角和阴影，非常的好用，我们一起来看看吧。

📄️ 15. 深入理解布局的基础constraints

我们在flutter中使用layout的时候需要经常对组件进行一些大小的限制，这种限制就叫做constraints，用来控制layout中的组件大小。

📄️ 16. 按比例缩放的AspectRatio和FractionallySizedBox

我们在构建UI的时候，为了适应不同的屏幕大小，通常需要进行一些自适应的配置，而最常见的自适应就是根据某个宽度或者高度自动进行组件的缩放。

📄️ 17. flutter中常用的box

flutter中的layout有很多，基本上看layout的名字就知道这个layout到底是做什么用的。比如说这些layout中的Box，从名字就知道这是一个box的布局，不过flutter中的box还有很多种，今天我们来介绍最常用的LimitedBox,SizedBox和FittedBox。

📄️ 18. flutter中的builder

flutter中有很多种Builder，虽然所有的builder都是构造器，但是不同的builder之间还是有很多差距的。今天我们来详细介绍一下Builder，LayoutBuilder，StatefulBuilder这几个builder的使用。

📄️ 19. flutter中的IndexedStack

之前我们介绍了一个flutter的栈结构的layout组件叫做Stack,通过Stack我们可以将一些widget叠放在其他widget之上，从而可以实现图像的组合功能，也是日常中最常用的一种组件了。今天我们要介绍的组件是Stack的近亲，叫做IndexedStack，它有什么功能呢？一起来看看吧。

📄️ 20. flutter中的Wrap

我们在flutter中使用能够包含多个child的widget的时候，经常会遇到超出边界范围的情况，尤其是在Column和Row的情况下，那么我们有没有什么好的解决办法呢？答案就是今天我们要讲解的Wrap。

📄️ 21. flutter中的offstage

我们在使用flutter的过程中，有时候需要控制某些组件是否展示，一种方法是将这个组件从render tree中删除，这样这个组件就相当于没有出现一样，但是有时候，我们只是不想展示这个widget，但是这个组件还是存在的，并且可以接受键盘输入，还可以使用CPU。它和真正的组件唯一不同的就是他是不可见的。