ionic 手势事件

ionic 手势事件

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

$ionicGesture

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

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元素。


ionic 头部和底部

ion-header-bar

这个是固定在屏幕顶部的一个头部标题栏。如果给它加上'bar-subheader' 这个样式,它就是副标题。

用法
 
  

Title!

Some content!
API
属性 类型 描述
align-title(optional) string 这个是对齐 title 的。如果没有设置,它将会按照手机的默认排版(Ios的默认是居中,Android默认是居左)。它的值可以是 'left','center','right'。
no-tap-scroll(optional) boolean 默认情况下,头部标题栏在点击屏幕时内容会滚动到头部,可以将 no-tap-scroll 设置为 true 来禁止该动作。。它的值是布尔值(true/false)。
ion-footer-bar

知道了 ion-header-bar ,理解ion-footer-bar就轻松多啦!只是 ion-footer-bar 是在屏幕的底部。

用法
 
  Some content!


 
  

Title!

API

与 ion-header-bar 不同的是,ion-footer-bar 只有 align-title 这个 API。

属性 类型 描述
align-title(optional) string 这个是对齐 title 的。如果没有设置,它将会按照手机的默认排版(Ios的默认是居中,Android默认是居左)。它的值可以是 'left','center','right'。

你可能感兴趣的:(ionic 手势事件)