Android 패키지 앱 시작 애니메이션

호 빵 앱 을 사용 할 때 애니메이션 을 시작 하 는 것 이 매우 재 미 있 는 것 을 발견 하고 모방 을 실현 했다.
gif 효과 도:

animation.gif
실현 방향:
자세히 살 펴 보면 애니메이션 의 집행 은 두 단계 로 나 뉜 다.
1 단 계 는 동전 드 랍 입 니 다.
2 단 계 는 지갑 바 운 드 입 니 다.
레이아웃 xml 파일 은 다음 과 같 습 니 다:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 
      xmlns:tools="http://schemas.android.com/tools" 
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:orientation="vertical"
      tools:context=".MainActivity">
  <ImageView
    android:id="@+id/coin_iv"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:src="@mipmap/coin"/>
  <ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:layout_marginBottom="70dp"
    android:layout_marginLeft="70dp"
    android:src="@mipmap/version"/>
  <ImageView
    android:id="@+id/wallet_iv"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:src="@mipmap/wallet"/>
  <Button
    android:id="@+id/start_btn"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center|bottom"
    android:layout_marginBottom="10dp"
    android:text="start"/>
</FrameLayout>

동전 드 랍:
동전 이 떨 어 지 는 과정 에서 두 가지 애니메이션 을 실행 하고 변위 와 회전 을 합 니 다.
변위 애니메이션 은 추가 애니메이션 을 사 용 했 습 니 다.xml 파일 은 다음 과 같 습 니 다.

<?xml version="1.0" encoding="utf-8"?>
<translate
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:fromYDelta="-50%p"
  android:interpolator="@android:anim/accelerate_interpolator"
  android:toYDelta="0%"/>

회전 애니메이션 은 애니메이션 을 다시 쓰 고 android.hardware.camera 클래스 를 이용 하여 이 루어 집 니 다.

public class ThreeDRotateAnimation extends Animation { 
 int centerX, centerY; 
 Camera camera = new Camera(); 
  @Override
  public void initialize(int width, int height, int parentWidth, int parentHeight) {  
  super.initialize(width, height, parentWidth, parentHeight);  
  //      
  centerX = width / 2;  
  centerY = height / 2; 
  setDuration(500);  
  setInterpolator(new LinearInterpolator()); 
 }  
@Override  
protected void applyTransformation(float interpolatedTime, Transformation t) {  
  final Matrix matrix = t.getMatrix();
  camera.save(); 
  //  y   
  camera.rotateY(360 * interpolatedTime);  
  camera.getMatrix(matrix);  
  //         
  matrix.preTranslate(-centerX, -centerY); 
  matrix.postTranslate(centerX, centerY);   
  camera.restore();  
 }
}

애니메이션 에 있 는 preTranslate 와 post Translate 방법 을 간단하게 말 합 니 다.preTranslate 는 rotateY 앞에서 평평 하 게 이동 하 는 것 을 말 합 니 다.post Translate 는 rotateY 후에 평평 하 게 이동 하 는 것 을 말 합 니 다.그들의 매개 변 수 는 목적지 의 좌 표를 평평 하 게 이동 하 는 것 이 아니 라 평평 하 게 이동 하 는 거리 입 니 다!
회전 은(0,0)을 중심 으로 하기 때문에 동전 의 중심 을(0,0)과 맞 추기 위해 서 는 preTranslate(-centerX,-centerY),rotateY 가 완 성 된 후에 post Translate(centerX,centerY)를 호출 하여 그림 을 옮 겨 야 한다.이렇게 보 이 는 애니메이션 효 과 는 바로 동전 이 중심 에서 끊임없이 회전 하 는 것 이다.
마지막 으로 상기 두 가지 애니메이션 을 동시에 실행 하여 드 롭 회전 효 과 를 실현 합 니 다.

private void startCoin() {
//   
Animation animationTranslate = AnimationUtils.loadAnimation(this,R.anim.anim_top_in);

//   
ThreeDRotateAnimation animation3D = new ThreeDRotateAnimation();
animation3D.setRepeatCount(10);

AnimationSet animationSet = new AnimationSet(true);
animationSet.setDuration(800);
animationSet.addAnimation(animation3D);
animationSet.addAnimation(animationTranslate);
mCoinIv.startAnimation(animationSet);
｝

지갑 튕 김:
동전 이 떨 어 지 는 것 을 실행 하 는 동시에 ValueAnimator 애니메이션 을 시작 하여 지갑 이 튕 겨 나 올 시 기 를 판단 합 니 다.

private void setWallet() {
final ValueAnimator valueAnimator = ValueAnimator.ofFloat(0, 1);
valueAnimator.setDuration(800);
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { 
  @Override  public void onAnimationUpdate(ValueAnimator animation) {
    float fraction = animation.getAnimatedFraction();
    //                 ，  ValueAnimator  ，         
    if (fraction >= 0.75) {
      valueAnimator.cancel();
      startWallet();
    } 
  }});
valueAnimator.start();
｝

마지막 으로 지갑 튕 김 효과 애니메이션 을 실 행 했 습 니 다.여기 에는 ObjectAnimator 를 사 용 했 습 니 다.

private void startWallet() {
  // x   
  ObjectAnimator objectAnimator1 = ObjectAnimator.ofFloat(mLogoIv, "scaleX", 1, 1.1f, 0.9f, 1);
  objectAnimator1.setDuration(600);
  // y    
  ObjectAnimator objectAnimator2 = ObjectAnimator.ofFloat(mLogoIv, "scaleY", 1, 0.75f, 1.25f, 1);
  objectAnimator2.setDuration(600);

  AnimatorSet animatorSet = new AnimatorSet();
  animatorSet.setInterpolator(new LinearInterpolator()); 
  //     x，y      
  animatorSet.playTogether(objectAnimator1, objectAnimator2);
  animatorSet.start();}

이렇게 간단 한 주머니 가 애니메이션 을 시작 하 는 효 과 는 많 지 않 습 니 다.유일 하 게 아 쉬 운 것 은 지갑 을 Y 축 으로 확대 할 때 Y 축 전 체 를 확대 하 는 것 입 니 다.지갑 의 밑부분 을 움 직 이지 않 으 려 면 지갑 윗부분 만 튕 겨 야 합 니 다.아직 좋 은 방법 이 생각 나 지 않 았 습 니 다.동생 은 큰 신의 가르침 을 바 랍 니 다!감사합니다!
전체 원본:
전체 원본 코드GitHub
괜 찮 으 시다 면 start(~)r 를 기억 하 세 요~
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.