animate.js 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. exports.setContentAnimate = void 0;
  4. var version_1 = require('../common/version');
  5. var utils_1 = require('../common/utils');
  6. function useAnimate(context, expanded, mounted, height) {
  7. var selector = '.van-collapse-item__wrapper';
  8. if (expanded) {
  9. context.animate(
  10. selector,
  11. [
  12. { height: 0, ease: 'ease-in-out', offset: 0 },
  13. { height: height + 'px', ease: 'ease-in-out', offset: 1 },
  14. { height: 'auto', ease: 'ease-in-out', offset: 1 },
  15. ],
  16. mounted ? 300 : 0,
  17. function () {
  18. context.clearAnimation(selector);
  19. }
  20. );
  21. return;
  22. }
  23. context.animate(
  24. selector,
  25. [
  26. { height: height + 'px', ease: 'ease-in-out', offset: 0 },
  27. { height: 0, ease: 'ease-in-out', offset: 1 },
  28. ],
  29. 300,
  30. function () {
  31. context.clearAnimation(selector);
  32. }
  33. );
  34. }
  35. function useAnimation(context, expanded, mounted, height) {
  36. var animation = wx.createAnimation({
  37. duration: 0,
  38. timingFunction: 'ease-in-out',
  39. });
  40. if (expanded) {
  41. if (height === 0) {
  42. animation.height('auto').top(1).step();
  43. } else {
  44. animation
  45. .height(height)
  46. .top(1)
  47. .step({
  48. duration: mounted ? 300 : 1,
  49. })
  50. .height('auto')
  51. .step();
  52. }
  53. context.setData({
  54. animation: animation.export(),
  55. });
  56. return;
  57. }
  58. animation.height(height).top(0).step({ duration: 1 }).height(0).step({
  59. duration: 300,
  60. });
  61. context.setData({
  62. animation: animation.export(),
  63. });
  64. }
  65. function setContentAnimate(context, expanded, mounted) {
  66. utils_1
  67. .getRect(context, '.van-collapse-item__content')
  68. .then(function (rect) {
  69. return rect.height;
  70. })
  71. .then(function (height) {
  72. version_1.canIUseAnimate()
  73. ? useAnimate(context, expanded, mounted, height)
  74. : useAnimation(context, expanded, mounted, height);
  75. });
  76. }
  77. exports.setContentAnimate = setContentAnimate;