android 360度图片翻转、旋转动画等待框

最新推荐文章于 2024-04-10 15:06:22 发布

原创最新推荐文章于 2024-04-10 15:06:22 发布 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#android #动画 #图片

本文介绍了一种使用缩放动画实现的翻转效果，通过两个阶段的动画改变图片大小，达到A面到B面的视觉翻转。动画利用了加速和减速插值器，并通过EventBus在Activity中管理Dialog的显示与关闭。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

代码很简单，主要原理是通过缩放动画scale来达成视觉效果【翻转过程略带加减速】，不过由于该Dialog是通过Activity来呈现出来，所以当需要关闭该Dialog时是用EventBus发送通知关闭。

1：代表图片原来大小

0：代表图片缩小到没有

思路：A面从 1 缩小到 0 转换成B面从 0 ->1->0的过程

以下是在 res/anim 文件夹里面的

waiting_first_animation

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_interpolator">
    <scale
        android:duration="200"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="0.0"
        android:toYScale="1.0" />
</set>

waiting_second_animation

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/decelerate_interpolator">
    <scale
        android:duration="700"
        android:fromXScale="0.0"
        android:fromYScale="1.0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="1.0"
        android:toYScale="1.0" />
</set>

以下是WaitingDialogActivity

<span style="color:#333333;">package com.fanlai.app.view.dialog.footDialog;

import android.app.Activity;
import android.os.Bundle;
import android.view.Window;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;
import android.widget.TextView;

import com.fanlai.app.R;
import com.fanlai.app.Util.StringUntil;
import com.fanlai.app.bean.WaitintEvent;

import de.greenrobot.event.EventBus;
import de.greenrobot.event.Subscribe;
import de.greenrobot.event.ThreadMode;

/**
 * Created by ${baiyu} on 2016/7/12.
 */
public class WaitingDialog extends Activity {
    private String text;
    private TextView waitText;
    private ImageView waitLogo;
    private Animation animation;
    private boolean bool = false;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.waiting_dialog);
        initView();
        doTherThing();
    }

    private void doTherThing() {
        text = getIntent().getStringExtra("dialogText");
        if (StringUntil.isNotEmpty(text)) {
            waitText.setText(text);
        }
        EventBus.getDefault().register(this);
        setAnimation1();
    }

    private void setAnimation1() {
        animation = AnimationUtils.loadAnimation(WaitingDialog.this, R.anim.waiting_loading1);
        animation.setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
            }

            @Override
            public void onAnimationRepeat(Animation animation) {
            }

            @Override
            public void onAnimationEnd(Animation animation) {
                if (bool) {
                    bool = false;
                    waitLogo.setBackgroundResource(R.drawable.wait_menu);
                } else {
                    waitLogo.setBackgroundResource(R.drawable.wait_logo);
                    bool = true;
                }
                setAnimation2();
            }
        });
        waitLogo.startAnimation(animation);
    }

    private void setAnimation2() {
        animation = AnimationUtils.loadAnimation(WaitingDialog.this, R.anim.waiting_loading2);
        animation.setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
            }

            @Override
            public void onAnimationRepeat(Animation animation) {
            }

            @Override
            public void onAnimationEnd(Animation animation) {
                setAnimation1();
            }
        });
        waitLogo.startAnimation(animation);
    }

    private void initView() {
        waitLogo = (ImageView) findViewById(R.id.wait_logo);
        waitText = (TextView) findViewById(R.id.loading_text);
    }

    @Subscribe(threadMode = ThreadMode.MainThread)
    public void onShowMessageEvent(WaitintEvent messageEvent) {
        finish();
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        EventBus.getDefault().unregister(this);
        waitLogo.setBackground(null);
        waitLogo = null;
    }
}</span>

avtivity布局

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#88000000"
    >
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        >
        <ImageView
            android:layout_centerInParent="true"
            android:layout_centerHorizontal="true"
            android:id="@+id/wait_logo"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/wait_logo" />

        <TextView
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:id="@+id/loading_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/wait_logo"
            android:layout_marginTop="18dp"
            android:text="Loading..."
            android:textSize="16dp"
            android:textColor="@color/white" />
    </RelativeLayout>
</RelativeLayout>