Add the item animation effect to the shopping cart based on the beiser curve.

Add the item animation effect to the shopping cart based on the beiser curve.

As follows:

1. activity_main.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">    <FrameLayout        android: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">        <ImageView            android: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" />        <TextView            android: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>    <ListView        android: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>

Menu_shop_car_selected.png

Corner_view.xml

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android">    <solid android:color="@color/red" />    <corners android:radius="10dp" />    <padding android:left="5dp" android:top="1dp"        android:right="5dp" android:bottom="1dp" /></shape>

　　

2. adapter_shopping_cart_item.xml

<? Xml version = "1.0" encoding = "UTF-8"?> <RelativeLayout xmlns: android = "http://schemas.android.com/apk/res/android" android: layout_width = "match_parent" android: layout_marginBottom = "1dp" android: layout_height = "wrap_content" android: paddingBottom = "@ dimen/activity_vertical_margin" android: paddingLeft = "@ dimen/activity_horizontal_margin" android: paddingRight = "@ dimen/activity_horizontal_margin" android: paddingTop = "@ dimen/activity_vertical_margin"> <ImageView android: id = "@ + id/iv_shopping_cart_item" android: layout_width = "30dp" android: layout_height = "30dp" android: layout_centerVertical = "true" android: src = "@ mipmap/ic_launcher"/> <TextView android: id = "@ + id/TV _shopping_cart_item" android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: text = "" android: textSize = "16sp" android: layout_alignParentRight = "true" android: layout_centerVertical = "true"/> </RelativeLayout>

3. MainActivity

