android网购功能,网购Android App购物车点击动画实现详解

在做网购APP时,很多的app在点击购物车时都有一个图片动画效果,比较形象,我目前做的项目也涉及到了,把我使用的方法做个笔记:

先看一个简单的截图:

fff6c98081bf8904098fb5e1bd59ff4b.gif我们在点击列表中带+号的购物车时,会有一个图片多点击的购物车位置跑到右上角的购物车中,同时右上角的购物车数量增加1,实现原理很简单,就是我们常用的位移动画:

首先要个动画层ViewGroup anim_mask_layout;动画图片就在这个动画层上面移动:

创建动画层代码:

public ViewGroup createAnimLayout() {

ViewGroup rootView = (ViewGroup)this.getActivity().getWindow().getDecorView();

LinearLayout animLayout = new LinearLayout(getActivity());

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;

}

添加动画视图到动画层:

public 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;

}

最后就是动画实现:其中的第一个参数就是在你调用这个方法时传入的动画图片,第二个参数是你传入图片所在的Location:

public void setTranslateAnim(final View v, int[] start_location) {

if(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坐标

shopCart.getLocationInWindow(end_location);// shopCart是那个购物车

// 计算位移

int endX = 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);

anim_mask_layout.removeView(view);

// buyNum++;//让购买数量加1

}

});

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值