《Flutter 动画系列二》Google工程师带你选择Flutter动画控件
对初学者来说,看完这篇文章,我想你脑瓜子一定是嗡嗡的,这都说的是什么啊。 不要急躁,开始的我和你是一样的,第一遍看完,完全不知道在说什么,不明白不要紧,请先收藏此文章,然后先去学习下Flutter内置的25种动画组件。 地址:http://laomengit.com/flutter/module/animated_1/。 不要仅仅是看,要多写,只有写才能发现问题。 当你对动画控件有了一
《Flutter 动画系列一》25种动画组件超全总结
动画运行的原理任何程序的动画原理都是一样的,即:视觉暂留,视觉暂留又叫视觉暂停,人眼在观察景物时,光信号传入大脑神经,需经过一段短暂的时间,光的作用结束后,视觉形象并不立即消失,这种残留的视觉称“后像”,视觉的这一现象则被称为“视觉暂留”。 电影就是依靠视觉暂留,在感官上电影是连续的。使动画有流畅的感觉,帧率至少要达到24帧,即:每秒播放24个图像,因此动画有一个非常关键的性能参数FPS(F
Flutter 强大的MediaQuery控件
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 MediaQuery通常情况下,不会直接将MediaQuery当作一个控件,而是使用MediaQuery.of获取当前设备的信息,用法如下: var data = MediaQuery.of(context); 此方式必须放在Me
Flutter 使用阿里巴巴icon库
在Flutter默认创建的项目中可以使用系统Material图标,在pubspec.yaml文件中使用图标设置如下: flutter: uses-material-design: true 系统图标如下: 如果这里面没有我们想要的图标如何处理呢?这时可以使用第三方图标库,下面以阿里巴巴的图标库为例。 查找图标并加入购物车找到自己想要的图标后,将鼠标放置到图标上,加入购物车
还记得第一个看到的Flutter组件吗?
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 MaterialApp在学习Flutter的过程中我们第一个看见的控件应该就是MaterialApp,毕竟创建一个新的Flutter项目的时候,项目第一个组件就是MaterialApp,这是一个Material风格的根控件,基本用法如下:
你知道吗,Flutter内置了10多种show
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 showDialogshowDialog 用于弹出Material风格对话框,基本用法如下: showDialog( context: context, builder: (context) { ret
Flutter 日期时间选择类控件及国际化
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 DatePickerFlutter并没有DatePicker这个控件,需要使用showDatePicker方法弹出日期选择控件,基本用法如下: RaisedButton( onPressed: () async { va
你知道吗,Flutter内置了10多种Button控件
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 Flutter内置了10多种Button(按钮)类控件供我们使用,了解这些控件有助于提高我们的开发速度。 RaisedButtonRaisedButton是一个material风格”凸起“的按钮,基本用法: RaisedButton(
Flutter Form表单控件超全总结
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 Form、FormField、TextFormField是表单相关控件,类似于H5中form。 FormFieldFormField是一个表单控件,此控件包含表单的状态,方便更新UI,通常情况下,我们不会直接使用FormField,而是
Flutter 裁剪类组件 最全总结
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 ClipRectClipRect组件使用矩形裁剪子组件,通常情况下,ClipRect作用于CustomPaint 、 CustomSingleChildLayout 、 CustomMultiChildLayout 、 Align 、
Flutter 拖拽控件Draggable看这一篇就够了
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 Draggable系列组件可以让我们拖动组件。 DraggableDraggable组件有2个必须填写的参数,child参数是子控件,feedback参数是拖动时跟随移动的组件,用法如下: Draggable( child: C
Flutter 拖拽排序组件 ReorderableListView
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 ReorderableListView是通过长按拖动某一项到另一个位置来重新排序的列表组件。 ReorderableListView需要设置children和onReorder属性,children是子控件,onReorder是拖动完成
一篇带你看懂Flutter叠加组件Stack
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 StackStack组件可以将子组件叠加显示,根据子组件的顺利依次向上叠加,用法如下: Stack( children: <Widget>[ Container( height: 200,
全网最详细的一篇Flutter 尺寸限制类容器总结
Flutter中尺寸限制类容器组件包括ConstrainedBox、UnconstrainedBox、SizedBox、AspectRatio、FractionallySizedBox、LimitedBox、Container。这些组件可以约束子组件的尺寸,下面一一介绍。 ConstrainedBoxConstrainedBox组件约束子组件的最大宽高和最小宽高,假如一个组件宽高都是300,
Flutter DataTable 看这一篇就够了
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 DataTableDataTable控件显示表格数据,DataTable需要设置行和列,用法如下: DataTable( columns: [ DataColumn(label: Text('姓名')), Da
Flutter Widgets 对话框-Dialog
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 当应用程序进行重要操作时经常需要用户进行2次确认,以避免用户的误操作,比如删除文件时,一般会弹出提示“是否要删除当前文件”,用户点击确认后才会进行删除操作,这时我们可以使用提示框(AlertDialog或者CupertinoAlertDi
还记得面试时被算法支配的恐惧吗?
还记得面试时被算法支配的恐惧吗? <center>面试造火箭,上班拧螺丝</center> 大多数程序员心里会想"总结的真精辟",当面试到算法时,各种“跪”、“再跪”、“还是跪”......,多少人因为算法而拿不到心仪的offer,算法毁一生啊。智力面试时代现在算法已经成为大厂面试的重中之重,甚至一些国外的大厂只面试算法,为什么会这样
Flutter Widgets 之 SnackBar
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 基础用法应用程序有时候需要弹出消息提示用户,比如‘网络连接失败’、‘下载成功’等提示,就像Android等Toast,在Flutter中使用SnackBar组件,用法如下: Scaffold.of(context).showSnackB
Flutter Widgets 之 RichText
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 基础用法应用程序离不开文字的展示,因此文字的排版非常重要,通常情况下Text组件可以完成绝大多数需求,它可以显示不同大小的文字、字体、颜色等,如果想在一句话或者一段文字里面显示不同样式的文字,Text组件无法满足我们的需求,这个时候需要使
Flutter Widgets 之 ListWheelScrollView
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 基础用法在展示大量数据的时候我们第一会想到使用ListView,如果你觉得ListView比较单一、枯燥,你可以使用ListWheelScrollView,ListWheelScrollView和ListView同源,但它的渲染效果类似于