Flutter核心技术与实战
陈航
美团点评高级技术专家
立即订阅
6150 人已学习
课程目录
已完结 47 讲
0/4登录后,你可以任选4讲全文学习。
课前必读 (3讲)
开篇词 | 为什么每一位大前端从业者都应该学习Flutter?
免费
01 | 预习篇 · 从0开始搭建Flutter工程环境
02 | 预习篇 · Dart语言概览
Flutter开发起步 (3讲)
03 | 深入理解跨平台方案的历史发展逻辑
04 | Flutter区别于其他方案的关键技术是什么?
05 | 从标准模板入手,体会Flutter代码是如何运行在原生系统上的
Dart语言基础 (3讲)
06 | 基础语法与类型变量:Dart是如何表示信息的?
07 | 函数、类与运算符:Dart是如何处理信息的?
08 | 综合案例:掌握Dart核心特性
Flutter基础 (13讲)
09 | Widget,构建Flutter界面的基石
10 | Widget中的State到底是什么?
11 | 提到生命周期,我们是在说什么?
12 | 经典控件(一):文本、图片和按钮在Flutter中怎么用?
13 | 经典控件(二):UITableView/ListView在Flutter中是什么?
14 | 经典布局:如何定义子控件在父容器中排版的位置?
15 | 组合与自绘,我该选用何种方式自定义Widget?
16 | 从夜间模式说起,如何定制不同风格的App主题?
17 | 依赖管理(一):图片、配置和字体在Flutter中怎么用?
18 | 依赖管理(二):第三方组件库在Flutter中要如何管理?
19 | 用户交互事件该如何响应?
20 | 关于跨组件传递数据,你只需要记住这三招
21 | 路由与导航,Flutter是这样实现页面切换的
Flutter进阶 (17讲)
22 | 如何构造炫酷的动画效果?
23 | 单线程模型怎么保证UI运行流畅?
24 | HTTP网络编程与JSON解析
25 | 本地存储与数据库的使用和优化
26 | 如何在Dart层兼容Android/iOS平台特定实现?(一)
27 | 如何在Dart层兼容Android/iOS平台特定实现?(二)
28 | 如何在原生应用中混编Flutter工程?
29 | 混合开发,该用何种方案管理导航栈?
30 | 为什么需要做状态管理,怎么做?
31 | 如何实现原生推送能力?
32 | 适配国际化,除了多语言我们还需要注意什么?
33 | 如何适配不同分辨率的手机屏幕?
34 | 如何理解Flutter的编译模式?
35 | Hot Reload是怎么做到的?
36 | 如何通过工具链优化开发调试效率?
37 | 如何检测并优化Flutter App的整体性能表现?
38 | 如何通过自动化测试提高交付质量?
Flutter综合应用 (6讲)
39 | 线上出现问题,该如何做好异常捕获与信息采集?
40 | 衡量Flutter App线上质量,我们需要关注这三个指标
41 | 组件化和平台化,该如何组织合理稳定的Flutter工程结构?
42 | 如何构建高效的Flutter App打包发布环境?
43 | 如何构建自己的Flutter混合开发框架(一)?
44 | 如何构建自己的Flutter混合开发框架(二)?
结束语 (1讲)
结束语 | 勿畏难,勿轻略
特别放送 (1讲)
特别放送 | 温故而知新,与你说说专栏的那些思考题
Flutter核心技术与实战
登录|注册

19 | 用户交互事件该如何响应?

