Android:WebView带划屏手势的浏览器实现

最新推荐文章于 2021-08-23 15:37:14 发布

weixin_33826268

最新推荐文章于 2021-08-23 15:37:14 发布

阅读量100

点赞数

文章标签：移动开发 javascript 测试 ViewUI

写了简单 Android环境下基于webview的浏览器，实现划屏切换页面的手势，在一个activity里webview的缓冲内切换的。并测试下调用系统拍照的功能

MVC模式（Model-View-Controller）

1.WebView的设置部分

 
    01private void showViews() { 
 
    02// TODO Auto-generated method stub 
 
    03mGestureDetector = new GestureDetector(this);//实例化手势对象 
 
    04wv_vm.getSettings().setSupportZoom(true);//启用页面的缩放 
 
    05wv_vm.getSettings().setBuiltInZoomControls(true);//启用页面缩放的按钮 
 
    06wv_vm.getSettings().set<SPAN class=wp_keywordlink_affiliate><A title=JavaScript href="http://www.mikel.cn/category/%e5%bc%80%e5%8f%91%e7%ac%94%e8%ae%b0/javascript" target=_blank>JavaScript</A></SPAN>Enabled(true);//启用<SPAN class=wp_keywordlink_affiliate><A title=JavaScript href="http://www.mikel.cn/category/%e5%bc%80%e5%8f%91%e7%ac%94%e8%ae%b0/javascript" target=_blank>JavaScript</A></SPAN>支持 
 
    07wv_vm.loadUrl("http://www.cnblogs.com/pxue/");//加载网址 
 
    08  
 
    09wv_vm.setOnTouchListener(this);//监听触摸事件 
 
    10wv_vm.setClickable(true); 
 
    11wv_vm.setLongClickable(true); 
 
    12  
 
    13mGestureDetector.setIsLongpressEnabled(true); 
 
    14  
 
    15wv_vm.setWebViewClient(new HelloWebViewClient());//实现点击加载页面在本webview内载入 
 
    16wv_vm.setFocusable(true); 
 
    17wv_vm.requestFocus(); 
 
    18  
 
    19}

在WebView加载新开的页面，是重写了Android.webkit.WebViewClient

 
    1private class HelloWebViewClient extends WebViewClient { 
 
    2@Override
 
    3public boolean shouldOverrideUrlLoading(WebView view, String url) { 
 
    4view.loadUrl(url); 
 
    5return true; 
 
    6} 
 
    7}

2.划屏手势部分

监听触摸时间传给手势对象

 
    1@Override
 
    2public boolean onTouch(View v, MotionEvent event) { 
 
    3// TODO Auto-generated method stub 
 
    4// Toast.makeText(this, "onTouch", Toast.LENGTH_SHORT).show(); 
 
    5return mGestureDetector.onTouchEvent(event); 
 
    6}

重写了划动事件

 
    01@Override
 
    02public boolean onFling(MotionEvent e1, MotionEvent e2, float <SPAN class=wp_keywordlink_affiliate><A title=Velocity href="http://www.mikel.cn/tag/velocity/" target=_blank>Velocity</A></SPAN>X, 
 
    03float <SPAN class=wp_keywordlink_affiliate><A title=Velocity href="http://www.mikel.cn/tag/velocity/" target=_blank>Velocity</A></SPAN>Y) { 
 
    04// TODO Auto-generated method stub 
 
    05if (e1.getX() - e2.getX() &gt; SWIPE_MIN_DISTANCE 
 
    06&amp;&amp; Math.abs(<SPAN class=wp_keywordlink_affiliate><A title=Velocity href="http://www.mikel.cn/tag/velocity/" target=_blank>Velocity</A></SPAN>X) &gt; SWIPE_THRESHOLD_VELOCITY) { 
 
    07wv_vm.goBack(); 
 
    08} else if (e2.getX() - e1.getX() &gt; SWIPE_MIN_DISTANCE 
 
    09&amp;&amp; Math.abs(velocityX) &gt; SWIPE_THRESHOLD_VELOCITY) { 
 
    10  
 
    11wv_vm.goForward(); 
 
    12} 
 
    13return false; 
 
    14}

变量、常量的声明

 
    1private GestureDetector mGestureDetector; 
 
    2  
 
    3private static final int SWIPE_MIN_DISTANCE = 120; 
 
    4private static final int SWIPE_THRESHOLD_VELOCITY = 200;

3.调用系统拍照功能部分

 
    01private void setListensers() { 
 
    02// TODO Auto-generated method stub 
 
    03Intent intent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE); 
 
    04startActivityForResult(intent, 1); 
 
    05  
 
    06} 
 
    07  
 
    08private void findViews() { 
 
    09// TODO Auto-generated method stub 
 
    10img_pic=(ImageView)findViewById(R.id.img_pic); 
 
    11  
 
    12} 
 
    13  
 
    14protected void onActivityResult(int requestCode, int resultCode, Intent data) 
 
    15{ 
 
    16if (requestCode == 1) 
 
    17{ 
 
    18if (resultCode == Activity.RESULT_OK) 
 
    19{ 
 
    20// 拍照Activity保存图像数据的key是data，返回的数据类型是Bitmap对象 
 
    21Bitmap cameraBitmap = (Bitmap) data.getExtras().get("data"); 
 
    22// 在ImageView组件中显示拍摄的照片 
 
    23img_pic.setImageBitmap(cameraBitmap); 
 
    24} 
 
    25} 
 
    26super.onActivityResult(requestCode, resultCode, data); 
 
    27}