Android 添加到購物車動畫(附源碼)

最近項目有一個簽到功能，類似于添加購物車功能，于是自己通過動畫來實作這一功能，廢話不多說，先上截圖

gif有點卡針，需要的話我會在後面附上源碼。現在就上代碼了，代碼注釋比較詳細，不懂得可以自己百度或者留言和我一起讨論，畢竟自己了解才是最好的學習之路

shop.setOnClickListener(new OnClickListener() {
			@Override
			public void onClick(View v) {
				int[] start_location = new int[2];// 一個整型數組，用來存儲按鈕的在螢幕的X、Y坐标
				v.getLocationInWindow(start_location);// 這是擷取購買按鈕的在螢幕的X、Y坐标（這也是動畫開始的坐标）
				ImageView buyImg = new ImageView(getApplicationContext());// buyImg是動畫的圖檔，我的是一個小球（R.drawable.sign）
				buyImg.setImageResource(R.drawable.sign);// 設定buyImg的圖檔
				setAnim(buyImg, start_location);// 開始執行動畫				
			}
		});
           

執行動畫代碼

private void setAnim(final View v, int[] start_location) {
		ViewGroup anim_mask_layout = null;
		anim_mask_layout = createAnimLayout();//建立動畫視圖
		anim_mask_layout.addView(v);//把動畫小球添加到動畫層
		final View view = addViewToAnimLayout(anim_mask_layout, v,
				start_location);
		int[] end_location = new int[2];// 這是用來存儲動畫結束位置的X、Y坐标
		imageView.getLocationInWindow(end_location);// shopCart是那個購物車

		// 計算位移
		int endX = end_location[0]- start_location[0];// 動畫位移的X坐标
		int endY = end_location[1] - start_location[1];// 動畫位移的y坐标
		TranslateAnimation translateAnimationX = new TranslateAnimation(0,
				endX, 0, 0);
		translateAnimationX.setInterpolator(new LinearInterpolator());
		translateAnimationX.setRepeatCount(0);// 動畫重複執行的次數
		translateAnimationX.setFillAfter(true);

		TranslateAnimation translateAnimationY = new TranslateAnimation(0, 0,
				0, endY);
		translateAnimationY.setInterpolator(new AccelerateInterpolator());
		translateAnimationY.setRepeatCount(0);// 動畫重複執行的次數
		translateAnimationX.setFillAfter(true);

		AnimationSet set = new AnimationSet(false);
		set.setFillAfter(false);
		set.addAnimation(translateAnimationY);
		set.addAnimation(translateAnimationX);
		set.setDuration(800);// 動畫的執行時間
		view.startAnimation(set);
		// 動畫監聽事件
		set.setAnimationListener(new AnimationListener() {
			// 動畫的開始
			@Override
			public void onAnimationStart(Animation animation) {
				v.setVisibility(View.VISIBLE);
			}

			@Override
			public void onAnimationRepeat(Animation animation) {
				// TODO Auto-generated method stub
			}

			// 動畫的結束
			@Override
			public void onAnimationEnd(Animation animation) {
				v.setVisibility(View.GONE);
			}
		});

	}
           

建立動畫視圖代碼

/**
	 * @Description: 建立動畫層
	 * @param
	 * @return void
	 * @throws
	 */
	private ViewGroup createAnimLayout() {
		ViewGroup rootView = (ViewGroup) this.getWindow().getDecorView();
		LinearLayout animLayout = new LinearLayout(this);
		LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(
				LinearLayout.LayoutParams.MATCH_PARENT,
				LinearLayout.LayoutParams.MATCH_PARENT);
		animLayout.setLayoutParams(lp);
		animLayout.setId(Integer.MAX_VALUE);
		animLayout.setBackgroundResource(android.R.color.transparent);
		rootView.addView(animLayout);
		return animLayout;
	}
           

将視圖添加到動畫布局中去---addViewToAnimLayout()

private View addViewToAnimLayout(final ViewGroup vg, final View view,
			int[] location) {
		int x = location[0];
		int y = location[1];
		LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(
				LinearLayout.LayoutParams.WRAP_CONTENT,
				LinearLayout.LayoutParams.WRAP_CONTENT);
		lp.leftMargin = x;
		lp.topMargin = y;
		view.setLayoutParams(lp);
		return view;
	}
           

好了，到了這裡，基本代碼就實作了，具體位置可以自己調節，我這邊隻是實作一個比較簡單的DEMO。可以根據自己的需求進行布局的改變

源碼位址：源碼下載下傳，下載下傳源碼後請給我一個評分或者分享，畢竟你們的支援才是我前進的最大動力，在此謝過了........

                                                                                                                                                                                                   from:有點中二的碼農