用两张图片实现的2D动画效果(翻转)

这可能是简单的动画效果吧,但是感觉还挺有意思的。暴露水平了,哈哈。
效果如下


用两张图片实现的2D动画效果(翻转)_第1张图片


XML代码如下,很简单只有两个imageview

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/framelayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.dreverse.MainActivity" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:src="@drawable/image1" />

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:src="@drawable/image2" />

FrameLayout>

java代码,也挺简单的

/*the reversing animation of two pictures
 * @author stephenson feng
 * @date 2016-9-4
 * */
package com.example.dreverse;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.ScaleAnimation;
import android.widget.ImageView;

public class MainActivity extends Activity {

    private ImageView imageview1;
    private ImageView imageview2;
    //第一个动画,效果是像翻转似得消失
    //第一个参数和第二个参数表示在x轴上的变化:从1变为0。
    //第三个参数和第四个参数表示在y轴上的变化:从1变为1,没有变化。
    //第五个参数和第六个参数表示在x轴上的变化所参考的位置:RELATIVE_TO_PARENT沿着父级空间,0.5f的中心点。
    //第七个参数和第八个参数表示在y轴上的变化所参考的位置:含义与x轴类似
    private ScaleAnimation sato1=new ScaleAnimation(1, 0, 1, 1, 
            Animation.RELATIVE_TO_PARENT, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
    //第二个动画,效果是像翻转似得出现
    private ScaleAnimation sato2=new ScaleAnimation(0, 1, 1, 1, 
            Animation.RELATIVE_TO_PARENT, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //自定义的一个初始化方法
        initImage();
        //主布局使用的是框架布局framelayout,其中只有一个图片,所以点击framelayout时候就翻转图片
        findViewById(R.id.framelayout1).setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                if (imageview1.isShown()) {//当前的图片是图片1
                    imageview1.startAnimation(sato1);//图片1翻转式消失
                }else {//当前图片是图片2的话,图片2就翻转式消失
                    imageview2.startAnimation(sato1);
                }
            }
        });
    }
    private void showImage1(){
        imageview1.setVisibility(View.VISIBLE);//图片1可见
        imageview2.setVisibility(View.INVISIBLE);//图片2不可见
    }
    private void showImage2(){
        imageview1.setVisibility(View.INVISIBLE);//图片1不可见
        imageview2.setVisibility(View.VISIBLE);//图片2可见
    }
    private void initImage(){
        imageview1 = (ImageView) findViewById(R.id.imageView1);
        imageview2 = (ImageView) findViewById(R.id.imageView2);
        showImage1();//默认显示图片1
        sato1.setDuration(1000);//给动画设置执行时间
        sato2.setDuration(1000);
        //给动画1设置时间监听器,因为要的效果是:在动画一结束时立即开始动画2
        sato1.setAnimationListener(new AnimationListener() {

            @Override
            public void onAnimationStart(Animation animation) {
                // TODO Auto-generated method stub
            }

            @Override
            public void onAnimationRepeat(Animation animation) {
                // TODO Auto-generated method stub
            }
            //动画结束的时候执行的方法          
            @Override
            public void onAnimationEnd(Animation animation) {
                //如果当前图片是图片1
                if (imageview1.getVisibility()==View.VISIBLE) {
                    //把图片1的动画设置为空,现在图片1的不需要了。也方便下一次设置动画
                    imageview1.setAnimation(null);
                    imageview2.startAnimation(sato2);//图片2按照动画2出场   
                    showImage2();//动画播完了后,把图片2显示出来
                }else {//如果当前的图片是图片2,图片1就翻转式的出现
                    imageview2.setAnimation(null);
                    imageview1.startAnimation(sato2);
                    showImage1();
                }
            }
        });
    }
}

你可能感兴趣的:(java)