webview 实现滑动前进后退功能

实现该功能大家一定会想到在OnTouchListener里实现

webview.setOnTouchListener(new OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                switch (event.getAction()) {
                case MotionEvent.ACTION_DOWN:
                    startX = (int) event.getX();
                    break;
                case MotionEvent.ACTION_UP:
                    int endX = (int) event.getX();
                    if(endX>startX && webview.canGoBack() && endX-startX>scrollSize){
                        webview.goBack();
                    }else if(endX<startX &&webview.canGoForward() && startX-endX>scrollSize){
                        webview.goForward();
                    }
                    break;
                default:
                    break;
                }
                return false;
            }
        });

这里要注意的是,返回值要为false,将此事件继续向下传递.否则会引起 超链接不起作用的问题.

将onTouch()事件中的返回值改为false之后,有时候仍然还是不会触发onTouch()事件,那是因为加了缩放功能,使得Touch事件会失效。由于webview的缩放同样会响应onTouch事件的,所以会覆盖掉我们自己设置的onTouhc监听,引起了事件的冲突。

解决冲突的方法如下:

将touch事件写到dispatchTouchEvent中

@Override
    public boolean dispatchTouchEvent(MotionEvent ev) {

        webview.setOnTouchListener(new OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                switch (event.getAction()) {
                case MotionEvent.ACTION_DOWN:
                    startX = (int) event.getX();
                    break;
                case MotionEvent.ACTION_UP:
                    int endX = (int) event.getX();
                    if(endX>startX && webview.canGoBack() && endX-startX>scrollSize){
                        webview.goBack();
                    }else if(endX<startX &&webview.canGoForward() && startX-endX>scrollSize){
                        webview.goForward();
                    }
                    break;
                default:
                    break;
                }
                return false;
            }
        });
        return super.dispatchTouchEvent(ev);
    }
				
时间: 2024-08-03 18:28:19

webview 实现滑动前进后退功能的相关文章

移动端h5禁用浏览器左滑右滑的前进后退功能

在项目运行过程中发现,用户在有左右滑动前进后退的功能的浏览器上签字时,偶然触发了前进后退会导致canvas像是重置了一样内容消失,所以需要在代码中处理这种情况. 基本原理就是在touchmove事件中阻止默认事件,使浏览器不会触发前进后退事件,但是也会无法触发scroll事件让页面正常滚动,后续如何让页面能正常滚动就会有多种思路. 参考https://www.cnblogs.com/Miracle-ZLZ/p/7852421.html文中第5点推荐使用IScroll,但看了一下github发现太

使用history.pushState()和popstate事件实现AJAX的前进、后退功能

上一篇文章中,我们使用location.hash来模拟ajax的前进后退功能.使用location.hash存在下面几个问题: 1.使用location.hash会导致地址栏的url发生变化,用户体验不够友好. 2.location.hash产生的历史记录无法修改,每次hash改变都会导致产生一个新的历史记录. 3.location.hash只是1个字符串,不能存储很多状态相关的信息. 为了解决这些问题,HTML5中引入了history.pushState().history.replaceSt

js禁止浏览器页面后退功能

js禁止浏览器页面后退功能: <script> $(function(){ if(window.location.href.indexOf("/login") > -1) { //防止页面后退 history.pushState(null, null, document.URL); window.addEventListener('popstate', function () { history.pushState(null, null, document.URL);

让浏览器支持 jquery ajax load 前进、后退 功能

BEGIN; 一般在做 ajax load 的时候,很多人都不会考虑到需要浏览器支持前进后退功能,因为大部分人都不知道可以实现. 最近遇到这个问题,经过一小段研究,发现github已经有现成的开源工具使用,主要实现原理是利用html的锚点,即<a href="#xxx">,详情可查看https://github.com/balupton/jquery-history/tree/master 主要demo代码如下: html <ul> <li><

栈:如何实现浏览器的前进和后退功能?

浏览器的前进.后退功能,我想你肯定很熟悉吧? 当你依次访问完一串页面 a-b-c 之后,点击浏览器的后退按钮,就可以查看之前浏览过的页面 b 和 a.当你后退到页面 a,点击前进按钮,就可以重新查看页面 b 和 c.但是,如果你后退到页面 b 后,点击了新的页面 d,那就无法再通过前进.后退功能查看页面 c 了. 假设你是 Chrome 浏览器的开发工程师,你会如何实现这个功能呢? 这就要用到我们今天要讲的“栈”这种数据结构.带着这个问题,我们来学习今天的内容. 如何理解“栈”? 关于“栈”,我

java+selenium+new——返回上一个访问的网页(模拟单击浏览器的后退功能),同一个标签窗口里

package rjcs; import org.openqa.selenium.firefox.FirefoxDriver; public class xinkaishi { public static void main(String[] args) { System.setProperty("webdriver.firefox.bin","C:\\Program Files (x86)\\Mozilla Firefox\\firefox.exe"); //设置

自定义UITableViewCell实现左滑动多菜单功能LeftSwipe

今天愚人节,小伙们,愚人节快乐! 实现一个小功能,滑动菜单,显示隐藏的功能菜单, 先上图:                       这里尝试用了下使用三个方式来实现了这个功能: 1.使用自定义UITableViewCell + UISwipeGestureRecognizer + 代理 实现: 2.使用自定义UITableViewCell + UIPanGestureRecognizer + 代理 实现: 3.使用自定义UITableViewCell + UISwipeGestureReco

Android 仿QQ浏览器WebView,滑动隐藏显示ActionBar效果

Android 仿QQ浏览器,滑动隐藏显示ActionBar效果. 往上推,是一个ScrollView会将,actionbar以及内容往上推,当actionbar消失后,将滚动Webview的内容. 此效果是基于QuickReturnHeader源码,修改而来的,代码也不多,实现方法比较简单. 直接上demo:http://download.csdn.net/detail/xufeifandj/8388493 直接看效果图:

Android webView 缓存 Cache + HTML5离线功能 解决

时间 2013-06-11 21:06:14 CSDN博客 原文 http://blog.csdn.net/moubenmao/article/details/9076917 主题 Android HTML5 WebView的缓存可以分为页面缓存和数据缓存. 页面缓存是指加载一个网页时的html.JS.CSS等页面或者资源数据.这些缓存资源是由于浏览器的行为而产生,开发者只能通过配置HTTP响应头影响浏览器的行为才能间接地影响到这些缓存数据. 他们的索引存放在/data/data/package