实现android布局的左右拖动及动画效果的代码范例
首先是PanelSwitcher类：
package com.android.viewswitcher;
import android.view.animation.TranslateAnimation;
import android.view.MotionEvent;
import android.view.View;
import android.view.GestureDetector;
import android.widget.FrameLayout;
import android.content.Context;
import android.util.AttributeSet;
class PanelSwitcher extends FrameLayout {
private static final int MAJOR_MOVE = 100;
private static final int ANIM_DURATION = 400;
private GestureDetector mGestureDetector;
private int mCurrentView;
private View mChildren[] = new View[0];
private int mWidth;
private TranslateAnimation inLeft;
private TranslateAnimation outLeft;
private TranslateAnimation inRight;
private TranslateAnimation outRight;
private static final int LEFT = 2;
private static final int RIGHT = 3;
private int mPreviousMove = 0;
public PanelSwitcher(Context context, AttributeSet attrs) {
super(context, attrs);
mCurrentView = 0;
mGestureDetector = new GestureDetector(context, new GestureDetector.SimpleOnGestureListener() {
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
float velocityY) {
int dx = (int) (e2.getX() - e1.getX());
// don't accept the fling if it's too short
// as it may conflict with a button push
if (Math.abs(dx) > MAJOR_MOVE && Math.abs(velocityX) > Math.abs(velocityY)) {
if (velocityX > 0) {
moveRight();
} else {
moveLeft();
}
return true;
} else {
return false;
}
}
});
}
void setCurrentIndex(int current) {
mCurrentView = current;
updateCurrentView();
}
private void updateCurrentView() {
for (int i = mChildren.length-1; i >= 0 ; --i) {
mChildren[i].setVisibility(i==mCurrentView ? View.VISIBLE : View.GONE);
}
}
@Override
public void onSizeChanged(int w, int h, int oldW, int oldH) {
mWidth = w;
inLeft = new TranslateAnimation(mWidth, 0, 0, 0);
outLeft = new TranslateAnimation(0, -mWidth, 0, 0);
inRight = new TranslateAnimation(-mWidth, 0, 0, 0);
outRight = new TranslateAnimation(0, mWidth, 0, 0);
inLeft.setDuration(ANIM_DURATION);
outLeft.setDuration(ANIM_DURATION);
inRight.setDuration(ANIM_DURATION);
outRight.setDuration(ANIM_DURATION);
}
protected void onFinishInflate() {
int count = getChildCount();
mChildren = new View[count];
for (int i = 0; i < count; ++i) {
mChildren[i] = getChildAt(i);
}
updateCurrentView();
}
@Override
public boolean onTouchEvent(MotionEvent event) {
mGestureDetector.onTouchEvent(event);
return true;
}
@Override
public boolean onInterceptTouchEvent(MotionEvent event) {
return mGestureDetector.onTouchEvent(event);
}
void moveLeft() {
// <--
if (mCurrentView < mChildren.length-1 && mPreviousMove != LEFT) {
mChildren[mCurrentView+1].setVisibility(View.VISIBLE);
mChildren[mCurrentView+1].startAnimation(inLeft);
mChildren[mCurrentView].startAnimation(outLeft);
mChildren[mCurrentView].setVisibility(View.GONE);
mCurrentView ++;
mPreviousMove ++;
}
}
void moveRight() {
// -->
if (mCurrentView > 0 && mPreviousMove != RIGHT) {
mChildren[mCurrentView-1].setVisibility(View.VISIBLE);
mChildren[mCurrentView-1].startAnimation(inRight);
mChildren[mCurrentView].startAnimation(outRight);
mChildren[mCurrentView].setVisibility(View.GONE);
mCurrentView --;
mPreviousMove --;
}
}
int getCurrentIndex() {
return mCurrentView;
}
}
该类是自定义可以左右切换view的控件，继承自FrameLayout，从主布局中获取布局的个数，然后进行左右拖动的动作，切换的动画用简单的animation完成，并进行首尾页的判断。
这里我加了三个view布局分别如下：
layout1.xml：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/simplePad"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_gravity="center">
<TextView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="25sp"
android:text="This is the first view!"/>
</LinearLayout>
layout2.xml：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/advancedPad"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_gravity="center">
<TextView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="25sp"
android:text="This is the second view!"/>
</LinearLayout>
layout3.xml：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/thirdPad"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_gravity="center">
<TextView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="25sp"
android:text="This is the third view!"/>
</LinearLayout>
main.xml主布局：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<com.android.viewswitcher.PanelSwitcher
android:id="@+id/panelswitch"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<include android:id="@+id/simplePad" layout="@layout/layout1" />
<include android:id="@+id/advancedPad" layout="@layout/layout2" />
<include android:id="@+id/thirdPad" layout="@layout/layout3" />
</com.android.viewswitcher.PanelSwitcher>
</LinearLayout>
主程序代码：
package com.android.viewswitcher;
import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.widget.LinearLayout;
public class ViewSwitcher extends Activity {
private LinearLayout mFirstLayout;
private LinearLayout mSecondLayout;
private LinearLayout mThirdLayout;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
mFirstLayout = (LinearLayout)findViewById(R.id.simplePad);
mSecondLayout = (LinearLayout)findViewById(R.id.advancedPad);
mThirdLayout = (LinearLayout)findViewById(R.id.thirdPad);
mFirstLayout.setBackgroundColor(Color.RED);
mSecondLayout.setBackgroundColor(Color.BLUE);
mThirdLayout.setBackgroundColor(Color.GREEN);
}
}