/**
* * 定义从右侧退出时的动画效果
* * @return
* */
public class AnimationUtil {
public static Animation outToRightAnimation(Context context) {
Animation outtoRight = null;
outtoRight = AnimationUtils.loadAnimation(context, R.anim.out_right);
outtoRight.setInterpolator(new AccelerateInterpolator());
return outtoRight;
}
/**
* * 定义从右侧进入的动画效果
* * @return
* */
public static Animation inFromRightAnimation(Context context) {
Animation inFromRight = null;
inFromRight = AnimationUtils.loadAnimation(context, R.anim.in_right);
inFromRight.setInterpolator(new AccelerateInterpolator());
return inFromRight;
}
/**
* * 定义从左侧退出的动画效果
* * @return
* */
public static Animation outToLeftAnimation(Context context) {
Animation outtoLeft = null;
outtoLeft = AnimationUtils.loadAnimation(context, R.anim.out_left);
outtoLeft.setInterpolator(new AccelerateInterpolator());
return outtoLeft;
}
/**
* * 定义从左侧进入的动画效果
* * @return
* */
public static Animation inFromLeftAnimation(Context context) {
Animation inFromLeft = null;
inFromLeft = AnimationUtils.loadAnimation(context, R.anim.in_left);
inFromLeft.setInterpolator(new AccelerateInterpolator());
return inFromLeft;
}
/**
* * 定义从左侧进入的动画效果
* * @return
* */
public static Animation startTransform(Context context,int from_x,int to_x) {
TranslateAnimation ta = new TranslateAnimation(from_x, to_x, 0, 0);
ta.setDuration(400);
ta.setFillAfter(true);
return ta;
}
}
/****实现类****/
/**
* 标签
* ***/
public class ViewflipperTestActivity extends Activity implements OnTouchListener,OnGestureListener,OnClickListener{
private ViewFlipper mFlipper;
private TextView textView_1 = null;
private TextView textView_2 = null;
private TextView textView_3 = null;
private RelativeLayout relativeLayout_1;
private RelativeLayout relativeLayout_2;
private RelativeLayout relativeLayout_3;
private RelativeLayout root_title;
private
GestureDetector mGestureDetector;
private static final int FLING_MIN_DISTANCE = 100;
private static final int FLING_MIN_VELOCITY = 200;
//得到之前的左边与 屏幕左边缘的距离
private int from_left = 0;
private int to_left = 0;
private TextView curr_view = null;
private boolean isFirst = true;
ImageView iv_bg = null;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
initElements();
}
private void initElements(){
textView_1 = (TextView) findViewById(R.id.textView_1);
textView_2 = (TextView) findViewById(R.id.textView_2);
textView_3 = (TextView) findViewById(R.id.textView_3);
textView_1.setOnClickListener(this);
textView_2.setOnClickListener(this);
textView_3.setOnClickListener(this);
root_title = (RelativeLayout) findViewById(R.id.root_title);
relativeLayout_1 = (RelativeLayout) findViewById(R.id.relativeLayout_1);
relativeLayout_2 = (RelativeLayout) findViewById(R.id.relativeLayout_2);
relativeLayout_3 = (RelativeLayout) findViewById(R.id.relativeLayout_3);
mFlipper = (ViewFlipper) findViewById(R.id.viewflipper);
//注册一个用于手势识别的类
mGestureDetector = new GestureDetector(this);
//给mFlipper设置一个listener
mFlipper.setOnTouchListener(this);
//允许长按住ViewFlipper,这样才能识别拖动等手势
mFlipper.setLongClickable(true);
//为默认显示在第一个上面
iv_bg = new ImageView(this);
iv_bg.setImageDrawable(getResources().getDrawable(R.drawable.topbar_select));
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
lp.addRule(RelativeLayout.CENTER_HORIZONTAL,RelativeLayout.TRUE);
relativeLayout_1.addView(iv_bg,lp);
curr_view = textView_1;
}
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
float velocityY) {
if (e1.getX() - e2.getX() > FLING_MIN_DISTANCE&& Math.abs(velocityX) > FLING_MIN_VELOCITY) {
// 当像左侧滑动的时候
//设置View进入屏幕时候使用的动画
//或者直接:mFlipper.setInAnimation(getApplicationContext(), R.anim.in_left); add by 午夜凶林
next();
if(curr_view == textView_1){
move(textView_2);
}else if(curr_view == textView_2){
move(textView_3);
}else if(curr_view == textView_3){
move(textView_1);
}
} else if (e2.getX() - e1.getX() > FLING_MIN_DISTANCE && Math.abs(velocityX) > FLING_MIN_VELOCITY) {
// 当像右侧滑动的时候
previous();
if(curr_view == textView_1){
move(textView_3);
}else if(curr_view == textView_2){
move(textView_1);
}else if(curr_view == textView_3){
move(textView_2);
}
}
return false;
}
@Override
public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
float distanceY) {
// TODO Auto-generated method stub
return false;
}
@Override
public void onLongPress(MotionEvent e) {
// TODO Auto-generated method stub
}
@Override
public boolean onTouch(View v, MotionEvent event) {
return mGestureDetector.onTouchEvent(event);
}
@Override
public boolean onSingleTapUp(MotionEvent e) {
// TODO Auto-generated method stub
return false;
}
@Override
public boolean onDown(MotionEvent e) {
// TODO Auto-generated method stub
return false;
}
@Override
public void onShowPress(MotionEvent e) {
// TODO Auto-generated method stub
}
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.textView_1:
move(textView_1);
mFlipper.setDisplayedChild(0);
break;
case R.id.textView_2:
move(textView_2);
mFlipper.setDisplayedChild(1);
break;
case R.id.textView_3:
move(textView_3);
mFlipper.setDisplayedChild(2);
break;
default:
break;
}
}
//得到该 textView 与屏幕左边缘的距离
private int getLeft(TextView tv){
int width = tv.getWidth();
int bg_width = iv_bg.getWidth();
int middle = tv.getLeft() + ((RelativeLayout)tv.getParent()).getLeft()+width/2;
int left = middle - bg_width/2;
return left;
}
private void move(TextView tv){
if(tv != curr_view){
if(isFirst){
from_left = getLeft(textView_1);
isFirst = false;
changeParent();
move(tv);
}else{
to_left = getLeft(tv);
//iv_bg.startAnimation(AnimationUtil.startTransform(getApplicationContext(), from_left, to_left));
TranslateAnimation animation = new TranslateAnimation(from_left, to_left, 0, 0);
animation.setDuration(400);
animation.setFillAfter(true);
iv_bg.bringToFront();
iv_bg.startAnimation(animation);
//fly
mFlipper.setNextFocusDownId(R.id.relativeLayout_3);
mFlipper.setNextFocusRightId(R.id.relativeLayout_3);
curr_view = tv;
from_left = to_left;
}
}
}
private void changeParent(){
int width = iv_bg .getWidth();
int height = iv_bg.getHeight();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(width, height);
int left = ((RelativeLayout)iv_bg.getParent()).getLeft();
lp.leftMargin = left;
relativeLayout_1.removeView(iv_bg);
root_title.addView(iv_bg,lp);
}
@Override
public void onDetachedFromWindow() {
try {
super.onDetachedFromWindow();
}
catch (IllegalArgumentException e) {
mFlipper.stopFlipping();
}
}
private void next(){
mFlipper.setInAnimation(AnimationUtil.inFromRightAnimation(getApplicationContext()));
//设置View退出屏幕时候使用的动画
mFlipper.setOutAnimation(AnimationUtil.outToLeftAnimation(getApplicationContext()));
mFlipper.showNext();
}
private void previous(){
mFlipper.setInAnimation(AnimationUtil.inFromLeftAnimation(getApplicationContext()));
mFlipper.setOutAnimation(AnimationUtil.outToRightAnimation(getApplicationContext()));
mFlipper.showPrevious();
}
}
定义title.xml文件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/root_title"
android:background="@drawable/bg_title"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center"
>
<RelativeLayout
style="@style/relativeLayout"
android:id="@+id/relativeLayout_1"
>
<TextView
style="@style/textView_title"
android:text="第1幅图"
android:id="@+id/textView_1"
android:layout_centerInParent="true"
/>
</RelativeLayout>
<RelativeLayout
style="@style/relativeLayout"
android:id="@+id/relativeLayout_2"
>
<TextView
style="@style/textView_title"
android:text="第2幅图"
android:id="@+id/textView_2"
android:layout_centerInParent="true"
/>
</RelativeLayout>
<RelativeLayout
style="@style/relativeLayout"
android:id="@+id/relativeLayout_3"
>
<TextView
style="@style/textView_title"
android:text="第3幅图"
android:id="@+id/textView_3"
android:layout_centerInParent="true"
/>
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
定义main.xml文件
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<include layout="@layout/title"
android:layout_height="fill_parent"
android:layout_weight="1"
/>
<ViewFlipper
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="@+id/viewflipper"
android:layout_weight="1"
>
<!-- 第一个页面 -->
<include layout="@layout/first_linearlayout"/>
<!-- 第二个页面 -->
<include layout="@layout/second_linearlayout"/>
<!-- 第三个页面 -->
<include layout="@layout/third_linearlayout"/>
</ViewFlipper>
</LinearLayout>