一,概述

  Notification是Flutter中一个重要的机制,在Widget树中,每一个节点都可以分发通知,通知会沿着当前节点(context)向上传递,所有父节点都可以通过NotificationListener来监听通知,Flutter中称这种通知由子向父的传递为“通知冒泡”(Notification Bubbling),这个和用户触摸事件冒泡是相似的,但有一点不同:通知冒泡可以中止,但用户触摸事件不行。

  Flutter中很多地方使用了通知,如可滚动(Scrollable) Widget中滑动时就会分发ScrollNotification,而Scrollbar正是通过监听ScrollNotification来确定滚动条位置的。除了ScrollNotification,Flutter中还有SizeChangedLayoutNotification、KeepAliveNotification 、LayoutChangedNotification等。下面是一个监听Scrollable Widget滚动通知的例子:

NotificationListener(
onNotification: (notification){
//print(notification);
switch (notification.runtimeType){
case ScrollStartNotification: print("开始滚动"); break;
case ScrollUpdateNotification: print("正在滚动"); break;
case ScrollEndNotification: print("滚动停止"); break;
case OverscrollNotification: print("滚动到边界"); break;
}
},
child: ListView.builder(
itemCount: 100,
itemBuilder: (context, index) {
return ListTile(title: Text("$index"),);
}
),
);

上例中的滚动通知如ScrollStartNotification、ScrollUpdateNotification等都是继承自ScrollNotification类,不同类型的通知子类会包含不同的信息,比如ScrollUpdateNotification有一个scrollDelta属性,它记录了移动的位移,其它通知属性读者可以自己查看SDK文档。

二,自定义通知

除了Flutter内部通知,我们也可以自定义通知,下面我们看看如何实现自定义通知:

  • 定义一个通知类,要继承自Notification类;

    class TestNotification extends Notification {
    TestNotification({
    @required this.count,
    });
    final int count;
    }
  • 子节点发送通知。

    new RaisedButton(
    textColor: Colors.black,
    child: new Center(
    child: new Text('点击传递随机数给上层Widget'),
    ),
    onPressed: () {
    new TestNotification(count: new Random().nextInt(100)).dispatch(key.currentContext);
    })
  • 父节点使用NotificationListener进行监听子节点发出的通知,并作出响应
    new NotificationListener(
    onNotification: (TestNotification n) {
    scaffoldStateKey.currentState.showSnackBar(new SnackBar(content: new Text('随机数:${n.count}')));
    return true;
    },
    child: new TestAPage(
    key: key,
    ))

Notification有一个dispatch(context)方法,它是用于分发通知的,我们说过context实际上就是操作Element的一个接口,它与Element树上的节点是对应的,通知会从context对应的Element节点向上冒泡。

  • 示例
    下面我们看一个完整的例子:

    class NotificationRoute extends StatefulWidget {
    @override
    NotificationRouteState createState() {
    return new NotificationRouteState();
    }
    } class NotificationRouteState extends State<NotificationRoute> {
    String _msg="";
    @override
    Widget build(BuildContext context) {
    //监听通知
    return NotificationListener<MyNotification>(
    onNotification: (notification) {
    setState(() {
    _msg+=notification.msg+" ";
    });
    },
    child: Center(
    child: Column(
    mainAxisSize: MainAxisSize.min,
    children: <Widget>[
    // RaisedButton(
    // onPressed: () => MyNotification("Hi").dispatch(context),
    // child: Text("Send Notification"),
    // ),
    Builder(
    builder: (context) {
    return RaisedButton(
    //按钮点击时分发通知
    onPressed: () => MyNotification("Hi").dispatch(context),
    child: Text("Send Notification"),
    );
    },
    ),
    Text(_msg)
    ],
    ),
    ),
    );
    }
    } class MyNotification extends Notification {
    MyNotification(this.msg);
    final String msg;
    }

    上面代码中,我们每点一次按钮就会分发一个MyNotification类型的通知,我们在Widget根上监听通知,收到通知后我们将通知通过Text显示在屏幕上。

    注意:代码中注释的部分是不能正常工作的,因为这个context是根Context,而NotificationListener是监听的子树,所以我们通过Builder来构建RaisedButton,来获得按钮位置的context。

    运行效果如下:

