资讯专栏INFORMATION COLUMN

Android实现购物车页面及购物车效果(点击动画)

whidy / 3782人阅读

摘要:效果图如下思路思考每个条目中的数字的更新原理。购物车的动画效果。购物清单怎么显示这个我暂时没有写,如果需要的话,可以在我的简书下给我留言。

效果图如下:

思路:

(1)思考每个条目中的数字的更新原理。

(2)购物车的动画效果。

(3)购物清单怎么显示(这个我暂时没有写,如果需要的话,可以在我的简书下给我留言)。

1.因为进入页面,所有的商品个数都显示为零,所以我用 ArrayList> data,把商品集合都附上零:

        //下面把data都添加0,为了刚开始显示时,显示的是0
        for (int i = 0; i < list.size(); i++) {
            HashMap myhashmap = new HashMap();
            myhashmap.put("number", "" + 0);
            data.add(myhashmap);
        }

然后把data传入Adapter:

     adapter = new MyAdapter(data);

当我们对商品进行增减时,我们可以通过hashmap来更改,如下是增加商品的部分代码:

    b = Integer.parseInt((String) data.get(position).get(
                            "number"));
                    data.get(position).put("number", "" + (b + 1));

2.购物车动画效果:

首先获取点击时的XY坐标,并且设置动画图片:

// ball是个imageview
 startLocation = new int[2];// 一个整型数组,用来存储按钮的在屏幕的X、Y坐标
                   view.getLocationInWindow(startLocation);// 这是获取购买按钮的在屏幕的X、Y坐标(这也是动画开始的坐标)
                   ball = new ImageView(MainActivity.this);
                   ball.setImageResource(R.mipmap.sign);// 设置动画的图片我的是一个小球(R.mipmap.sign)

然后是开始执行动画:

    private void setAnim(final View v, int[] startLocation) {
       anim_mask_layout = null;
       anim_mask_layout = createAnimLayout(); //创建动画层
       anim_mask_layout.addView(v);//把动画小球添加到动画层
       final View view = addViewToAnimLayout(anim_mask_layout, v,
               startLocation);
       int[] endLocation = new int[2];// 存储动画结束位置的X、Y坐标
       re_zhongcai_tanchu.getLocationInWindow(endLocation);// re_zhongcai_tanchu是那个抛物线最后掉落的控件

       // 计算位移
       int endX = 0 - startLocation[0] + 40;// 动画位移的X坐标
       int endY = endLocation[1] - startLocation[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);

       final AnimationSet set = new AnimationSet(false);
       set.setFillAfter(false);
       set.addAnimation(translateAnimationY);
       set.addAnimation(translateAnimationX);
       set.setDuration(800);// 动画的执行时间
       view.startAnimation(set);
       // 动画监听事件
       set.setAnimationListener(new Animation.AnimationListener() {
           // 动画的开始
           @Override
           public void onAnimationStart(Animation animation) {
               v.setVisibility(View.VISIBLE);
               //    Log.e("动画","asdasdasdasd");
           }

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

           // 动画的结束
           @Override
           public void onAnimationEnd(Animation animation) {
               v.setVisibility(View.GONE);
               set.cancel();
               animation.cancel();
           }
       });

   }

需要注意的是,当动画结束必须关闭动画:

  v.setVisibility(View.GONE);
              set.cancel();
              animation.cancel();

购物车的弹出清单功能,我没有写,需要的话,可以去我的简书留言.

我的github地址

我的公众号如下:

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/70244.html

相关文章

  • 【收藏篇】32篇技术博文汇总(九月总结)

    摘要:首先先祝大家国庆节快乐今天距离为我运营公众号已经一个月了,今天把文章整合一下,希望对大家有帮助,也谢谢朋友的支持,我会继续坚持原创,写更好的文章给大家一视频获取学习资源分享合集二功能篇实现金额的语音播报功能基于模式风格的封装之路炫酷动画跳 showImg(https://segmentfault.com/img/remote/1460000011437678?w=900&h=500);...

    whlong 评论0 收藏0
  • 【收藏篇】32篇技术博文汇总(九月总结)

    摘要:首先先祝大家国庆节快乐今天距离为我运营公众号已经一个月了,今天把文章整合一下,希望对大家有帮助,也谢谢朋友的支持,我会继续坚持原创,写更好的文章给大家一视频获取学习资源分享合集二功能篇实现金额的语音播报功能基于模式风格的封装之路炫酷动画跳 showImg(https://segmentfault.com/img/remote/1460000011437678?w=900&h=500);...

    Eric 评论0 收藏0

发表评论

0条评论

whidy

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<