Android studio 实现图片旋转效果

这个图片翻转效果有些类似于支付宝五福翻转的效果,或者是游戏中的翻拍效果先附上效果图


第一步是两个正面反面的布局很简单就是一个ImageView和Textview组成我拿其中一个举例

xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/main_fl_card_front"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

            android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:contentDescription="@null"
        android:padding="16dp"
        android:src="@mipmap/two"/>

            android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:textSize="20sp"
        android:text="大姑娘"
        android:textColor="@android:color/white"/>

第二部主页布局

xml version="1.0" encoding="utf-8"?>
xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/main_fl_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:onClick="fipCard"
    tools:context="com.example.administrator.cardflip.MainActivity">

    layout="@layout/cell_card_front">
    layout="@layout/cell_card_back">


第三部 书写属性动画

动画出

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

    android:duration="3000"
        android:propertyName="rotationY"
        android:valueFrom="0"
        android:valueTo="180dp">

    

    android:duration="0"
        android:propertyName="alpha"
        android:startOffset="1500"
        android:valueFrom="1.0"
        android:valueTo="0.0">

    
动画进

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

    android:duration="0"
        android:propertyName="alpha"
        android:valueFrom="1.0"
        android:valueTo="0.0">
    
    android:duration="3000"
        android:propertyName="rotationY"
        android:valueFrom="-180"
        android:valueTo="0">
    
    android:duration="0"
        android:propertyName="alpha"
        android:startOffset="1500"
        android:valueFrom="0.0"
        android:valueTo="1.0">

第四部整合代码实现效果

public class MainActivity extends AppCompatActivity {
    AnimatorSet mRightOutSet, mLeftOutSet;
    boolean mIsShowBack;
    @BindView(R.id.main_fl_card_back)
    RelativeLayout mainFlCardBack;
    @BindView(R.id.main_fl_card_front)
    RelativeLayout mainFlCardFront;
    @BindView(R.id.main_fl_container)
    RelativeLayout mainFlContainer;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.bind(this);
        setAnimators();//设置动画
        setCameraDistance();//设置距离


    }

    //设置动画
    private void setAnimators() {
        mRightOutSet = (AnimatorSet) AnimatorInflater.loadAnimator(this, R.animator.anim_out);
        mLeftOutSet = (AnimatorSet) AnimatorInflater.loadAnimator(this, R.animator.anim_in);
        //设置点击事件
        mRightOutSet.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationStart(Animator animation) {
                super.onAnimationStart(animation);
                mainFlContainer.setClickable(false);
            }
        });

        mLeftOutSet.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationStart(Animator animation) {
                super.onAnimationStart(animation);
                mainFlContainer.setClickable(true);
            }
        });

    }

    //改变视角距离,贴近屏幕
    private void setCameraDistance() {
        int distance = 16000;
        float scale = getResources().getDisplayMetrics().density * distance;
        mainFlCardFront.setCameraDistance(scale);
        mainFlCardBack.setCameraDistance(scale);
    }

    //点击卡片翻转卡片
    public void fipCard(View view) {
        //正面朝上
        if (!mIsShowBack) {
            mRightOutSet.setTarget(mainFlCardBack);
            mLeftOutSet.setTarget(mainFlCardFront);
            mRightOutSet.start();
            mLeftOutSet.start();
            mIsShowBack = true;
        } else {
            mRightOutSet.setTarget(mainFlCardFront);
            mLeftOutSet.setTarget(mainFlCardBack);
            mRightOutSet.start();
            mLeftOutSet.start();
            mIsShowBack = false;


        }
    }



}

希望对你有帮助


项目地址:http://download.csdn.net/detail/liufatao/9750898





你可能感兴趣的:(Android,动画)