[发明专利]一种基于微信小程序平台添加到购物车抛物线动画的方法

权利要求书

1.一种基于微信小程序平台商品添加到购物车时出现抛物线动画效果的实现方法，其特征在于：在点击右侧添加商品购物车时，获得点击的位置及小球所在页面的位置及小球要运行到的位置，并把定义的小球在后台运行到点击的位置并显示，然后根据运行中x的值按公式（y = a * x*x + b*x +c）取得y的值，其中a、b、c的值可根据起始点与结束点计算出来，最后使用left与top动画运行小球即可形成抛物线轨迹；从而解决了基于微信小程序平台商品添加到购物车时没有形象的抛物线运行轨迹的动画效果的问题。

2.根据权利要求1所述的解决了基于微信小程序平台商品添加到购物车时没有一种形象的按抛物线轨迹运行的动画效果的添加问题，其特征在于：所述的方法具体包括如下步骤：

步骤一、在微信小程序项目中创建一个商品列表页面，在js文件中data里定义数据变量carts[]，在onload方法里通过请求服务获得数据并设值到carts中；

步骤二、在商品列表页面每个item里都添加购物车按钮图标并绑定事件addToCart；

步骤三、同时在商品列表页面最后位置添加小球View控件，初始时不可见，增加动画animation、left及top动态属性，并在js文件中data里定义；

步骤四、在js文件中定义方法addToCart，并获得当前item所在位置的索引，根据索引及carts可获得当前的item；

步骤五、初始化小球动画animation相关属性;

步骤六、另写一个函数startAnim来实现抛物线轨迹动画效果，每次开始动画前小球运行到当前的点击位置，然后开始相关的抛物线轨迹动画;

步骤七、动画结束后，把item添加到carts中并增加数量，最后更新远程服务器，完成添加功能。