swipe方法
/**
* @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方法的更多相关文章
- 【Airtest】Airtest中swipe方法兼容不同分辨率的解决方法
使用Airtest中swipe方法由于不同分辨率的手机上滑动的坐标位置不同,所以想要兼容所有的手机,仅仅靠固定坐标就会出现问题 想要兼容所有的手机,可以按照如下思路进行 1.首先获取手机的分辨率,可以 ...
- appium 中swipe()方法向左滑动时
应该在UI Automator Viewer中读取到的例如ImageView [180,600][900,1320],如果要左滑,代码中应该是写为driver.swipe(900,1320,180,6 ...
- Appium处理滑动方法是swipe
滑动API:Swipe(int start x,int start y,int end x,int y,duration) 解释: int start x-开始滑动的x坐标:int start y - ...
- bootstrap之Swipe
Swipe 我定义为滑动,但它字面的意思又不是,事件的形式类似于小时候拿着一块石头片,朝水面飞过去,假设你手法能够那么就是swipe走的路线,假设你手法不行,接触水面的时候就没再飞起来那就会被人嘲笑的 ...
- python3+Appium自动化07-滑动操作以及滑动方法封装
滑动解析 滑动主要分为:水平滑动.垂直滑动.任意方向滑动 滑动轨迹 在Appium中模拟用户滑动操作需要使用swipe方法,该方法定义如下: def swipe(self, start_x, star ...
- Appium swipe实现屏幕滑动
在 Appium 中提供 swipe() 方法来模拟用户滑动屏幕. swipe() 实现过程 是先通过在屏幕上标记两个坐标,然后再从开始坐标移动到结束坐标. 先看下 swipe 方法定义: def s ...
- Appium java-client库更新到6.x ,TouchAction类中弃用的函数及替代方法
新版本的java-client已经取消swipe方法,很多TouchAction类中的很多老方法也都已经弃用,具体可以参考这边的官方说明文档: https://static.javadoc.io/io ...
- python+Appium自动化:app滑动操作swipe
swipe Appium使用滑动操作用到了swipe方法,定义如下: swipe(self, start_x, start_y, end_x, end_y, duration=None) 从一个点滑动 ...
- Python+Appium自动化测试(8)-swipe()滑动页面
app自动化测试过程中,经常会遇到滑动屏幕操作,appium框架的话我们可以使用webdriver提供的swipe()方法来对屏幕页面进行上滑.下滑.左滑.右滑操作. 一,swipe方法介绍 swip ...
随机推荐
- 连不上VSS 【转】
今天打开项目,但是连不上VSS,报错如下: (一)现象: Could not find the Visual SourceSafe Internet Web Service connection in ...
- Win8开发疑问与解答
疑问:怎样获取开发者许可证 打开VS2012时,怎么在没有取得开发者许可证之前,屏蔽/跳过弹出的窗体“获取Windows8开发者许可证 你需要具有开发者许可证才能开发适用于......” 打开Blen ...
- POJ 3468 A Simple Problem with Integers(线段树区间求和)
Description You have N integers, A1, A2, ... , AN. You need to deal with two kinds of operations. On ...
- 【MFC学习笔记-作业6-sin图像】【OnDraw(CDC* pDC)】
根据这段源代码 一步一步剖析CDC的使用 void CDrawSinXView::OnDraw(CDC* pDC) { CDrawSinXDoc* pDoc = GetDocument(); ASSE ...
- css绝对定位、相对定位和文档流的那些事
前言 接触html.和css时间也不短了,但每次用div+css布局的时候心里还是有点儿虚,有时候干脆就直接用table算了,很多时候用div会出现些不可预料的问题,虽然花费一定时间能够解决,但总不是 ...
- RDLC报表系列(二) 行分组
接上一篇文章的内容,今天来说的是行分组.还是打开demo1.rdlc界面,拖入一个文本框和表 1.在表中随便选择一个字段,不然在添加行组的时候不会自动提示.我这里是选择的Dept 2.在下面的行组中右 ...
- C# 根据年月获得此月第一天和最后一天,并计算工作日
string str = "2015年3月"; ); ); , secondIndex - firstIndex - ); , ); DateTime dt = DateTime. ...
- SET STATISTICS IO和SET STATISTICS TIME 在SQL Server查询性能优化中的作用
近段时间以来,一直在探究SQL Server查询性能的问题,当然也漫无目的的查找了很多资料,也从网上的大神们的文章中学到了很多,在这里,向各位大神致敬.正是受大神们无私奉献精神的影响,所以小弟也作为回 ...
- Java 反射机制浅析
Java反射机制是在运行状态中,对于任意一个类,都能够知道这个类的所有属性和方法:对于任意一个对象,都能够调用它的任意一个方法和属性:这种动态获取的信息以及动态调用对象的方法的功能称为Java语言的反 ...
- iOS设计模式解析(一)工厂方法
工厂方法:定义创建对象的借口,让子类决定实例化哪一个类.工厂方法是一个类的实例化延迟到了子类 例如 :Shoes厂有两个子类(Newbalance.Nike)构建类图如下: 代码实现: #i ...