今天写Blog阅读器的时候遇到了这个问题,把它分享给大家,让同样是新手们少走冤枉路
始初写这个功能的时候,用过了好多方法,也耗了不少时间去研究WebView和ViewFlipper的属性
后来知道了WebView本身的onTouchEvent和ViewFlipper有冲突;(WebView表示当然是老大说了算是吧,ViewFlipper表示压力很大,只能靠边站)
那没办法了,我们需要把WebView“修理”一下,重写它的onTouchEvent方法
先来看看ViewFlipper的ActivityTestWebViewFlip.java
创建ViewFlipper,给它添加2个WebView页面
1 public class TestWebViewFlip extends Activity{
2
3private ViewFlipper flipper;
4
5//定义类myWebView
6//MyWebView类,重写了onTouchEvent方法
7MyWebView myWebView;
8/** Called when the activity is first created. */
9@Override
10public void onCreate(Bundle savedInstanceState) {
11super.onCreate(savedInstanceState);
12setContentView(R.layout.main);
13flipper = (ViewFlipper) this.findViewById(R.id.ViewFlipper);
14
15//添加第一个alipper 为http://www.baidu.com
16flipper.addView(addWebView("http://www.baidu.com"));
17//添加第二个alipper 为http://www.google.com.hk
18flipper.addView(addWebView("http://www.google.com.hk"));
19}
20
21/**
22* 往flipper中添加WebView
23* @param url 网页地址
24* @return
25 */
26private View addWebView(String url){
27myWebView = new MyWebView(this, flipper);
28//设置WebView属性,能够执行Javascript脚本
29myWebView.getSettings().setJavaScriptEnabled(true);
30//加载需要显示的网页
31//webview.loadUrl("file:///android_asset/index.html");
32myWebView.loadUrl(url);
33
34//使WebView的网页跳转在WebView中进行,而非跳到浏览器
35myWebView.setWebViewClient(new WebViewClient(){
36public boolean shouldOverrideUrlLoading(WebView view, String url) {
37view.loadUrl(url);
38return true;
39}
40});
41return myWebView;
42}
43 }
下面是继承了WebView类,重写onTouchEvent方法MyWebView.java
setInAnimation(AnimationUtils.loadAnimation( this.getContext(), R.anim.push_right_in)); 这个是手势滑动的效果,push_right_in是效果对应的文件名
这个功能可以在网上找到好多相关资料,这里不详细说
1 public class MyWebView extends WebView {
2
3float downXValue;
4long downTime;
5private ViewFlipper flipper;
6
7private float lastTouchX, lastTouchY;
8private boolean hasMoved = false;
9
10public MyWebView(Context context, ViewFlipper flipper) {
11super(context);
12this.flipper = flipper;
13}
14
15@Override
16public boolean onTouchEvent(MotionEvent evt) {
17boolean consumed = super.onTouchEvent(evt);
18if (isClickable()) {
19switch (evt.getAction()) {
20case MotionEvent.ACTION_DOWN:
21lastTouchX = evt.getX();
22lastTouchY = evt.getY();
23downXValue = evt.getX();
24downTime = evt.getEventTime();
25hasMoved = false;
26break;
27case MotionEvent.ACTION_MOVE:
28hasMoved = moved(evt);
29break;
30case MotionEvent.ACTION_UP:
31float currentX = evt.getX();
32long currentTime = evt.getEventTime();
33float difference = Math.abs(downXValue - currentX);
34long time = currentTime - downTime;
35Log.i("Touch Event:", "Distance: " + difference + "px Time: "+ time + "ms");
36/** X轴滑动距离大于100,并且时间小于220ms,并且向X轴右方向滑动&& (time < 220) */
37if ((downXValue < currentX) && (difference > 100 && (time < 220))) {
38/** 跳到上一页*/
39this.flipper.setInAnimation(AnimationUtils.loadAnimation(
40this.getContext(), R.anim.push_right_in));
41this.flipper.setOutAnimation(AnimationUtils.loadAnimation(
42this.getContext(), R.anim.push_right_out));
43flipper.showPrevious();
44}
45/** X轴滑动距离大于100,并且时间小于220ms,并且向X轴左方向滑动*/
46if ((downXValue > currentX) && (difference > 100) && (time < 220)) {
47/** 跳到下一页*/
48this.flipper.setInAnimation(AnimationUtils.loadAnimation(
49this.getContext(), R.anim.push_left_in));
50this.flipper.setOutAnimation(AnimationUtils.loadAnimation(
51this.getContext(), R.anim.push_left_out));
52flipper.showNext();
53}
54break;
55}
56}
57return consumed || isClickable();
58}
59
60private boolean moved(MotionEvent evt) {
61return hasMoved || Math.abs(evt.getX() - lastTouchX) > 10.0
62|| Math.abs(evt.getY() - lastTouchY) > 10.0;
63}
64
65 }
复制代码
ViewFlipper的布局文件: main.xml
1 <?xml version="1.0" encoding="utf-8"?>
2 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
3android:layout_width="fill_parent"
4android:layout_height="fill_parent"
5 >
6<ViewFlipper android:id="@+id/ViewFlipper"
7android:layout_width="fill_parent"
8android:layout_height="fill_parent"
9 >
10</ViewFlipper>
11 </RelativeLayout>
复制代码
手势滑动的4个效果文件:
路径res/anim/
push_left_in.xml
1 <?xml version="1.0" encoding="utf-8"?>
2 <set xmlns:android="http://schemas.android.com/apk/res/android">
3<translate
4 android:fromXDelta="30"
5 android:toXDelta="-80"
6 android:fromYDelta="30"
7 android:toYDelta="300"
8 android:duration="2000"
9 />
10<alpha android:fromAlpha="0.1" android:toAlpha="1.0"
11android:duration="500" />
12 </set>
复制代码
push_left_out.xml
1 <?xml version="1.0" encoding="utf-8"?>
2 <set xmlns:android="http://schemas.android.com/apk/res/android">
3<translate android:fromXDelta="0" android:toXDelta="-100%p"
4android:duration="500" />
5<alpha android:fromAlpha="1.0" android:toAlpha="0.1"
6android:duration="500" />
7 </set>
复制代码
push_right_in.xml
View Code
1 <?xml version="1.0" encoding="utf-8"?>
2 <set xmlns:android="http://schemas.android.com/apk/res/android">
3<translate android:fromXDelta="-100%p" android:toXDelta="0"
4android:duration="500" />
5<alpha android:fromAlpha="0.1" android:toAlpha="1.0"
6android:duration="500" />
7 </set>
复制代码
push_right_out.xml
1 <?xml version="1.0" encoding="utf-8"?>
2 <set xmlns:android="http://schemas.android.com/apk/res/android">
3<translate android:fromXDelta="0" android:toXDelta="100%p"
4android:duration="500" />
5<alpha android:fromAlpha="1.0" android:toAlpha="0.1"
6android:duration="500" />
7 </set>
手势打印结果:
作者 那瞬间