欢迎光临
梦想从学习开始!

ionic 手势事件 | 小熊教程

ionic 手势事件

Tips:您正在学习的是ionic 手势事件 | 小熊教程系列。本文链接https://www.xxfxb.com/?p=8712 ,您可通过标签查询系列课程。祝您学习愉快!

事件 描述 用法 实例
on-hold 长按的时间是500毫秒。
 <button      on-hold="onHold()"      class="button">     Test     </button> 
尝试一下 »
on-tap 这个是手势轻击事件,如果长按时间超过250毫秒,那就不是轻击了。。
 <button      on-tap="onTap()"      class="button">     Test     </button>
尝试一下 »
on-double-tap 手双击屏幕事件
 <button      on-double-tap="onDoubleTap()"      class="button">     Test     </button>
尝试一下 »
on-touch 这个和 on-tap 还是有区别的,这个是立即执行,而且是用户点击立马执行。不用等待 touchend/mouseup 。
     <button on-touch="onTouch()"      class="button">     Test     </button>
尝试一下 »
on-release 当用户结束触摸事件时触发。
 <button      on-release="onRelease()"      class="button">     Test </button>
尝试一下 »
on-drag 这个有点类似于PC端的拖拽。当你一直点击某个物体,并且手开始移动,都会触发 on-drag。
 <button      on-drag="onDrag()"      class="button">     Test </button>
尝试一下 »
on-drag-up 向上拖拽。
 <button      on-drag-up="onDragUp()"      class="button">     Test </button> 
尝试一下 »
on-drag-right 向右拖拽。
 <button      on-drag-right="onDragRight()"      class="button">     Test </button>
尝试一下 »
on-drag-down 向下拖拽。
 <button      on-drag-down="onDragDown()"      class="button">     Test </button>
尝试一下 »
on-drag-left 向左边拖拽。
 <button      on-drag-left="onDragLeft()"      class="button">     Test </button>
尝试一下 »
on-swipe 指手指滑动效果,可以是任何方向上的。而且也和 on-drag 类似,都有四个方向上单独的事件。
 <button      on-swipe="onSwipe()"      class="button">     Test </button>
尝试一下 »
on-swipe-up 向上的手指滑动效果。
 <button      on-swipe-up="onSwipeUp()"      class="button">     Test </button>
尝试一下 »
on-swipe-right 向右的手指滑动效果。
 <button      on-swipe-right="onSwipeRight()"      class="button">     Test </button>
尝试一下 »
on-swipe-down 向下的手指滑动效果。
<button     on-swipe-down="onSwipeDown()"     class="button">     Test </button>
尝试一下 »
on-swipe-left 向左的手指滑动效果。
<button      on-swipe-left="onSwipeLeft()"     class="button">     Test </button>
尝试一下 »

$ionicGesture

一个angular服务展示ionicionic.EventController手势。

方法

Tips:您正在学习的是ionic 手势事件 | 小熊教程系列。本文链接https://www.xxfxb.com/?p=8712 ,您可通过标签查询系列课程。小熊分享邦(www.xxfxb.com)祝您学习愉快!

 on(eventType, callback, $element)

在一个元素上添加一个事件监听器。

参数 类型 详情
eventType string

监听的手势事件。

callback function(e)

当手势事件发生时触发的事件。

$element element

angular元素监听的事件。

options object

对象。

 off(eventType, callback, $element)

在一个元素上移除一个手势事件监听器。

参数 类型 详情
eventType string

移除监听的手势事件。

callback function(e)

移除监听器。

$element element

被监听事件的angular元素。

赞(0) 打赏
未经允许不得转载:小熊分享邦 » ionic 手势事件 | 小熊教程

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