flutter布局教程老菜鸟，flutter flutter

小程序：扫一扫查出行
【扫一扫了解最新限行尾号】
复制小程序

对于初学flutter的朋友来说，要知道，flutter的UI万物皆Widget。 flutter所写的页面的结构可以被看成套娃，一层套一层，一层套一层，一层套一层。。

在Flutter中，我们平时自定义的widget，一般都是继承自StatefulWidget或StatelessWidget（并不是只有这两种），这两种widget也是目前最常用的两种。

但在 Flutter 里面，它们全都属于一个统一的模型 Widget。可以说，在 Flutter 界面里，所有东西都是 Widget。以前学面向对象的时候，我们都听过一句话，叫万物皆对象。我这里套用一下，在 Flutter 里，万物皆控件。

这个图标目前要有打客服电话功能”。我一心想，这人真会搞事哈哈。

flutter生命周期大体上可以分为三个阶段：初始化、状态变化、销毁。

一文解决Flutter中使用TextField遇到的各种疑难杂症

一种是使用系统的返回键，比如 android 底部导航自带的返回，另一种是使用导航栏自定义的返回键第一种情况需要在页面根布局使用 WillPopScope 在 onWillPop 中拦截返回处理。

对于金额等的输入，常常要求TextField限制输入为小数，可使用以下约束：但这种限制会有问题，比如可以输入 0.1 这种其实就不是小数了，并且不能限制小数点的输入位数。

TextField样式自带下划线背景，在decoration中设置border： InputBorder.none即可去掉。

显示输入的密码以便用户可以看到实际输入的内容，设置属性 obscureText 为 false ：我们制作了一个简单的Flutter应用，在屏幕中心包含 TextField widget （你也可以使用 TextFormField ）。

六、单子布局、多子布局

单子布局组件的含义是其只有一个子组件比较常用的单子布局组件有： Align 、 Center 、 Padding 、 Container 。

初学者应该从认象棋子开始学起，了解好每个子的走法以及相关规则，包括了解一下相关杀法。对面笑、双车错、马后炮、重炮等等。

第一种布局掌握三原则，先占空角最重要，挂角守角是次序，拆边分投要先走。布局关键占要点，切莫贪吃走小棋，急所大场抢先占，立二拆三三拆四。高低配合是棋理，开局棋下三四路，五路太飘二路扁，分投定要位置好。

Flutter小部件之图片(Image)和图标(Icon)

Flutter中，可以像web开发一样使用iconfont，iconfont也即字体图标，它是将图标做成字体文件，然后通过指定不同的字符而显示不同的图片。加号为图片组件，减一为icon组件。点击加号，数字加1；点击-1，数字减少1。

Image（图片组件）是显示图像的组件，一个显示图片的widget，支持图像格式：JPEG，PNG，GIF，动画GIF，WebP，动画WebP，BMP和WBM 构造方法 Image：从ImageProvider获取数据 Image.network：加载网络图片。

brightness： Brightness.light 状态栏图标与字体颜色为黑色。 iconTheme ：设置appbar icon的颜色，appbar中icon的颜色会根据primaryColor的改变来确定自身的颜色，这里可以在iconTheme中指定icon的颜色。

一般常用的 Button 是 MaterialButton、IconButton、FloatingActionButton。MaterialButton 是一个 Materia 风格的按钮。一般来说，如果需要点击事件，就要嵌套一个 Button，因为 Container、Text 等组件都没有点击事件。

无网络有缓存视频时，无法展示封面，因为内部是通过imageProvider去加载网络图片的。

SliverGridDelegate 是一个抽象类，定义了GridView Layout相关接口，子类需要通过实现它们来实现具体的布局算法。