【Flutter学习】事件处理与通知之通知(Notification)的更多相关文章

  1. Flutter学习笔记(35)--通知Notification

    如需转载,请注明出处:Flutter学习笔记(35)--通知Notification 通知的NotificationListener和我们之前写的事件的Listener一样,都是功能性的组件,而且也都 ...

  2. iOS上简单推送通知(Push Notification)的实现

    iOS上简单推送通知(Push Notification)的实现 根据这篇很好的教程(http://www.raywenderlich.com/3443/apple-push-notification ...

  3. Android - 隐藏最顶端的通知条(Top Notification Bar)

    隐藏最顶端的通知条(Top Notification Bar/ActionBar) 本文地址: http://blog.csdn.net/caroline_wendy Android中, 视频播放等功 ...

  4. 苹果推送通知服务Push Notification探究总结(序)

    刚才发了两篇几个月前写的文档,觉得太敷衍了,想了想,还是来一发实在的. 再者,刚好上周研究了苹果的推送通知服务Push Notification,还是很有心得的,赶紧趁热打铁,记录一下,望与大家谈论下 ...

  5. android wear开发:为可穿戴设备创建一个通知 - Creating a Notification for Wearables

    注:本文内容来自:https://developer.android.com/training/wearables/notifications/creating.html 翻译水平有限,如有疏漏,欢迎 ...

  6. 微软Azure通知中心 (Azure Notification Hubs)

    Azure Notification Hubs 提供简单的方法从后台(azure或者on-promise)去发送通知在不同的平台上面(iOS, Android, Windows, Kindle, Ba ...

  7. WP8.1学习系列(第二章)——Toast通知

    Toast 通知概述(Windows 运行时应用) 你的应用要想通过 Toast 通知通信,必须在应用的清单文件中声明它支持 Toast.Toast 通知可包含文本,并且 Windows 上的 Toa ...

  8. Java多线程学习(四)等待/通知(wait/notify)机制

    转载请备注地址:https://blog.csdn.net/qq_34337272/article/details/79690279 系列文章传送门: Java多线程学习(一)Java多线程入门 Ja ...

  9. 【WPF】右下角弹出自定义通知样式(Notification)——简单教程

    原文:[WPF]右下角弹出自定义通知样式(Notification)--简单教程 1.先看效果 2.实现 1.主界面是MainWindow 上面就只摆放一个Button即可.在Button的点击事件中 ...

随机推荐

  1. hdu1166:敌兵布阵(树状数组或线段树)

    题目描述: 一堆废话不用看...... 输入: 第一行一个整数T,表示有T组数据.每组数据第一行一个正整数N(N<=50000),表示敌人有N个工兵营地,接下来有N个正整数,第i个正整数ai代表 ...

  2. visual studio code的使用

    1.添加代码片段 参考:https://blog.csdn.net/qq_36370731/article/details/83014439 2.在vscode上运行Git 先打开vscode内置的G ...

  3. webpack对icon-font图片的处理

    一.对图片的处理 安装url-loader 然后再loaderli配置这样会把图片打包成base64格式 { test: /\.(gif|png|jpg)\??.*$/, loader: 'url-l ...

  4. BZOJ 3687: 简单题(dp+bitset)

    传送门 解题思路 设\(f(i)\)表示和为\(i\)时的方案数,那么转移方程为\(f(i)+=f(i-x)\),\(x\)为当前枚举到的数字,这样做是\(O(n\sum a_i)\)的,考虑优化.发 ...

  5. [CSP-S模拟测试]:Star Way To Heaven(最小生成树Prim)

    题目描述 小$w$伤心的走上了$Star\ way\ to\ heaven$. 到天堂的道路是一个笛卡尔坐标系上一个$n\times m$的长方形通道(顶点在$(0,0)$和$(n,m)$),小$w$ ...

  6. python实现计时器(装饰器)

    1.写一个装饰器,查看函数执行的时间 import time # 装饰器run_time,@run_time加在谁头上,谁就是参数fundef run_time(fun): start_time = ...

  7. Spring Boot学习一之Spring Beans和依赖注入

    你可以自由地使用任何标准的Spring框架技术去定义beans和它们注入的依赖.简单起见,我们经常使用 @ComponentScan 注解搜索beans,并结合 @Autowired 构造器注入. 如 ...

  8. ceph-cluster map

    知道cluster topology,是因为这5种cluster map. ====================================== 知道cluster topology,是因为这 ...

  9. 用 Flask 来写个轻博客 (29) — 使用 Flask-Admin 实现后台管理 SQLAlchemy

    目录 目录 前文列表 扩展阅读 Flask-Admin BaseView 基础管理页面 ModelView 实现效果 前文列表 用 Flask 来写个轻博客 (1) - 创建项目 用 Flask 来写 ...

  10. python打开文件失败,报错'gbk' codec can't decode byte 0xbf in position 2: illegal multibyte sequence

    python3.7,python3.6都存在的问题: 读取的文件编码是utf-8 第1行是空行.#开头都可能会报这个错误: E:\count_packet>python string_count ...