先看下效果图.

代码:
1.popMenu.js

1. Page({
2. data: {
3. isPopping: false,//是否已经弹出
4. animPlus: {},//旋转动画
5. animCollect: {},//item位移,透明度
6. animTranspond: {},//item位移,透明度
7. animInput: {},//item位移,透明度
8. },
9. //点击弹出
10. plus: function () {
11. if (this.data.isPopping) {
12. //缩回动画
13. this.popp();
14. this.setData({
15. isPopping: false
16. })
17. } else if (!this.data.isPopping) {
18. //弹出动画
19. this.takeback();
20. this.setData({
21. isPopping: true
22. })
23. }
24. },
25. input: function () {
26. console.log("input")
27. },
28. transpond: function () {
29. console.log("transpond")
30. },
31. collect: function () {
32. console.log("collect")
33. },
34.  
35. //弹出动画
36. popp: function () {
37. //plus顺时针旋转
38. var animationPlus = wx.createAnimation({
39. duration: 500,
40. timingFunction: 'ease-out'
41. })
42. var animationcollect = wx.createAnimation({
43. duration: 500,
44. timingFunction: 'ease-out'
45. })
46. var animationTranspond = wx.createAnimation({
47. duration: 500,
48. timingFunction: 'ease-out'
49. })
50. var