import 'package:flutter/material.dart';
import 'package:flutter_app/pages/dismissed_page.dart'; class GestureAppPage extends StatefulWidget {
@override
State<StatefulWidget> createState() {
// TODO: implement createState
return new _GestureAppPageState();
}
} class _GestureAppPageState extends State<GestureAppPage> { var tapEvent = ''; // _showSnakeBar(String str) {
// final snackBar = new SnackBar(content: new Text(str));
// Scaffold.of(context).showSnackBar(snackBar);
// } @override
Widget build(BuildContext context) {
// TODO: implement build
return new Scaffold(
appBar: new AppBar(
title: new Text('Gesture 学习'),
centerTitle: true,
),
body: new ListView(
children: <Widget>[
new Padding(
padding: const EdgeInsets.only(left: 10.0, top: 10.0, right: 10.0),
child: new RaisedButton(
textColor: Colors.black,
child: new Text('RaisedButton 点击'),
onPressed: () {
final snackBar = new SnackBar(content: new Text("这是一个 RaisedButton 点击事件,onPressed处理"));
Scaffold.of(context).showSnackBar(snackBar);
// _showSnakeBar("这是一个 RaisedButton 点击事件,onPressed处理");
}),
),
new Padding(
padding: const EdgeInsets.only(left: 10.0, top: 10.0, right: 10.0),
child: new GestureDetector(
onTap: () {
final snackBar = new SnackBar(content: new Text("这是一个GestureDetector监听的onTap事件"));
Scaffold.of(context).showSnackBar(snackBar);
// _showSnakeBar("这是一个GestureDetector监听的onTap事件");
},
child: new BorderButton('GestureDetector onTap 按钮'),
),
),
new Padding(
padding: const EdgeInsets.only(left: 10.0, top: 10.0, right: 10.0),
child:
new Text(tapEvent, style: Theme.of(context).textTheme.display1),
),
new Padding(
padding: const EdgeInsets.only(left: 10.0, top: 10.0, right: 10.0),
child: new GestureDetector(
onTapDown: (tapDown) {
setState(() {
tapEvent = '这是GestureDetector监听的onTapDown事件';
});
},
onTapUp: (tapUp) {
setState(() {
tapEvent = '这是GestureDetector监听的onTapUp事件';
});
},
onTapCancel: () {
setState(() {
tapEvent = '这是GestureDetector监听的onTapCancel事件';
});
},
onDoubleTap: () {
setState(() {
tapEvent = '这是GestureDetector监听的onDoubleTap事件';
});
},
onLongPress: () {
setState(() {
tapEvent = '这是GestureDetector监听的onLongPress事件';
});
},
child: new BorderButton('GestureDetector onTap 分解事件按钮'),
),
),
new Padding(
padding: const EdgeInsets.only(left: 10.0, top: 10.0, right: 10.0),
child: new Text('上面的按钮通过GestureDetector监听事件后,涟漪效果消失了,使用下面的方案解决'),
),
new Padding(
padding:
const EdgeInsets.only(left: 10.0, top: 10.0, right: 10.0),
child: new InkWell(
borderRadius: new BorderRadius.all(new Radius.circular(10.0)),
onTap: () {
final snackBar = new SnackBar(content: new Text("这是一个InkWell监听的onTap事件"));
Scaffold.of(context).showSnackBar(snackBar);
// _showSnakeBar("这是一个InkWell监听的onTap事件");
},
child: new BorderButton('InkWell 按钮'),
)),
new Padding(
padding:
const EdgeInsets.only(left: 10.0, top: 10.0, right: 10.0),
child: new InkWell(
borderRadius: new BorderRadius.all(new Radius.circular(10.0)),
onTap: () {
Navigator.of(context).push(new MaterialPageRoute(builder: (context)=> new DismissedPage()));
}, child: new BorderButton('Dismissed 手势'),
)),
],
),
);
}
} class BorderButton extends StatelessWidget {
final String text; BorderButton(this.text); @override
Widget build(BuildContext context) {
// TODO: implement build
return new Container(
alignment: Alignment.center,
padding: const EdgeInsets.only(
left: 10.0, top: 10.0, right: 10.0, bottom: 10.0),
height: 48.0,
decoration: new BoxDecoration(
border: new Border.all(
width: 1.0,
color: Colors.blue,
),
borderRadius: new BorderRadius.all(new Radius.circular(10.0)),
),
// foregroundDecoration: new BoxDecoration(
// border: new Border.all(
// width: 1.0,
// color: Colors.red,
// ),
// borderRadius: new BorderRadius.all(new Radius.circular(10.0)),
// ),
child: new Text(text),
);
}
} class GesturePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
// TODO: implement build
return new Scaffold(
body: new GestureAppPage(),
);
}
}

