android动画切换(滑屏效果)实例

实现效果:屏幕实现滑屏切换效果,大家都知道的效果,就不截图了

实现步骤:

1. 创建项目interface,我选择的版本是Android3.0,

Application Name: Animation

Package Name: zf.itcast.animation

Create Activity:MainActivity

2. 在main.xml中定义两个Activity,并且设置样式

<?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" >

    <!-- 页面切换动画控件 -->

    <ViewFlipper 

        android:id="@+id/viewFlipper"

        android:layout_width="fill_parent"

        android:layout_height="fill_parent"

    >

        <!-- 第一页 -->

        <LinearLayout 

            android:layout_width="fill_parent"

            android:layout_height="fill_parent"

        >

            <Button

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="@string/hello" 

                android:onClick="openActivity"/>

            <TextView 

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="@string/first_acvivity"

                />

        </LinearLayout>

        <!-- 第二页 -->

        <LinearLayout 

            android:layout_width="fill_parent"

            android:layout_height="fill_parent"

            android:background="#339900"

        >

            <TextView 

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="@string/second_acvivity"

                />

        </LinearLayout>

    </ViewFlipper>



</LinearLayout>

3. 在类MainActivity中设置动画切换方法

package zf.itcast.animation;



import android.app.Activity;

import android.content.Intent;

import android.os.Bundle;

import android.view.MotionEvent;

import android.view.View;

import android.view.animation.Animation;

import android.view.animation.AnimationUtils;

import android.widget.ViewFlipper;



public class MainActivity extends Activity {

    //定义控件ViewFlipper

    private ViewFlipper viewFlipper;

    //定义手指开始触点屏幕的横坐标

    private float startX;

    //从左向右进入动画

    private Animation enter_lefttoright;

    //从左向右退出动画

    private Animation exit_lefttoright;

    //从右向左进入动画

    private Animation enter_righttoleft;

    //从右向左退出动画

    private Animation exit_righttoleft;

    

    

    /** Called when the activity is first created. */

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.main);

        //加载动画效果

        enter_lefttoright = AnimationUtils.loadAnimation(this, R.anim.enter_lefttoright);

        exit_lefttoright = AnimationUtils.loadAnimation(this, R.anim.exit_lefttoright);

        enter_righttoleft = AnimationUtils.loadAnimation(this, R.anim.enter_righttoleft);

        exit_righttoleft = AnimationUtils.loadAnimation(this, R.anim.exit_righttoleft);

        

        viewFlipper = (ViewFlipper)findViewById(R.id.viewFlipper);

    }

    

    

    /**

     * <p>功能:屏幕触屏事件</p>

     * @author 周枫

     * @date 2012-5-30

     */

    @Override

    public boolean onTouchEvent(MotionEvent event) {

        //点击屏幕,MotionEvent.ACTION_DOWN 为手指点击屏幕事件

        if(event.getAction() == MotionEvent.ACTION_DOWN) {

            //获取手指开始触点横坐标

            startX = event.getX();

            //手指抬起,结束滑屏

        } else if(event.getAction() == MotionEvent.ACTION_UP) {

            //获取手指抬起,结束点横坐标

            float endX = event.getX();

            //结束点横坐标大于起始点横坐标,说明手指是向右滑动

            if(endX > startX) {

                //控件进入动画效果

                viewFlipper.setInAnimation(enter_lefttoright);

                //控件退出动画效果

                viewFlipper.setOutAnimation(exit_lefttoright);

                //显示下一页

                viewFlipper.showNext();

            //结束点横坐标小于起始点横坐标,说明手指是向左滑动

            } else if (endX < startX) {

                viewFlipper.setInAnimation(enter_righttoleft);

                viewFlipper.setOutAnimation(exit_righttoleft);

                //显示前一页

                viewFlipper.showPrevious();

            }

            return true;

        }

        return super.onTouchEvent(event);

    }







    /**

     * <p>功能:打开新的Activity</p>

     * @author 周枫

     * @date 2012-5-30

     * @param 

     * @return void

     */

    public void openActivity(View v){

        Intent intent = new Intent(this, OtherActivity.class);

        startActivity(intent);

        //屏幕动画淡入淡出效果切换,调用anim文件夹中创建的enteralpha(进入动画)和exitalpha(淡出动画)两个动画(注意:两个xml文件命名不能有大写字母)

        //如果想定义其他动画效果,只需要改变enteralpha和exitalpha两个文件

        this.overridePendingTransition(R.anim.enteralpha,R.anim.exitalpha);

    }

}

4. 在res文件夹下创建anim文件夹,新建4个动画效果,分别为:enter_lefttoright.xml(从左到右进入效果),exit_lefttoright(从左向右退出动画),
enter_righttoleft(从右向左进入动画),exit_righttoleft(从右向左退出动画),具体代码为:

enter_lefttoright.xml(从左到右进入效果)

<?xml version="1.0" encoding="utf-8"?>

<set xmlns:android="http://schemas.android.com/apk/res/android"

     android:shareInterpolator="false">

    <!-- 平移动画效果 从左到右  改变x轴坐标-->

    <translate 

        android:fromXDelta="-100%p"

        android:toXDelta="0"

        android:duration="2000"

    />

</set>

exit_lefttoright(从左向右退出动画)

<?xml version="1.0" encoding="utf-8"?>

<set xmlns:android="http://schemas.android.com/apk/res/android"

     android:shareInterpolator="false">

    <!-- 平移动画效果  改变x轴坐标-->

    <translate 

        android:fromXDelta="0"

        android:toXDelta="100%p"

        android:duration="2000"

    />

</set>

enter_righttoleft(从右向左进入动画)

<?xml version="1.0" encoding="utf-8"?>

<set xmlns:android="http://schemas.android.com/apk/res/android"

     android:shareInterpolator="false">

    <!-- 平移动画效果 从左到右  改变x轴坐标-->

    <translate 

        android:fromXDelta="100%p"

        android:toXDelta="0"

        android:duration="2000"

    />

</set>

exit_righttoleft(从右向左退出动画)

<?xml version="1.0" encoding="utf-8"?>

<set xmlns:android="http://schemas.android.com/apk/res/android"

     android:shareInterpolator="false">

    <!-- 平移动画效果  改变x轴坐标-->

    <translate 

        android:fromXDelta="0"

        android:toXDelta="-100%p"

        android:duration="2000"

    />

</set>


5. 关于string.xml文件

<?xml version="1.0" encoding="utf-8"?>

<resources>



    <string name="hello">打开新Activity</string>

    <string name="app_name">Animation</string>

    <string name="new_window">新窗口</string>

    <string name="new_activity">这是新Activity</string>

    <string name="first_acvivity">第一页</string>

    <string name="second_acvivity">第二页</string>

</resources>

6. 成功实现,运行看效果吧~~~

你可能感兴趣的:(android)