Code

首先写购物车布局xml，代码如下：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:id="@+id/rly_bezier_curve_shopping_cart"android:layout_width="match_parent"android:layout_height="match_parent"android:paddingBottom="@dimen/activity_vertical_margin"android:paddingLeft="@dimen/activity_horizontal_margin"android:paddingRight="@dimen/activity_horizontal_margin"android:paddingTop="@dimen/activity_vertical_margin"><FrameLayoutandroid:id="@+id/fly_bezier_curve_shopping_cart"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_alignParentBottom="true"android:layout_alignParentLeft="true"android:paddingRight="30dp"android:layout_alignParentStart="true"><ImageViewandroid:id="@+id/iv_bezier_curve_shopping_cart"android:layout_width="40dp"android:layout_height="40dp"android:layout_gravity="right"android:src="@drawable/menu_shop_car_selected" /><TextViewandroid:id="@+id/tv_bezier_curve_shopping_cart_count"android:layout_width="wrap_content"android:layout_height="wrap_content"android:textColor="@color/white"android:background="@drawable/corner_view"android:text="0"android:layout_gravity="right"/></FrameLayout><ListViewandroid:id="@+id/lv_bezier_curve_shopping_cart"android:layout_width="match_parent"android:layout_height="match_parent"android:layout_above="@+id/fly_bezier_curve_shopping_cart"/>
</RelativeLayout>

然后写购物车适配器、实体类，代码如下：

/*** @className: GoodsAdapter* @classDescription: 购物车商品适配器* @author: leibing* @createTime: 2016/09/28*/
public class GoodsAdapter extends BaseAdapter {// 数据源（购物车商品图片）private ArrayList<GoodsModel> mData;// 布局private LayoutInflater mLayoutInflater;// 回调监听private CallBackListener mCallBackListener;/*** 构造函数* @author leibing* @createTime 2016/09/28* @lastModify 2016/09/28* @param context 上下文* @param mData 数据源（购物车商品图片）* @return*/public GoodsAdapter(Context context, ArrayList<GoodsModel> mData){mLayoutInflater = LayoutInflater.from(context);this.mData = mData;}@Overridepublic int getCount() {return mData != null ? mData.size(): 0;}@Overridepublic Object getItem(int i) {return mData != null ? mData.get(i): null;}@Overridepublic long getItemId(int i) {return i;}@Overridepublic View getView(int i, View view, ViewGroup viewGroup) {ViewHolder viewHolder;if (view == null){view = mLayoutInflater.inflate(R.layout.adapter_shopping_cart_item, null);viewHolder = new ViewHolder(view);view.setTag(viewHolder);}else {// 复用ViewHolderviewHolder = (ViewHolder) view.getTag();}// 更新UIif (i < mData.size())viewHolder.updateUI(mData.get(i));return view;}/*** @className: ViewHolder* @classDescription: 商品ViewHolder* @author: leibing* @createTime: 2016/09/28*/class  ViewHolder {// 显示商品图片private ImageView mShoppingCartItemIv;/*** 构造函数* @author leibing* @createTime 2016/09/28* @lastModify 2016/09/28* @param view 视图* @return*/public ViewHolder(View view){// findViewmShoppingCartItemIv = (ImageView) view.findViewById(R.id.iv_shopping_cart_item);// onClickview.findViewById(R.id.tv_shopping_cart_item).setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View view) {if (mShoppingCartItemIv != null && mCallBackListener != null)mCallBackListener.callBackImg(mShoppingCartItemIv);}});}/*** 更新UI* @author leibing* @createTime 2016/09/28* @lastModify 2016/09/28* @param goods 商品实体对象* @return*/public void updateUI(GoodsModel goods){if (goods != null&& goods.getmGoodsBitmap() != null&& mShoppingCartItemIv != null)mShoppingCartItemIv.setImageBitmap(goods.getmGoodsBitmap());}}/*** 设置回调监听* @author leibing* @createTime 2016/09/28* @lastModify 2016/09/28* @param mCallBackListener 回调监听* @return*/public void setCallBackListener(CallBackListener mCallBackListener){this.mCallBackListener = mCallBackListener;}/*** @interfaceName: CallBackListener* @interfaceDescription: 回调监听* @author: leibing* @createTime: 2016/09/28*/public interface CallBackListener{void callBackImg(ImageView goodsImg);}
}

    // 购物车父布局private RelativeLayout mShoppingCartRly;// 购物车列表显示private ListView mShoppingCartLv;// 购物数目显示private TextView mShoppingCartCountTv;// 购物车图片显示private ImageView mShoppingCartIv;// 购物车适配器private GoodsAdapter mGoodsAdapter;// 数据源（购物车商品图片）private ArrayList<GoodsModel> mData;// 贝塞尔曲线中间过程点坐标private float[] mCurrentPosition = new float[2];// 路径测量private PathMeasure mPathMeasure;// 购物车商品数目private int goodsCount = 0;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);// findViewmShoppingCartLv = (ListView) findViewById(R.id.lv_bezier_curve_shopping_cart);mShoppingCartCountTv = (TextView) findViewById(R.id.tv_bezier_curve_shopping_cart_count);mShoppingCartRly = (RelativeLayout) findViewById(R.id.rly_bezier_curve_shopping_cart);mShoppingCartIv = (ImageView) findViewById(R.id.iv_bezier_curve_shopping_cart);// 是否显示购物车商品数目isShowCartGoodsCount();// 添加数据源addData();// 设置适配器setAdapter();}/*** 设置适配器* @author leibing* @createTime 2016/09/28* @lastModify 2016/09/28* @param* @return*/private void setAdapter() {// 初始化适配器mGoodsAdapter = new GoodsAdapter(this, mData);// 设置适配器监听mGoodsAdapter.setCallBackListener(new GoodsAdapter.CallBackListener() {@Overridepublic void callBackImg(ImageView goodsImg) {// 添加商品到购物车addGoodsToCart(goodsImg);}});// 设置适配器mShoppingCartLv.setAdapter(mGoodsAdapter);}

