/**
* @author zhousg
* @Date 2016-02-04
* @Method 滑动方法 针对一个大容器内部的容器做滑动封装
* @param
* args args.swipeDom 大容器对象
* args.swipeType 滑动类型
* args.swipeDistance 缓冲距离
* 注意:子容器的高宽度是取的内容的高宽 所以padding的大小有影响
*/
if(!window.lcf){
window.lcf = {};
}
lcf.iScroll = function(args){
/*调用的时候没有初始化的话就是初始化一次*/
if(!(this instanceof arguments.callee)) return new arguments.callee(args);
this.init(args);
};
lcf.iScroll.prototype = {
constructor:lcf.iScroll,
init:function(args){
/*局部变量来接受当前的this*/
var that = this;
/*如果传入的对象是一个Dom对象就把他看作是我们的大容器盒子*/
if(args.swipeDom && typeof args.swipeDom == 'object'){
that.parentDom = args.swipeDom;
}
/*如果不存在父容器就停止初始化*/
if(!that.parentDom) return false;
/*找到子容器*/
that.childDom = that.parentDom.children&&that.parentDom.children[0]?that.parentDom.children[0]:'';
/*如果不存在子容器就停止初始化*/
if(!that.childDom) return false;
/*初始化传入的参数*/
that.settings = {};
/*默认类型 默认的Y轴滑动 如果不是y的话就是以x轴开始滑动*/
that.settings.swipeType = args.swipeType?args.swipeType:'y';
/*默认的缓冲滑动距离*/
that.settings.swipeDistance = args.swipeDistance>=0?args.swipeDistance:150;
/*初始化滑动*/
that._scroll();
},
/*对外开放的设置定位的方法*/
setTranslate:function(translate){
this.currPostion = translate;
this._addTransition();
this._changeTranslate(this.currPostion);
},
_addTransition:function(){
this.childDom.style.transition = "all .2s ease";
this.childDom.style.webkitTransition = "all .2s ease";/*兼容 老版本webkit内核浏览器*/
},
_removeTransition:function(){
this.childDom.style.transition = "none";
this.childDom.style.webkitTransition = "none";/*兼容 老版本webkit内核浏览器*/
},
_changeTranslate:function(translate){
if(this.settings.swipeType == 'y'){
this.childDom.style.transform = "translateY("+translate+"px)";
this.childDom.style.webkitTransform = "translateY("+translate+"px)";
}else{
this.childDom.style.transform = "translateX("+translate+"px)";
this.childDom.style.webkitTransform = "translateX("+translate+"px)";
}
},
_scroll:function(){
/*局部变量来接受当前的this*/
var that = this;
/*滑动的类型*/
var type = that.settings.swipeType == 'y'?true:false;
/*父容器的高度或宽度*/
var parentHeight = type?that.parentDom.offsetHeight:that.parentDom.offsetWidth;
/*子容器的高度或宽度*/
var childHeight = type?that.childDom.offsetHeight:that.childDom.offsetWidth; /*子容器没有父容器大的时候*/
if(childHeight < parentHeight){
if(type){
that.childDom.style.height = parentHeight + 'px';
childHeight = parentHeight;
}else{
that.childDom.style.width = parentHeight + 'px';
childHeight = parentHeight;
}
} /*缓冲距离*/
var distance = that.settings.swipeDistance;
/*区间*/
/*左侧盒子定位的区间*/
that.maxPostion = 0;
that.minPostion = -(childHeight-parentHeight);
/*设置滑动的当前位置*/
that.currPostion = 0;
that.startPostion = 0;
that.endPostion = 0;
that.movePostion = 0;
/*1.滑动*/
that.childDom.addEventListener('touchstart',function(e){
/*初始的Y的坐标*/
that.startPostion = type?e.touches[0].clientY: e.touches[0].clientX;
},false);
that.childDom.addEventListener('touchmove',function(e){
e.preventDefault();
/*不停的做滑动的时候记录的endY的值*/
that.endPostion = type?e.touches[0].clientY: e.touches[0].clientX;
that.movePostion = that.startPostion - that.endPostion;/*计算了移动的距离*/ /*2.滑动区间*/
/*就是滑动区间*/
if((that.currPostion-that.movePostion)<(that.maxPostion+distance)
&&
(that.currPostion-that.movePostion)>(that.minPostion -distance)){
that._removeTransition();
that._changeTranslate(that.currPostion-that.movePostion);
}
},false);
window.addEventListener('touchend',function(e){
/*在限制滑动区间之后 重新计算当前定位*/
/*判断是否在我们的合理定位区间内*/
/*先向下滑动 */
if((that.currPostion-that.movePostion) > that.maxPostion){
that.currPostion = that.maxPostion;
that._addTransition();
that._changeTranslate(that.currPostion);
}
/*想上滑动的时候*/
else if((that.currPostion-that.movePostion) < that.minPostion){
that.currPostion = that.minPostion;
that._addTransition();
that._changeTranslate(that.currPostion);
}
/*正常的情况*/
else{
that.currPostion = that.currPostion-that.movePostion;
}
that._reset();
},false); },
_reset:function(){
var that = this;
that.startPostion = 0;
that.endPostion = 0;
that.movePostion = 0;
}
};

  

