优化GestureDetector快速实现自定义动画效果的页面切换

在上一篇博客中实现了简单的页面滑动切换效果后,这一篇博客是要对其做一些优化和改进。主要是增加了自定义切换页面的动画效果,还有对代码做了一些封装,减少了编码的工作量。没看过上一篇博客的可以先了解一下[利用GestureDetector快速实现页面切换滑动效果]
(http://blog.csdn.net/linxi7/article/details/51124050)
下面贴出这篇博客相对于上一篇有所有增加和变化的代码片段。
首先是增加的自定义的切换页面动画效果:
在res目录下面新建了anim文件夹用来存放自定义的动画xml文件,tran_in.xml和tran_out.xml:

tran_in.xml文件:

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="500"
    android:fromXDelta="100%p"
    android:toXDelta="0" >

</translate>

这是滑动到下一页的滑进动画,也就是第二个页面滑动到可见的动画效果,时间是500ms,即第二个页面的x坐标轴是由100滑动到可见的0,也就是从最右边滑动到最左边。

tran_out.xml文件:

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="500"
    android:fromXDelta="0"
    android:toXDelta="-100%p" >

</translate>

这是滑动到下一页的滑出动画,也就是第一个页面从可见滑出到屏幕的效果,时间是500ms,即第一个页面的x坐标值由原本的0滑动到-100。

上面两个仅仅是滑动到写一页的动画,由于滑动到上一页和滑到下一页的动画效果是相反的,所以还得创建两个滑到上一页的动画xml文件,tran_previous_in.xml和tran_previous_out.xml:

tran_previous_in.xml文件:

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="500"
    android:fromXDelta="-100%p"
    android:toXDelta="0" >

</translate>

tran_previous_out.xml文件:

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="500"
    android:fromXDelta="0"
    android:toXDelta="100%p" >

</translate>

具体的参数和上面滑到下一页的差不多,应该不用解释了。
上面给就是自定义滑动动画的xml文件,在添加了动画效果后,还对滑动的实现代码做了一些改变。由于滑动页面的代码有大部分都是相同的,可以共用,所以新增加了一个BaseActivity.java基类用来实现滑动逻辑,这个活动类也不用在清单文件中进行注册,因为根本就不需要展示这个页面的。然后让第一个页面和第二个页面去继承这个基类,至于具体的滑动到上一页和滑动到下一页的实现是由子类自己来实现的。一下是BaseActivity.java的代码:

package com.example.gestureslidingdemo;

import android.app.Activity;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.view.GestureDetector;
import android.view.GestureDetector.SimpleOnGestureListener;
import android.view.MotionEvent;
import android.widget.Toast;

/**
 * 设置滑动页的父类,不需要在清单文件中注册,因为该页面不需要界面展示
 * 
 * @author Administrator
 * 
 */
public abstract class BaseActivity extends Activity {

    private GestureDetector mDetector;
    public SharedPreferences mPref;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        mDetector = new GestureDetector(this, new SimpleOnGestureListener() {

            // 监听手势滑动事件
            /**
             * e1表示滑动的起点,e2表示滑动重点 velocityX表示水平速度 velocityY表示垂直速度
             */
            @Override
            public boolean onFling(MotionEvent e1, MotionEvent e2,
                    float velocityX, float velocityY) {

                // 判断纵向滑动是否过大,过大的话不允许切换界面
                if (Math.abs(e2.getRawY() - e1.getRawY()) > 200) {
                    Toast.makeText(BaseActivity.this, "不能这样划哦",
                            Toast.LENGTH_SHORT).show();
                    return true;
                }

                // 判断滑动是否龟速
                if (Math.abs(velocityX) < 100) {
                    Toast.makeText(BaseActivity.this, "滑动太龟速哦",
                            Toast.LENGTH_SHORT).show();
                    return true;
                }

                // 向右滑动,上一页
                if (e2.getRawX() - e1.getRawX() > 200) {
                    showPreviousPage();
                    return true;
                }
                // 向左滑动,下一页
                if (e1.getRawX() - e2.getRawX() > 200) {
                    showNextPage();
                    return true;
                }
                return super.onFling(e1, e2, velocityX, velocityY);
            }
        });
    }

    /**
     * 展示上一页,子类必须实现
     */
    public abstract void showPreviousPage();

    /**
     * 展示下一页,子类必须实现
     */
    public abstract void showNextPage();

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        mDetector.onTouchEvent(event); // 委托手势识别器处理触摸事件
        return super.onTouchEvent(event);
    }
}

在上一篇博客中[利用GestureDetector快速实现页面切换滑动效果]
(http://blog.csdn.net/linxi7/article/details/51124050)已经进行了解释了,在里面也有注释,相信不用再多无用的旁白了。
下面是FirstActivity.java代码:

package com.example.gestureslidingdemo;

import android.content.Intent;
import android.os.Bundle;
import android.widget.Toast;

public class FirstActivity extends BaseActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_first);
    }

    public void showPreviousPage() {
        Toast.makeText(this, "已经是第一页罗,不能再滑拉", Toast.LENGTH_SHORT).show();
    }

    public void showNextPage() {
        Intent intent = new Intent(this, SecondActivity.class);
        startActivity(intent);
        finish();

        overridePendingTransition(R.anim.tran_in, R.anim.tran_out);
    }

}

有没有感觉看起来简单清爽呢,只是继承了基类之后实现了两个抽象的方法就ok了。还要注意一点,因为上面增加了自定义的动画效果,要想这些效果生效,在切换activity的方法中调用overridePendingTransition,这个就是用来添加动画到滑动切换页面中去的。里面两个参数是先前创建的动画xml文件。
SecondActivity.java代码:

package com.example.gestureslidingdemo;

import android.content.Intent;
import android.os.Bundle;
import android.widget.Toast;

public class SecondActivity extends BaseActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_second);
    }

    public void showNextPage() {
        Toast.makeText(this, "已经是第二页罗,滑动不下去了", Toast.LENGTH_SHORT).show();
    }

    public void showPreviousPage() {
        Intent intent = new Intent(this, FirstActivity.class);
        startActivity(intent);
        finish();

        overridePendingTransition(R.anim.tran_previous_in,
                R.anim.tran_previous_out);
    }

}

SecondActivity.java相对于FirstActivity.java有所改变的就是overridePendingTransition里面的参数值,也就是滑动的动画效果不同。两个页面滑动效果相反的,所以在刚开始就新建了两组相反的动画效果文件在这里进行引用。

实现的效果如下:
滑动效果

最后附上实现的Demo自定义滑动页面切换效果
以上博文有不足的地方还请指正和指教,欢迎转载。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值