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 ...
随机推荐
- hdu 5562 Clarke and food(贪心)
Problem Description Clarke is a patient with multiple personality disorder. One day, Clarke turned i ...
- Android学习总结——Activity状态保存和恢复
Android中启动一个Activity如果点击Home键该Activity是不会被销毁的,但是当进行某些操作时某些数据就会丢失,如下: Java class: package com.king.ac ...
- poj 3255 求次大最短路
Roadblocks Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 5508 Accepted: 2088 Descri ...
- 浅析WebGIS
浅析WebGIS 摘要:随着网络的发展,利用Web公布信息越来越普及化.而地理信息系统(GIS)与网络的结合就产生了万维网地理信息系统(WebGIS),它引起了地理信息公布的新的变革,对实现GIS信息 ...
- Linux系统安装VM-Tools
安装 vmware-tools的安装包有两个,一个是rpm包,一个是tar包,下面分别是用了这两种方法安装: 一.rpm包安装 1.在启动LINUX 虚拟机之后,在WMWare 的菜单栏中点击&quo ...
- Codeforces Round #245 (Div. 1)——Working out
题目链接 题意: 一个n*m的矩阵,每一个方格有一个非负数,如今选择两条线路:一个左上到右下,一个左下到右上,且仅仅能有一个公共点. 求两个线路上数的最大值(公共点不算) 分析: 仅仅有两种情况,dp ...
- HDU2054_A == B ?【模拟题】【大数】【水的问题】
A == B ? Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total S ...
- QImage 与 cv::Mat 之间的相互转换
近期做图像处理方面的项目比較多,非常多算法自己从头写的话太浪费时间,并且自己写的也不一定完好,早就听说OpenCV在图像处理算法方面功能非常强大,一直没时间学习,这次正好项目用到了.暂时抱佛脚学习些O ...
- 编写javascript的基本技巧
第一.编写可维护的代码 什么叫着编写可维护的代码呢?就是当我的做出来的项目,拿给其它编码团队能很快的看懂 你编写的代码,你的整个项目的逻辑等等.一个项目的修改维护是要比开发一个项目的成本 是要高的.例 ...
- Shell命令行
利用wc命令统计文件行,单词数,字符数,利用sort排序和去重,再结合uniq可以进行词频统计. cat file.txt sort hello.c | uniq -c | sort -nr |hea ...