欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Android仿荷包APP啟動動畫

 更新時間：2017年02月17日 18:24:33   作者：咖枯  
這篇文章主要為大家詳細(xì)介紹了Android仿荷包APP啟動動畫的相關(guān)代碼，具有一定的參考價值，感興趣的小伙伴們可以參考一下

用荷包App的時候發(fā)現(xiàn)啟動動畫做的挺好玩的，于是便模仿實現(xiàn)了一下。

gif效果圖：


animation.gif

實現(xiàn)思路：

仔細(xì)觀察，可以看出動畫的執(zhí)行分為兩個階段：
第一階段為硬幣掉落。
第二階段為錢包反彈。

布局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>

硬幣掉落：

硬幣掉落的過程中執(zhí)行兩種動畫，位移和旋轉(zhuǎn)。
位移動畫使用了補(bǔ)間動畫，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%"/>

旋轉(zhuǎn)動畫采用了重寫Animation并利用android.hardware.Camera類來實現(xiàn)。

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);  
  // 中心點(diǎn)坐標(biāo)
  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軸旋轉(zhuǎn)
  camera.rotateY(360 * interpolatedTime);  
  camera.getMatrix(matrix);  
  // 設(shè)置翻轉(zhuǎn)中心點(diǎn) 
  matrix.preTranslate(-centerX, -centerY); 
  matrix.postTranslate(centerX, centerY);   
  camera.restore();  
 }
}

這里簡單說下animation里面的preTranslate和postTranslate方法，preTranslate是指在rotateY前平移,postTranslate是指在rotateY后平移，注意他們參數(shù)是平移的距離,而不是平移目的地的坐標(biāo)!
由于旋轉(zhuǎn)是以(0,0)為中心的,所以為了把硬幣的中心與(0,0)對齊,就要preTranslate(-centerX, -centerY), rotateY完成后,調(diào)用postTranslate(centerX, centerY),再把圖片移回來,這樣看到的動畫效果就是硬幣從中心不停的旋轉(zhuǎn)了。
最后同時執(zhí)行以上兩種動畫，實現(xiàn)掉落旋轉(zhuǎn)效果。

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

// 旋轉(zhuǎn)
ThreeDRotateAnimation animation3D = new ThreeDRotateAnimation();
animation3D.setRepeatCount(10);

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

錢包反彈：

在執(zhí)行硬幣掉落的同時，啟動一個ValueAnimator動畫，來判斷錢包反彈的時機(jī)。

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動畫，并執(zhí)行錢包反彈效果
    if (fraction >= 0.75) {
      valueAnimator.cancel();
      startWallet();
    } 
  }});
valueAnimator.start();
｝

最后執(zhí)行錢包反彈效果動畫，這里采用了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()); 
  // 同時執(zhí)行x，y軸縮放動畫 
  animatorSet.playTogether(objectAnimator1, objectAnimator2);
  animatorSet.start();}

這樣一個簡單的荷包啟動動畫效果就差不多出來了，唯一遺憾的是對錢包進(jìn)行y軸縮放的時候會對整個y軸進(jìn)行縮放，要想保持錢包底部不動，只有錢包上部反彈，暫時還沒有想到什么好的方法，小弟不才還望大神賜教！謝謝！

完整源碼：

完整源碼在GitHub
如果覺得還不錯，記得star╰(￣▽￣)╮喲~

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

最新評論