안 드 로 이 드 사용자 정의 새해 불꽃놀이,축복 어 배 너 애니메이션 보기

새해 가 되 었 습 니 다.프로젝트 에서 애니메이션 을 만들어 야 합 니 다.전체적으로 컬러 테이프 가 날 아 다 니 고 불꽃 이 하늘 로 치 솟 으 며 불꽃 크기 조정,병아리 가 그림 을 바 꾸 고 병아리 가 날 아 다 니 며 플래카드 재단,전개 등 애니메이션 효 과 를 실현 해 야 합 니 다.전체적으로 속성 애니메이션 을 대량으로 사용 하여 이 루어 졌 습 니 다.
다음 효과 그림:

제 가 실현 하 는 과정 에서 플래카드 의 재단 계산 은 비교적 오래 걸 렸 습 니 다.초판 은 속성 애니메이션 으로 float 의 비율 치 를 계산 하여 각 프레임 의 재단 에 맞 춰 다음 과 같은 코드 를 그 렸 습 니 다.

private static class RollView extends View { 
 private Bitmap mBitmap; 
 private Rect mSrc; 
 private Rect mDst; 
 private int mRollWidth = 60; 
 private float mRate; 
 private boolean mIsStopAnim; 
 
 public RollView(Context context) { 
  super(context); 
  mSrc = new Rect(); 
  mDst = new Rect(); 
 } 
 @Override 
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { 
  super.onMeasure(widthMeasureSpec, heightMeasureSpec); 
 } 
 
 @Override 
 protected void onDraw(Canvas canvas) { 
  if (mBitmap == null) return; 
 
  drawFromMiddleByFloatCompute(canvas); 
 
 } 
 
 private void drawFromMiddleByFloatCompute(Canvas canvas) { 
  /* 
    src      mBitmap.    ，，   drawable           
      ，  view     drawable        
  */ 
  final float rate = mRate; 
 
  mSrc.left = 0; 
  mSrc.top = 0; 
  mSrc.right = mRollWidth; 
  mSrc.bottom = mBitmap.getHeight(); 
 
  mDst.left = (int) ((getWidth() / 2 - mRollWidth) - (getWidth() / 2 - mRollWidth) * rate); 
  mDst.top = 0; 
  mDst.right = mDst.left + mRollWidth + 1;//     ，    +1 
  mDst.bottom = getHeight(); 
  canvas.drawBitmap(mBitmap, mSrc, mDst, null); 
 
  //   
  int sw = (int) ((mBitmap.getWidth() - mRollWidth * 2) * rate); 
  mSrc.left = mBitmap.getWidth() / 2 - sw / 2; 
  mSrc.top = 0; 
  mSrc.right = mSrc.left + sw; 
  mSrc.bottom = mBitmap.getHeight(); 
 
  int dw = (int) ((getWidth() - mRollWidth * 2) * rate); 
  mDst.left = getWidth() / 2 - dw / 2; 
  mDst.top = 0; 
  mDst.right = mDst.left + dw; 
  mDst.bottom = getHeight(); 
  canvas.drawBitmap(mBitmap, mSrc, mDst, null); 
 
  //   
  mSrc.left = mBitmap.getWidth() - mRollWidth; 
  mSrc.top = 0; 
  mSrc.right = mBitmap.getWidth(); 
  mSrc.bottom = mBitmap.getHeight(); 
 
  mDst.left = (int) (getWidth() / 2 + (getWidth() / 2 - mRollWidth) * rate); 
  mDst.top = 0; 
  mDst.right = mDst.left + mRollWidth; 
  mDst.bottom = getHeight(); 
 
  canvas.drawBitmap(mBitmap, mSrc, mDst, null); 
 } 
 
 public void setRes(int resId) { 
  mBitmap = getBitmapFromLocal(resId); 
 } 
 
 @RequiresApi(api = Build.VERSION_CODES.HONEYCOMB) 
 public void startFloatComputeAnim() { 
  /* 
     float     ，           ，           Rect    ， 
  float to int ，      ：1 px           
  */ 
  ValueAnimator animator = ValueAnimator.ofFloat(0, 1); 
  animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { 
  @Override 
  public void onAnimationUpdate(ValueAnimator animation) { 
   if (mIsStopAnim) { 
   animation.cancel(); 
   return; 
   } 
   mRate = (float) animation.getAnimatedValue(); 
   invalidate(); 
 
  } 
  }); 
  animator.setDuration(2000); 
  animator.start(); 
 } 
 
 public void stopAnim() { 
  mIsStopAnim = true; 
 } 
 } 

>float 회전 int 에 정밀도 손실 문제 가 있 기 때문에 계산 에 1px(코드 에 있 음)를 강제로 추가 합 니 다.
이렇게 하면 1px 가 그리 지 않 은 문 제 를 해 결 했 지만 그리 기 가 부 드 럽 지 않 고 떨 리 는 상황 이 발생 할 수 있 습 니 다(일부 devices 에서)
그 러 니까 플 로 트 로 계산 하지 않 는 게 좋 을 것 같 아 요.
>나중에 동료 들 은 고정 int 값 을 사용 하여 계산 에 참여 하면 상기 문 제 를 해결 할 수 있 을 것 이 라 고 추측 했다.
예 를 들 어 초당 30 프레임,여기 애니메이션 시간 은 2 초,즉 총 30*2=60 프레임 이다.
그림 너비,왼쪽 족자,오른쪽 족자  맞다.  60 프레임 수 는 해당 하 는 나눗셈 과 다른 계산 을 하면 한 프레임 에서 그들 이 운동 해 야 할 x 거 리 를 얻 을 수 있다.
>그 다음 에 저 는 속성 애니메이션 을 사용 하여 0 에서 getWidth()사이 의 애니메이션 값 을 계산 하고
따라서 계산 을 통 해 플래카드 를 왼쪽 에서 오른쪽으로 떼 면 다음 과 같다.

코드 가 전체적으로 오픈 되 지 않 습 니 다.
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.