陈航 2019-08-10
你好,我是陈航。今天,我和你分享的主题是,如何响应用户交互事件。
在前面两篇文章中,我和你一起学习了 Flutter 依赖的包管理机制。在 Flutter 中,包是包含了外部依赖的功能抽象。对于资源和工程代码依赖,我们采用包配置文件 pubspec.yaml 进行统一管理。
通过前面几个章节的学习,我们已经掌握了如何在 Flutter 中通过内部实现和外部依赖去实现自定义 UI,完善业务逻辑。但除了按钮和 ListView 这些动态的组件之外,我们还无法响应用户交互行为。那今天的分享中,我就着重与你讲述 Flutter 是如何监听和响应用户的手势操作的。
手势操作在 Flutter 中分为两类:
第一类是原始的指针事件(Pointer Event),即原生开发中常见的触摸事件,表示屏幕上触摸(或鼠标、手写笔)行为触发的位移行为;
第二类则是手势识别(Gesture Detector),表示多个原始指针事件的组合操作,如点击、双击、长按等,是指针事件的语义化封装。
接下来,我们先看一下原始的指针事件。

指针事件

指针事件表示用户交互的原始触摸数据,如手指接触屏幕 PointerDownEvent、手指在屏幕上移动 PointerMoveEvent、手指抬起 PointerUpEvent,以及触摸取消 PointerCancelEvent,这与原生系统的底层触摸事件抽象是一致的。
取消
完成
0/1000字
划线
笔记
复制
© 版权归极客邦科技所有,未经许可不得传播售卖。 页面已增加防盗追踪,如有侵权极客邦将依法追究其法律责任。
该试读文章来自付费专栏《Flutter核心技术与实战》,如需阅读全部文章,
请订阅文章所属专栏。
立即订阅
登录 后留言

精选留言(7)

  • 许童童
    对于一个父容器中存在按钮 FlatButton 的界面,在父容器使用 GestureDetector 监听了 onTap 事件的情况下,如果我们点击按钮,父容器的点击事件会被识别吗,为什么?
    不会被识别,因为按钮有默认的点击监听事件,监听到点击事件后,不会再向上冒泡。

    如果监听的是 onDoubleTap 事件,在按钮上双击,父容器的双击事件会被识别吗,为什么?
    会被识别,因为按钮没有默认的双击监听事件。

    作者回复: 赞

    2019-08-10
    1
    10
  • 竹之同学
    前面说到指针事件有类似于浏览器一样的冒泡机制,事件会从这个最内层的组件开始,沿着组件树向根节点向上冒泡;后面又说到如果父子 widget 都用 GestureDetector 监听了同样的事件的话,只会用竞技场去响应一个,这两者是不是矛盾的?

    作者回复: 注意,冒泡是指原始的指针事件,手势竞技场是针对封装后的高级手势识别

    2019-08-13
    1
  • 菜头
    API 没有找到 RotateGestureRecognizer

    作者回复: 试试ScaleGestureRecognizer

    2019-11-18
  • zzz
    请问下 如何添加自定义的手势 比如连续点击三次?

    作者回复: 用原始指针事件监听就可以了,设定手势判定规则

    2019-11-04
  • 浣熊特工队
    老师,我把ListView、ExpansionTile两个结合起来用发现一个bug不知道什么原因造成的:在滑动列表的时候,展开的ExpansionTile都被折叠起来了,请问怎么解决这个问题啊。。

    作者回复: 看一下是不是手势有冲突

    2019-10-16
  • Zxt
    请教下,如何在子wiget中向父(owner) wiget传递参数,调用方法,好比代理模式。 例如: 父wiget在build方法里在Container的child中构造了一个继承自statefulwiget的子wiget,我如何在子wiget类里调用onwer类中的方法?

    作者回复: 通过让父子Widget共享controller机制实现

    2019-08-28
    1
  • 神经蛙
    “使用 Listener 监听原始指针事件,并在状态改变时把信息同步给所有的手势识别器,然后这些首饰会在竞技场决定最后哪个手势来响应用户事件”
    这句话意思是不是说明,处理多个手势时,响应用户事件的手势具有不确定性,最后到底哪个手势会相应无法估测?

    作者回复: 会根据用户交互的位置、加速度、方向等因子综合判断当前需要以哪个手势去响应,这是确定的;不确定的是如果你的交互存在二义性,而你需要识别的多个手势之间又非常相似(比如旋转和缩放),则最后到底哪个手势去响应需要综合PK一下。

    2019-08-11
收起评论
7
返回
顶部