swipe方法的更多相关文章

  1. 【Airtest】Airtest中swipe方法兼容不同分辨率的解决方法

    使用Airtest中swipe方法由于不同分辨率的手机上滑动的坐标位置不同,所以想要兼容所有的手机,仅仅靠固定坐标就会出现问题 想要兼容所有的手机,可以按照如下思路进行 1.首先获取手机的分辨率,可以 ...

  2. appium 中swipe()方法向左滑动时

    应该在UI Automator Viewer中读取到的例如ImageView [180,600][900,1320],如果要左滑,代码中应该是写为driver.swipe(900,1320,180,6 ...

  3. Appium处理滑动方法是swipe

    滑动API:Swipe(int start x,int start y,int end x,int y,duration) 解释: int start x-开始滑动的x坐标:int start y - ...

  4. bootstrap之Swipe

    Swipe 我定义为滑动,但它字面的意思又不是,事件的形式类似于小时候拿着一块石头片,朝水面飞过去,假设你手法能够那么就是swipe走的路线,假设你手法不行,接触水面的时候就没再飞起来那就会被人嘲笑的 ...

  5. python3+Appium自动化07-滑动操作以及滑动方法封装

    滑动解析 滑动主要分为:水平滑动.垂直滑动.任意方向滑动 滑动轨迹 在Appium中模拟用户滑动操作需要使用swipe方法,该方法定义如下: def swipe(self, start_x, star ...

  6. Appium swipe实现屏幕滑动

    在 Appium 中提供 swipe() 方法来模拟用户滑动屏幕. swipe() 实现过程 是先通过在屏幕上标记两个坐标,然后再从开始坐标移动到结束坐标. 先看下 swipe 方法定义: def s ...

  7. Appium java-client库更新到6.x ,TouchAction类中弃用的函数及替代方法

    新版本的java-client已经取消swipe方法,很多TouchAction类中的很多老方法也都已经弃用,具体可以参考这边的官方说明文档: https://static.javadoc.io/io ...

  8. python+Appium自动化:app滑动操作swipe

    swipe Appium使用滑动操作用到了swipe方法,定义如下: swipe(self, start_x, start_y, end_x, end_y, duration=None) 从一个点滑动 ...

  9. Python+Appium自动化测试(8)-swipe()滑动页面

    app自动化测试过程中,经常会遇到滑动屏幕操作,appium框架的话我们可以使用webdriver提供的swipe()方法来对屏幕页面进行上滑.下滑.左滑.右滑操作. 一,swipe方法介绍 swip ...

随机推荐

  1. EasyUI Combotree 只允许选择 叶子节点

    $("#SDID").combotree({ url: '/Ajax/GetDeptTree.aspx?level=4&pid=-1', onSelect: functio ...

  2. GroundworkCSS ♥ Tables

    微信公众平台开发(41)一键关注微信公众平台账号 - 方倍工作室 - 博客园 微信公众平台开发(41)一键关注微信公众平台账号 GroundworkCSS ♥ Tables Example Layou ...

  3. C语言 EOF是什么?

    Linux中,在新的一行的开头,按下Ctrl-D,就代表EOF(如果在一行的中间按下Ctrl-D,则表示输出"标准输入"的缓存区,所以这时必须按两次Ctrl-D):Windows中 ...

  4. 解决的方法:warning: Clock skew detected. Your build may be incomplete.

    因为时钟同步问题.出现 warning:  Clock skew detected.  Your build may be incomplete.这种警告, 解决的方法: find . -type f ...

  5. UVA 1623 Enter The Dragon

    题意: 一只龙,在每个不下雨的日子都可以喝干一个湖里的水,当湖满时,再向这个湖里下雨就会溢出.给出下雨的顺序,求龙喝水的序列. 分析: 记录每个湖上次满水的日子,和不下雨的日子.下雨时,查找当前湖上次 ...

  6. SQL常用日期函数

    原文:http://www.cnblogs.com/coconut_zhang/archive/2009/02/02/1382598.html 1. 当前系统日期.时间 select getdate( ...

  7. JS参数使用带参数的方法

    大家都知道,在JS之中,一个变量的生命周期不是以大括号为界限的,所以即使是使用在循环或判断中的变量,外部也可以使用.可如果我们在循环或变量中使用了方法,而且这个方法使用了循环中的变量,那么后面的代码是 ...

  8. php汉字转Unicode编码函数

    /** * $str 原始字符串 * $encoding 原始字符串的编码,默认GBK * $prefix 编码后的前缀,默认"&#" * $postfix 编码后的后缀, ...

  9. not valid for Running the scheme

    The run destination iPhone6 Plus is not valid for Running the scheme 'MyApp’. Phone6 Plus's iOS 8.0 ...

  10. c语言字符串翻转系列

    2013-10-25 最近碰到一道笔试题,是关于字符串翻转的.题目是:将一段英文翻转,但保留单词拼写,如给定字符串str="I am a student",返回为"stu ...