添加商品到购物车动画解析

来源:互联网 发布:网络报警平台电话 编辑:程序博客网 时间:2024/04/30 19:09

引言

对于android人员来说,肯定接触过电商类的app开发,而商品的添加动画会让用户体验提升一大截。

下面我给大家介绍一下如何制作商品的添加动画,先来看一下效果图:
怎么样,是不是还不错啊,接下来我们来看一下如何做到的:

这里写图片描述

  1. 创建动画的层
 /**     * 创建执行的动画层     *     * @return 动画的执行的ViewGroup     */    private ViewGroup createAnimLayout() {        ViewGroup rootView = (ViewGroup) ((Activity) mContext).getWindow().getDecorView();        LinearLayout animLayout = new LinearLayout(mContext);        LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);        animLayout.setLayoutParams(lp);        rootView.addView(animLayout);        return animLayout;    }

2.创建执行动画

/**     * 添加执行动画的view的布局     *     * @param view          执行动画的View     * @param startLocation 动画的开始位置     * @return 执行动画的view     */    private View addViewToAnimLayout(View view, int[] startLocation) {        LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);        lp.leftMargin = startLocation[0];        lp.topMargin = startLocation[1];        view.setLayoutParams(lp);        return view;    }

3.执行动画

 /**     * 执行动画     *     * @param view          执行动画的View     * @param startLocation 执行动画的起始位置坐标     */    private void setAnim(final View view, int[] startLocation) {        anim_layout = createAnimLayout();//创建动画执行层        anim_layout.addView(view);//将动画小球添加到执行层        final View ballView = addViewToAnimLayout(view, startLocation);        int[] endLocation = new int[2];        MainActivity.shopCar.getLocationInWindow(endLocation);        int animLocationX = endLocation[0] - startLocation[0] + 80;        int animLocatiopnY = endLocation[1] - startLocation[1] + 40;        Log.e(TAG, "setAnim: X=" + animLocationX + ":Y=" + animLocatiopnY);        /**         * 创建动画         */        //左右移动画        TranslateAnimation translateAnimationX = new TranslateAnimation(0, animLocationX, 0, 0);        translateAnimationX.setInterpolator(new LinearInterpolator());        translateAnimationX.setRepeatCount(0);// 动画重复执行的次数        translateAnimationX.setFillAfter(true);        //上下移动画        TranslateAnimation translateAnimationY = new TranslateAnimation(0, 0, 0, animLocatiopnY);        translateAnimationY.setInterpolator(new AccelerateInterpolator());        translateAnimationY.setRepeatCount(0);// 动画重复执行的次数        translateAnimationX.setFillAfter(true);        //缩放动画        ScaleAnimation scaleAnimation = new ScaleAnimation(0.3f, 0.1f, 0.3f, 0.1f);        scaleAnimation.setDuration(1);        scaleAnimation.setFillAfter(true);        //动画集合        AnimationSet animationSet = new AnimationSet(false);        animationSet.setFillAfter(false);        animationSet.addAnimation(scaleAnimation);        animationSet.addAnimation(translateAnimationX);        animationSet.addAnimation(translateAnimationY);        animationSet.setDuration(400);        ballView.startAnimation(animationSet);        animationSet.setAnimationListener(new Animation.AnimationListener() {            @Override            public void onAnimationStart(Animation animation) {                ballView.setVisibility(View.VISIBLE);            }            @Override            public void onAnimationEnd(Animation animation) {                ballView.setVisibility(View.GONE);                MainActivity.redCircle.setText(++n + "");                /**                 * 动画结束,下面可以执行向数据库添加购买的货物                 */            }            @Override            public void onAnimationRepeat(Animation animation) {            }        });    }

好了,其实代码也不复杂,点击查看GitHub源码

0 0