Android 进出activity的滑动动画效果

最近做了一个项目要求类似QQ中的SlidingMenu中菜单的点击效果.

即点击之后跳到A activity,这时候就要求A activity有一个左滑的动画效果
点击A activity上返回按钮或则点击手机的返回键也要触发一个返回动画效果

在A activity上添加手势返回滑动的动画效果.
这里我们先要在项目的res中新建一个anim文件然后添加如下上个动画效果的xml文件:

base_slide_remain.xml 

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="300"
android:fromXDelta="0"
android:interpolator="@android:anim/decelerate_interpolator"
android:toXDelta="0" />

</set>

base_slide_right_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="300"
android:fromXDelta="100.0%"
android:interpolator="@android:anim/decelerate_interpolator"
android:toXDelta="0.0%" />

</set>

base_slide_right_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

<translate
android:duration="300"
android:fromXDelta="0.0%"
android:interpolator="@android:anim/accelerate_interpolator"
android:toXDelta="100.0%" />
</set>

以为这里我们要对页面做一个手势的动画效果事件的处理,我们可以自定义一个布局

SlideFinishLayout.java

import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.VelocityTracker;
import android.view.View;
import android.widget.LinearLayout;

/**
* Created by shaolin on 5/26/16.
*/
public class SlideFinishLayout extends LinearLayout implements View.OnTouchListener {

//手指向右滑动时的最小速度
private static final int XSPEED_MIN = 200;

//手指向右滑动时的最小距离
private static final int XDISTANCE_MIN = 150;

//记录手指按下时的横坐标。
private float xDown;

//记录手指移动时的横坐标。
private float xMove;

//用于计算手指滑动的速度。
private VelocityTracker mVelocityTracker;

public SlideFinishLayout(Context context) {
this(context, null);
}

public SlideFinishLayout(Context context, AttributeSet attrs) {
super(context, attrs);
setOnTouchListener(this); //设置在本身上的滑动事件
}

@Override
public boolean onTouch(View v, MotionEvent event) {
createVelocityTracker(event);
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
xDown = event.getRawX();
break;
case MotionEvent.ACTION_MOVE:
xMove = event.getRawX();
//活动的距离
int distanceX = (int) (xMove - xDown);
//获取顺时速度
int xSpeed = getScrollVelocity();
//当滑动的距离大于我们设定的最小距离且滑动的瞬间速度大于我们设定的速度时，返回到上一个activity
if (distanceX > XDISTANCE_MIN && xSpeed > XSPEED_MIN) {
if (mOnSlideFinishListener != null) {
mOnSlideFinishListener.onSlideFinish();
}
}
break;
case MotionEvent.ACTION_UP:
recycleVelocityTracker();
break;
default:
break;
}
return true;
}

/**
* 创建VelocityTracker对象，并将触摸content界面的滑动事件加入到VelocityTracker当中。
*
* @param event
*/
private void createVelocityTracker(MotionEvent event) {
if (mVelocityTracker == null) {
mVelocityTracker = VelocityTracker.obtain();
}
mVelocityTracker.addMovement(event);
}

/**
* 回收VelocityTracker对象。
*/
private void recycleVelocityTracker() {
mVelocityTracker.recycle();
mVelocityTracker = null;
}

/**
* 获取手指在content界面滑动的速度。
*
* @return 滑动速度，以每秒钟移动了多少像素值为单位。
*/
private int getScrollVelocity() {
mVelocityTracker.computeCurrentVelocity(1000);
int velocity = (int) mVelocityTracker.getXVelocity();
return Math.abs(velocity);
}

private OnSlideFinishListener mOnSlideFinishListener;

public void setOnSlideFinishListener(OnSlideFinishListener listener) {
mOnSlideFinishListener = listener;
}

public interface OnSlideFinishListener {
void onSlideFinish();
}
}

上面的准备好了,现在我们就来说说怎么实现对应的效果:

这里我们可以先建一个AActivity然后我们在这个AActivity上进行进入/返回手势/点击返回的效果展示
AActivity.java

import android.os.Bundle;
import android.view.View;

import com.hardware.mask.R;
import com.hardware.mask.app.base.BaseActivity;
import com.hardware.mask.widget.SlideFinishLayout;

import org.chiki.base.widget.TitleBar;

/**
* Created by shaolin on 5/19/16.
*/
public class AActivity extends Activity {

private SlideFinishLayout mSFL;

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

initTitleBar();
initView();
}

@Override
public void onBackPressed() {
//这里是我们点击手机返回键的动画
super.onBackPressed();
backTransition();
}

private void initTitleBar() {
//TitleBar这个是自己封装的一个标题bar,大家只要知道这里的点击事件那两句就OK了
TitleBar bar = (TitleBar) findViewById(R.id.title_bar);
bar.setText("关于我们");
bar.setLeftDrawableRes(R.mipmap.user_return);
bar.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//这里的两句是返回的时候finish在加上动画效果,还有就是overridePendingTransition必须放在finish后面才有效果
finish();
backTransition();
}
});
}

private void initView() {
//获取我们刚刚设置的那个布局,然后通过接口实现手势的事件处理
mSFL = (SlideFinishLayout) findViewById(R.id.slideFinishLayout);
mSFL.setOnSlideFinishListener(new SlideFinishLayout.OnSlideFinishListener() {
@Override
public void onSlideFinish() {
finish();
backTransition();
}
});
}

public void backTransition() {
overridePendingTransition(0, R.anim.base_slide_right_out);
}
}

aactivity.XML

<?xml version="1.0" encoding="utf-8"?>
<com.hardware.mask.widget.SlideFinishLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:hk="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:id="@+id/slideFinishLayout"
android:orientation="vertical">

<org.chiki.base.widget.TitleBar
android:id="@+id/title_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
hk:center_textColor="@color/black" />

</com.hardware.mask.widget.SlideFinishLayout>

1.进入

startActivity(new Intent(this, AActivity.class));
overridePendingTransition(R.anim.base_slide_right_in, R.anim.base_slide_remain);

2.返回手势

SlideFinishLayout mSFL = (SlideFinishLayout) findViewById(R.id.slideFinishLayout);
mSFL.setOnSlideFinishListener(new SlideFinishLayout.OnSlideFinishListener() {
@Override
public void onSlideFinish() {
finish();
backTransition();
}
});

3.返回处理(这里有两个)

手机返回键

@Override
public void onBackPressed() {
super.onBackPressed();
backTransition();
}

按钮返回

finish();
backTransition();