flutter手势的更多相关文章

  1. Flutter交互实战-即刻App探索页下拉&拖拽效果

    前言 Flutter最近比较热门,但是Flutter成体系的文章并不多,前期避免不了踩坑:我这篇文章主要介绍如何使用Flutter实现一个比较复杂的手势交互,顺便分享一下我在使用Flutter过程中遇 ...

  2. 开年巨制!千人千面回放技术让你“看到”Flutter用户侧问题

    导语 发布app后,开发者最头疼的问题就是如何解决交付后的用户侧问题的还原和定位,是业界缺乏一整套系统的解决方案的空白领域,闲鱼技术团队结合自己业务痛点在flutter上提出一套全新的技术思路解决这个 ...

  3. Flutter资源

    目录 文章 一开始 HOWTO文档 网站/博客 高级 视频 组件 演示 UI 材料设计 图片 地图 图表 导航 验证 文字和富文本 分析.流量统计 自动构建 风格样式 媒体 音频 视频 语音 存储 获 ...

  4. 从零学习Fluter(五):Flutter中手势滑动拖动已经网络请求

    从六号开始搞Flutter,到今天写这篇blog已经过了4天时间,文档初步浏览了一遍,写下了这个demo.demo源码分享在github上,现在对flutter有种说不出的喜欢了.大家一起搞吧! 废话 ...

  5. Flutter进阶—点击、拖动和其他手势

    Flutter中的手势系统有两个层次.第一层具有原始指针事件,其描述了穿过屏幕的指针(例如触摸.鼠标和触控笔)的位置和移动.第二层具有手势,其描述由一个或多个指针移动组成的语义动作. 指针指针代表用户 ...

  6. flutter系列之:移动端的手势基础GestureDetector

    目录 简介 Pointers和Listener GestureDetector 手势冲突 总结 简介 移动的和PC端有什么不同呢?同样的H5可以运行在APP端,也可以运行在PC端.两者最大的区别就是移 ...

  7. 【译】使用 Flutter 实现跨平台移动端开发

    作者: Mike Bluestein   | 原文地址:[https://www.smashingmagazine.com/2018/06/google-flutter-mobile-developm ...

  8. 在Flutter中嵌入Native组件的正确姿势是...

    引言 在漫长的从Native向Flutter过渡的混合工程时期,要想平滑地过渡,在Flutter中使用Native中较为完善的控件会是一个很好的选择.本文希望向大家介绍AndroidView的使用方式 ...

  9. Android程序员的Flutter学习笔记

    作为忠实与较资深的Android汪, 最近抽出了一些时间研究了一下Google的亲儿子Flutter, 尚属皮毛, 只能算是个简单的记录吧. Google自2017年第一次提出Flutter, 到20 ...

随机推荐

  1. homebrew一直处于updating状态

    vim ~/.bash_profile 增加一行 export HOMEBREW_NO_AUTO_UPDATE=true 之后再source一下

  2. java容器二:List接口实现类源码分析

    一.ArrayList 1.存储结构 动态数组elementData transient Object[] elementData; 除此之外还有一些数据 //默认初始容量 private stati ...

  3. CentOS7怎样安装Nginx1.12.2

    通过nginx官网的源码安装 yum -y install gcc* openssl* pcre* zlib* 安装相关依赖 这一步很重要 不然会报乱七八糟的错误 cd /usr/local进入/us ...

  4. 使用Numpy的矩阵来实现神经网络

    要是书都讲得这么细致, AI也不会那么难学啦. import numpy as np # sigmoid作为隐藏层的激活函数 def sigmoid(x): return 1 / (1 + np.ex ...

  5. selenium常用的API(三)获取网页title、html源码

    获取网页title 获取页面title的方法可以直接用driver.title获取到,然后可以把获取到的结果用做断言. #encoding=utf-8 from selenium import web ...

  6. 安装 uwsgi报错解决

    背景: 安装 uwsgi时报错如下,查阅相关资料说是 python-devel的问题,于是安装之后python-devel后问题解决 报错如下: (venv) [xxxxxxx]# pip insta ...

  7. 错误信息: The server cannot or will not process the request due to something that is perceived to be a client error

    错误原因:在提交的表单中有 date 类型的数据,也就是不能传输日期类型的数据. 嗯!我知道,去吧!

  8. 开放API接口安全处理

    一.开放API接口定义 顾名思义,开放出来给其他人调用的API接口就是开放API接口.例如,短信接口.邮件接口. 二.开放API的弱点 数据窃取 用户的密码等信息被不轨之人窃取,登录账号发布敏感信息, ...

  9. Arrays.asList 存在的坑

    引语: 阿里巴巴java开发规范说到使用工具类Arrays.asList()方法把数组转换成集合时,不能使用其修改集合相关的方法,它的add/remove/clear方法会抛出UnsupportedO ...

  10. Zabbix 邮件报警示例

     Zabbix 邮件报警示例: 1.编辑 mail.rc 文件添加默认的邮箱配置 # vi /etc/mail.rc set from=1234567@qq.com set smtp=smtp.qq. ...