- 博客(29)
- 资源 (5)
- 收藏
- 关注
RSS订阅原创 【Flutter】三十六、Flutter解决点击非输入框时关闭键盘问题及TextFormField焦点切换问题
FocusNode blankNode = FocusNode();...Widget build () { reutrn GestureDetector( onTap: () { FocusScope.of(context).requestFocus(blankNode); }, ... );}
2019-10-31 22:23:25
5243
3
原创 【Flutter】三十四、Flutter常用组件——Tab导航栏
在Flutter中完成一个导航栏有两种方式：一种是通过DefaultTabController，另一种是通过TabController:一、使用DefaultTabControllerimport 'package:flutter/material.dart';class TabDemo extends StatelessWidget { @override Widget buil...
2019-10-29 18:58:21
1807
原创 【Flutter】三十二、Flutter分离路由配置
上篇文章中的路由配置是直接配置在main.dart中，为了降低代码的耦合度，下面将路由配置分离出来。Routes.dartimport 'package:flutter/material.dart';import 'package:flutterdemo/route_pages/BottomNav.dart';import 'package:flutterdemo/route_pa...
2019-10-28 21:27:16
320
原创 【Flutter】二十九、Flutter通知—— Notification
一、使用NotificationListener监听滚动进度二、使用自定义通知Notification可以实现将数据从子组件向父组件传递，与InheritedWidget的传递方向正好相反。一、使用NotificationListener监听滚动进度 Flutter中很多地方使用了通知，如可滚动(Scrollable) Widget中滑动时就会分发ScrollNotificati...
2019-10-26 15:30:08
3934
原创 【Flutter】二十七、控制Widget显示及隐藏——Offstage、Visibility
Flutter中的Offstage与Visibility都可以将子widget进行隐藏，不同的是Visibility可以设置隐藏之后是否还占据原来的控件、设置隐藏后是否响应事件，Offstage隐藏后之前所占的空间就会消失。一、Offstage Offstage中控制显示隐藏的重要属性是offstage，默认为true。当offstage 为true时，其child控件是隐藏的。二...
2019-10-25 18:55:38
5464
原创 【Flutter】二十六、Flutter的手势识别—— GestureDetector
一、GestureDetector中的手势二、拖动在Flutter中使用GestureDetector可以来完成对手势的识别，包括长按、滑动、双击等手势。一、GestureDetector中的手势 下表是对GestureDetector中所有手势的说明。事件名说明onTapDown手指开始触摸屏幕触发onTapUp手指从屏幕抬起触发onTap...
2019-10-25 18:55:21
1656
原创 【Flutter】二十五、Flutter的事件处理
一、Listener二、behavior属性三、忽略PointerEvent Flutter中使用Listener来监听相关触摸事件，一次完整的事件包括：手指按下、手指滑动、手指离开。使用Listener可监听各个阶段的事件。一、ListenerListener({ Key key, ... this.onPointerDown, // 手指按下触发 ...
2019-10-24 21:29:33
837
原创 【Flutter】二十四、Flutter数据共享——InheritedWidget
Flutter中可以使用InheritedWidget进行共享数据，通过InheritedWidget共享的数据可以从Widget树中由上向下传递，而不能反向传递。下面使用InheritedWidget完成一个计数器的例子：一、创建共享数据class ShareDataWidget extends InheritedWidget{ int data; ShareDataWidg...
2019-10-24 13:08:11
470
原创 【Flutter】二十三、Flutter常用组件——抽屉(侧边栏)Drawer
一、Drawer构造器二、侧边栏的隐藏及显示 使用Scaffold控件的drawer和endDrawer可以实现左侧边栏及右侧边栏。侧边栏默认隐藏，可通过手指滑动或点击事件呼出侧边栏。一、Drawer构造器 Drawer构造器十分简单：Drawer({ Key key, this.elevation = 16.0, // 侧边阴影范围 this.chi...
2019-10-23 21:20:18
4447
1
原创 【cordova】混合APP开发——cordova配置
一、cordova安装npm install cordova -g // 需要安装node环境二、创建cordova项目cordova create myapp三、添加平台sudo cordova platform //查看可添加的平台输出:Installed platforms: //已安装0Available platforms:android ^8.0.0br...
2019-10-21 21:37:12
205
原创 【Flutter】二十二、Fultter功能组件——WillPopScope
为了避免用户误触返回按钮而导致APP退出，在很多APP中都拦截了用户点击返回键的按钮，当用户在某一个时间段内点击两次时，才会认为用户是要退出（而非误触）。Flutter中的WillPopScope就可以用来完成该功能。一、WillPopScope构造函数WillPopScope({ Key key, @required this.child, @required t...
2019-10-20 22:14:13
360
原创 【Flutter】二十一、Flutter中常用组件——底部导航BottomNavigationBar
用来创建底部导航。使用在Scaffold控件中bottomNavigationBar属性BottomNavigationBar属性说明BottomNavigationBar({ Key key, @required this.items, // BottomNavigationBarItem控件组 this.onTap, // 点击事件 this.curre...
2019-10-20 18:09:08
410
原创 【Flutter】二十、Flutter中常用组件—— CustomScrollView
一、CustomScrollView二、Sliver2.1 SliverAppBar一、CustomScrollViewCustomScrollView是可以使用sliver自定义滚动模型（效果）的widget。其中sliver包括SliverList、SliverFixedExtentList、SliverGrid、SliverPadding、SliverAppBar，对于大多数Sliv...
2019-10-16 08:47:18
2367
原创 【Flutter】十九、Flutter中常用组件——滚动组件SingleChildScrollView
一、SingleChildScrollView像Row、Column、Flex等有些widget是无法进行滚动的，一旦子控件超出父控件的范围，flutter会发出警告，屏幕会有黄黑色条纹出现，这时我们可以使用滚动控件来进行处理。 如下是一个Column控件，它包含了20个Container控件，此时children的高度超出了Container高度，屏幕下方出现警告区域：impo...
2019-10-15 20:08:13
1421
原创 【Flutter】十八、Flutter中常用的布局容器——列表布局ListView、ListTile
一、ListView1.1 创建ListView的多种方式1.1.1 ListView()1.1.2 ListView.builder()1.1.3 ListView.separated()1.1.4 ListView.custom()二、ListTile2.1 ListTile属性说明三、下拉刷新列表实现一、ListView一个列表控件。ListView与GridView均继承自BoxS...
2019-10-15 15:18:07
3555
原创 【Flutter】十七、Flutter中常用的布局容器——网格布局GridView
一、使用GridView的多种方式1.1 GridView()1.2 GridView.count()1.3 GridView.builder()1.4 GridView.custom()1.5 GridView.extent()二、flutter_staggered_grid_view一、使用GridView的多种方式1.1 GridView()GridView({ Key ke...
2019-10-15 09:18:54
1867
原创 【Flutter】十六、AspectRatio、Card控件
一、AspectRatio1.1 AspectRatio属性说明二、Card2.1 Card属性说明一、AspectRatio设置child的宽高比。AspectRatio会在布局限制条件内尽可能的扩展。1.1 AspectRatio属性说明const AspectRatio({ Key key, @required this.aspectRatio, // 宽高比...
2019-10-13 20:33:45
355
原创 【Flutter】十五、Flutter中常用的布局容器——层叠组件Stack
一、Stack二、Stack结合Align、Positioned使用2.1 Stack与Align2.2 Stack与Positioned一、StackStack可用来对children进行层叠，children中越往后的组件在上面显示。构造函数Stack({ Key key, this.alignment = AlignmentDirectional.topStar...
2019-10-13 10:14:13
556
原创 【Flutter】十四、Flutter中常用的布局容器——流式布局Wrap、Flow
一、Wrap二、Flow一、Wrap熟悉flex布局的同学肯定知道flex布局会有wrap属性，就是换行，而Flex、Column、Row都是不可以换行的。那么如果我们需要换行怎么办呢？Flutte提供了Wrap来解决这一需求，Wrap与Flex具有相似的属性。构造函数Wrap({ Key key, this.direction = Axis.horizontal, ...
2019-10-12 15:53:41
502
原创 【Flutter】十三、Flutter中常用的布局容器——弹性布局Flex、Expanded
一、Flex1.1 构造函数二、Expanded 弹性布局允许子widget按照一定比例来分配父容器空间,Flutter中的弹性布局主要通过Flex和Expanded来配合实现。一、FlexFlex可沿着水平或竖直方向对widget进行布局。1.1 构造函数Flex({ Key key, @required this.direction, // 主轴方向：Ax...
2019-10-12 09:06:27
991
原创 【Flutter】十二、Flutter中常用的布局容器——Row、Column
【Flutter】十二、Flutter中常用的布局容器——Row、Column一、Row1.1 构造函数二、Column一、Row继承自Flex。可将children中的widget在水平方向上进行排列。与css的flex(flex-direction:row;)布局相似1.1 构造函数Row({ Key key, MainAxisAlignment mainAxisA...
2019-10-11 20:54:57
934
1
原创 【Flutter】十一、Flutter中常用的容器类
【Flutter】十一、Flutter中常用的容器类Flutter中的容器作用常常是用来包裹某个组件，所以都会有一个child属性，注意这里是child不是children，children属性是大部分布局类都有的属性。Flutter常用的容器类有：Center、Padding、Container、SizedBox、...
2019-10-11 11:06:23
3816
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人