Flutter教程
准备
学习Flutter之前,必须要了解(不需要多么精通,但至少要了解)Dart的基础特性。
- Dart基础特性 · Dart 是 Google 开发的新一代编程语言,Flutter就是只用dart语言编写的。
- 在Windows上搭建Flutter开发环境
- Flutter之初体验 · 创建一个Flutter Android项目
Flutter 常用组件
- Flutter Text(Flutter文本显示和样式) · Flutter文本显示和样式,自定义字体
- Flutter TextField 文本框 · 文本框样式、文本框布局、获取数据
- Flutter Form表单 · 表单提交 演示
- Flutter Image组件 · 图片加载、土拍你颜色混合、图片平铺、图片拉伸、圆形图片
- Flutter ListView组件 · 列表数据加载,ListTile介绍
- Flutter GridView组件 · 介绍GridView.count和GridView.builder 实现布局
- Flutter Button 组件 · 包括了:MaterialButton、RaisedButton、FloatingActionButton、FlatButton、IconButton、ButtonBar、DropdownButton 等。
- Flutter DateTime详解 · Flutter日期转换、Flutter时间戳
- Flutter 动画 · 缩放、颜色渐变、平移、淡入淡出、旋转、改变形状、混合组合
- Flutter BottomSheet 底部滑出的组件 · Flutter BottomSheet 底部滑出的组件,底部弹窗
- Flutter Chip 标签 ·
- Flutter Checkbox 复选框 · Checkbox 和 CheckboxListTile 复选框
- Flutter Radio 单选按钮 · Radio 和RadioListTile 单选按钮
- Flutter Switch 开关 · Switch与CupertinoSwitch
- Flutter Slider 进度条 · Slider与CupertinoSlider
- Flutter Stepper 步骤 · 步骤组件是用来约束用户操作顺序的
- Flutter AlertDialog对话框 · 警报对话框
- Flutter AboutDialog对话框 · 包含应用程序的图标,名称,版本号和版权的对话框
- Flutter SimpleDialog 对话框 · 简单对话框
- Flutter CupertinoAlertDialog IOS风格对话框 · iOS风格的警报对话框
- Flutter CupertinoFullscreenDialogTransition 全屏对话框 · 全屏对话框
- Flutter Dialog 对话框 · 对话框简介
- Flutter Drawer 侧滑菜单、抽屉 ·
- Flutter PopupMenuButton 菜单 ·
- Flutter ExpansionPanel 收缩面板 ·
- flutter SliverAppBar 随内容一起滑动的头部 - 滞留头部 ·
- Flutter CustomScrollView 自定义滚动效果 ·
- flutter MediaQuery · 获取屏幕宽度高度密度通知栏高度等屏幕信息
- Flutter Divider 分割线 · 分隔符是一条细线,通常用于对列表和布局中的内容进行分组。
- Flutter Scaffold ·
- Flutter MaterialApp ·
- Flutter DatePickers & TimePickers · Flutter 时间/日期选择器
- Flutter Offstage、Visibility隐藏/可见 ·
- Flutter InkWell水波纹效果 ·
- Flutter SnackBar 提示信息 · 显示提示信息的一个控件,类似Toast,会自动隐藏。
- Flutter Dismissible · 拖动小部件
- Flutter Accumulator · 累加器
- Flutter DragTarget · 接收拖拽Draggable部件
- Flutter Draggable · 拖动小部件
- Flutter ClipXxx · 裁剪系列
Flutter 常用布局
- Flutter Container 组件 · 容器、Container属性与特性
- Flutter Paddiing组件 · 内边距组件介绍
- Flutter Row 组件 · 行(水平布局) 组件介绍
- Flutter Column 组件 · 列(垂直布局) 组件介绍
- Flutter Expanded 组件 · 自适应填充、比例填充
- Flutter Stack 组件 · Stack层叠组件、tack与Align组合、Stack与Positioned组合定位布局
- Flutter Card 组件 · 可设定圆角和阴影的立体式卡片组件
- Flutter AspectRatio 组件 · 设定组件宽高比
- Flutter Wrap 组件 · 可以实现流布局(自动换行)的组件
- Flutter Table 表格 · Table 是一个表格布局组件
- Flutter DataTable数据表 ·
Flutter 页面路由
- Flutter 页面跳转 · Flutter中的普通路由、普通路由传值、命名路由、命名路由传值
- Flutter 路由替换(返回到根) · 替换路由、清除路由
- Flutter 页面返回传值 · 页面返回传值 (类似与Android里面的OnActivityForResult),接收页面返回数据
Flutter 导航
- Flutter AppBar 组件 · 介绍appBar、TabBar使用方法
- Flutter 通过TabController 定义TabBar · 监听TabBar与TabBarView的交互
- Flutter BottomNavigationBar 组件 · 底部导航条、以及实现页面切换、模仿XXApp的底部导航栏布局
扩展
- Toast Demo Flutter Overlay、OverlayState、OverlayEntry 叠加
- Flutter RefreshIndicator 下拉刷新
- Flutter Tween · 实现抖动效果
- VSCode Flutter 打包APK ·
Flutter Widget 目录
2019-09-16
未完待续…