/*** 添加商品到购物车* @author leibing* @createTime 2016/09/28* @lastModify 2016/09/28* @param goodsImg 商品图标* @return*/private void addGoodsToCart(ImageView goodsImg) {// 创造出执行动画的主题goodsImg（这个图片就是执行动画的图片,从开始位置出发,经过一个抛物线（贝塞尔曲线）,移动到购物车里）final ImageView goods = new ImageView(this);goods.setImageDrawable(goodsImg.getDrawable());RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(100, 100);mShoppingCartRly.addView(goods, params);// 得到父布局的起始点坐标（用于辅助计算动画开始/结束时的点的坐标）int[] parentLocation = new int[2];mShoppingCartRly.getLocationInWindow(parentLocation);// 得到商品图片的坐标（用于计算动画开始的坐标）int startLoc[] = new int[2];goodsImg.getLocationInWindow(startLoc);// 得到购物车图片的坐标(用于计算动画结束后的坐标)int endLoc[] = new int[2];mShoppingCartIv.getLocationInWindow(endLoc);// 开始掉落的商品的起始点：商品起始点-父布局起始点+该商品图片的一半float startX = startLoc[0] - parentLocation[0] + goodsImg.getWidth() / 2;float startY = startLoc[1] - parentLocation[1] + goodsImg.getHeight() / 2;// 商品掉落后的终点坐标：购物车起始点-父布局起始点+购物车图片的1/5float toX = endLoc[0] - parentLocation[0] + mShoppingCartIv.getWidth() / 5;float toY = endLoc[1] - parentLocation[1];// 开始绘制贝塞尔曲线Path path = new Path();// 移动到起始点（贝塞尔曲线的起点）path.moveTo(startX, startY);// 使用二阶贝塞尔曲线：注意第一个起始坐标越大，贝塞尔曲线的横向距离就会越大，一般按照下面的式子取即可path.quadTo((startX + toX) / 2, startY, toX, toY);// mPathMeasure用来计算贝塞尔曲线的曲线长度和贝塞尔曲线中间插值的坐标，如果是true，path会形成一个闭环mPathMeasure = new PathMeasure(path, false);// 属性动画实现（从0到贝塞尔曲线的长度之间进行插值计算，获取中间过程的距离值）ValueAnimator valueAnimator = ValueAnimator.ofFloat(0, mPathMeasure.getLength());valueAnimator.setDuration(500);// 匀速线性插值器valueAnimator.setInterpolator(new LinearInterpolator());valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {@Overridepublic void onAnimationUpdate(ValueAnimator animation) {// 当插值计算进行时，获取中间的每个值，// 这里这个值是中间过程中的曲线长度（下面根据这个值来得出中间点的坐标值）float value = (Float) animation.getAnimatedValue();// 获取当前点坐标封装到mCurrentPosition// boolean getPosTan(float distance, float[] pos, float[] tan) ：// 传入一个距离distance(0<=distance<=getLength())，然后会计算当前距离的坐标点和切线，pos会自动填充上坐标，这个方法很重要。// mCurrentPosition此时就是中间距离点的坐标值mPathMeasure.getPosTan(value, mCurrentPosition, null);// 移动的商品图片（动画图片）的坐标设置为该中间点的坐标goods.setTranslationX(mCurrentPosition[0]);goods.setTranslationY(mCurrentPosition[1]);}});// 开始执行动画valueAnimator.start();// 动画结束后的处理valueAnimator.addListener(new Animator.AnimatorListener() {@Overridepublic void onAnimationStart(Animator animation) {}@Overridepublic void onAnimationEnd(Animator animation) {// 购物车商品数量加1goodsCount ++;isShowCartGoodsCount();mShoppingCartCountTv.setText(String.valueOf(goodsCount));// 把执行动画的商品图片从父布局中移除mShoppingCartRly.removeView(goods);}@Overridepublic void onAnimationCancel(Animator animation) {}@Overridepublic void onAnimationRepeat(Animator animation) {}});}

代码分析完毕，一个高逼格贝塞尔曲线实现的购物车添加商品动画效果实现分析完毕~~

效果图如下：