Public class MainActivity extends AppCompatActivity {// shopping carparent layout private RelativeLayout mShoppingCartRly; // private ListView mShoppingCartLv is displayed in the shopping Carlist; // private TextView mShoppingCartCountTv is displayed in the shopping cart list; // private ImageView mShoppingCartIv is displayed in the shopping cart image; // The shopping cart adapter private GoodsAdapter mGoodsAdapter; // the data source (Shopping Cart product image) private ArrayList <GoodsModel> mData; // private float [] mCurrentPosition = new fl Oat [2]; // path measurement private PathMeasure mPathMeasure; // Number of cart items private int goodsCount = 0; @ Override protected void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); setContentView (R. layout. activity_main); // findView mShoppingCartLv = (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); // whether to display the number of items in the shopping cart isShowCartGoodsCount (); // Add the data source addData (); // set the adapter setAdapter ();} private void setAdapter () {// initialize the adapter mGoodsAdapter = new GoodsAdapter (this, mData); // set the adapter to listen to mGoodsAdapter. setCallBackListener (new GoodsA Dapter. callBackListener () {@ Override public void callBackImg (ImageView goodsImg) {// Add a commodity to the cart addGoodsToCart (goodsImg) ;}}); // set the adapter mShoppingCartLv. setAdapter (mGoodsAdapter);} private void addGoodsToCart (ImageView goodsImg) {// create the animation-executing topic goodsImg (this image is the animation-executing image, starting from the starting position, the final ImageView goods = new ImageView (this); goods. setImageDrawable (goodsImg. getDrawable (); Relativ ELayout. layoutParams params = new RelativeLayout. layoutParams (100,100); mShoppingCartRly. addView (goods, params); // obtain the starting point coordinate of the parent layout (used to help compute the coordinates of points at the animation start/end) int [] parentLocation = new int [2]; mShoppingCartRly. getLocationInWindow (parentLocation); // obtain the coordinates of the product image (used to calculate the coordinates of the animation start) int startLoc [] = new int [2]; goodsImg. getLocationInWindow (startLoc); // get the coordinates of the shopping cart image (used to calculate the coordinates after the animation ends) int endLoc [] = new int [2]; mShoppingCa RtIv. getLocationInWindow (endLoc); // the starting point of the product to be dropped: product start point-parent layout start point + half of the product image float startX = startLoc [0]-parentLocation [0] + goodsImg. getWidth ()/2; float startY = startLoc [1]-parentLocation [1] + goodsImg. getHeight ()/2; // the coordinate of the end point after the commodity falls: shopping cart start point-parent layout start point + 1/5 float toX of the shopping cart image = endLoc [0]-parentLocation [0] + mShoppingCartIv. getWidth ()/5; float toY = endLoc [1]-parentLocation [1]; // start to draw the beiser curve Path = New Path (); // move to the starting point (the starting point of the besell curve) path. moveTo (startX, startY); // use a second-order besell curve: note that the larger the starting coordinate of the first element, the larger the horizontal distance of the besell curve. Generally, follow the following formula to obtain the path. quadTo (startX + toX)/2, startY, toX, toY); // mPathMeasure is used to calculate the length of the curve and the coordinate of the interpolation in the middle of the curve. If it is true, path will form a closed loop mPathMeasure = new PathMeasure (path, false); // attribute animation implementation (interpolation between the length of the beiser curve from 0 to get the distance value of the intermediate process) valueAnimator valueAnimator = ValueAnimator. ofFloat (0, mPathMeasure. getLength (); v AlueAnimator. setDuration (500); // constant speed linear interpolation tool valueAnimator. setInterpolator (new LinearInterpolator (); valueAnimator. addUpdateListener (new ValueAnimator. animatorUpdateListener () {@ Override public void onAnimationUpdate (ValueAnimator animation) {// each value in the middle is obtained when interpolation is performed, // here this value is the curve length in the intermediate process (the coordinate value of the intermediate point is obtained based on this value below) float value = (Float) animation. getAnimatedValue (); // obtain the coordinate of the current vertex and encapsulate it into mCurrentPosition // boolean get PosTan (float distance, float [] pos, float [] tan): // input a distance from distance (0 <= distance <= getLength ()), the coordinates and tangent of the current distance will be calculated, and pos will automatically fill in the coordinates. This method is very important. // MCurrentPosition is the coordinate value of the intermediate distance point mPathMeasure. getPosTan (value, mCurrentPosition, null); // set the coordinates of the moving commodity image (Animated Image) to goods. setTranslationX (mCurrentPosition [0]); goods. setTranslationY (mCurrentPosition [1]) ;}}); // start executing the animation valueAnimator. start (); // process valueAnimator after the animation ends. addListener (new Animator. animatorListener () {@ Override public void onAnimationStart (Animator animation) {}@ Override public void onAnimationEnd (Animator animation) {// Add 1 goodsCount ++ to the number of items in the shopping cart (); mShoppingCartCountTv. setText (String. valueOf (goodsCount); // remove the animated item image from the parent layout mShoppingCartRly. removeView (goods) ;}@ Override public void onAnimationCancel (Animator animation) {}@ Override public void Merge (Animator animation) {}});} private void isShowCartGoodsCount () {if (goodsCount = 0) {mShoppingCartCountTv. setVisibility (View. GONE);} else {mShoppingCartCountTv. setVisibility (View. VISIBLE) ;}} private void addData () {// initialize the data source mData = new ArrayList <> (); // Add the data source GoodsModel goodsModel = new GoodsModel (); goodsModel. setmGoodsBitmap (BitmapFactory. decodeResource (getResources (), R. drawable. goods_one); mData. add (goodsModel); goodsModel = new GoodsModel (); goodsModel. setmGoodsBitmap (BitmapFactory. decodeResource (getResources (), R. drawable. goods_two); mData. add (goodsModel); goodsModel = new GoodsModel (); goodsModel. setmGoodsBitmap (BitmapFactory. decodeResource (getResources (), R. drawable. goods_three); mData. add (goodsModel );}}

4. GoodsAdapter

1 public class GoodsAdapter extends BaseAdapter {2 3 // data source (Shopping Cart image) 4 private ArrayList <GoodsModel> mData; 5 // layout 6 private LayoutInflater mLayoutInflater; 7 // callback listener 8 private CallBackListener mCallBackListener; 9 10 public GoodsAdapter (Context context, ArrayList <GoodsModel> mData) {11 mLayoutInflater = LayoutInflater. from (context); 12 this. mData = mData; 13} 14 15 @ Override16 public int getCount () {17 return mData! = Null? MData. size (): 0; 18} 19 20 @ Override21 public Object getItem (int I) {22 return mData! = Null? MData. get (I): null; 23} 24 25 @ Override26 public long getItemId (int I) {27 return I; 28} 29 30 @ Override31 public View getView (int I, view view, ViewGroup viewGroup) {32 ViewHolder viewHolder; 33 if (view = null) {34 view = mLayoutInflater. inflate (R. layout. adapter_shopping_cart_item, null); 35 viewHolder = new ViewHolder (view); 36 view. setTag (viewHolder); 37} else {38 // reuse ViewHolder39 viewHolder = (Vie WHolder) view. getTag (); 40} 41 42 // update UI43 if (I <mData. size () 44 viewHolder. updateUI (mData. get (I); 45 return view; 46} 47 48 class ViewHolder {49 // display product image 50 private ImageView mShoppingCartItemIv; 51 52 public ViewHolder (View view) {53 // findView54 mShoppingCartItemIv = (ImageView) view. findViewById (R. id. iv_shopping_cart_item); 55 // onClick56 view. findViewById (R. id. TV _shopping_cart_item ). setOnClick Listener (57 new View. OnClickListener () {58 @ Override59 public void onClick (View view) {60 if (mShoppingCartItemIv! = Null & mCallBackListener! = Null) 61 mCallBackListener. callBackImg (mShoppingCartItemIv); 62} 63}); 64} 65 66 public void updateUI (GoodsModel goods) {67 if (goods! = Null68 & goods. getmGoodsBitmap ()! = Null69 & mShoppingCartItemIv! = Null) 70 mShoppingCartItemIv. setImageBitmap (goods. getmGoodsBitmap (); 71} 72} 73 74 public void setCallBackListener (CallBackListener mCallBackListener) {75 this. mCallBackListener = mCallBackListener; 76} 77 78 public interface CallBackListener {79 void callBackImg (ImageView goodsImg); 80} 81 82}

5. GoodsModel

Public class GoodsModel {// Product Map private Bitmap mGoodsBitmap; public Bitmap getmGoodsBitmap () {return mGoodsBitmap;} public void evaluate (Bitmap mGoodsBitmap) {this. mGoodsBitmap = mGoodsBitmap ;}}

　　

　　

Http://www.see-source.com/androidwidget/detail.html? Wid = 914