loading.wxml 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445
  1. <wxs src="../common/utils.wxs" module="_" />
  2. <view
  3. style="{{_._style([style, customStyle, show ? '' : 'display: none', inheritColor ? 'color: inherit' : ''])}}"
  4. class="class {{prefix}}-class {{classPrefix}} {{classPrefix + '--' + layout}} {{fullscreen ? classPrefix + '--fullscreen' : ''}}"
  5. >
  6. <view
  7. wx:if="{{indicator}}"
  8. class="{{prefix}}-class-indicator {{classPrefix}}__spinner {{classPrefix}}__spinner--{{ theme }} {{reverse ? 'reverse' : ''}}"
  9. style="width: {{ _.addUnit(size) }}; height: {{ _.addUnit(size) }}; {{inheritColor ? 'color: inherit;' : ''}} {{indicator ? '' : 'display: none;'}} {{duration ? 'animation-duration: ' + duration / 1000 + 's;' : ''}} animation-play-state: {{pause ? 'paused' : 'running'}};"
  10. aria-role="{{ariaRole || 'img'}}"
  11. aria-label="{{ ariaLabel || text || '加载中' }}"
  12. >
  13. <view
  14. wx:if="{{ theme === 'spinner' }}"
  15. wx:for="{{12}}"
  16. wx:key="index"
  17. class="{{classPrefix}}__dot {{classPrefix}}__dot-{{index}}"
  18. />
  19. <view wx:if="{{ theme === 'circular' }}" class="{{classPrefix}}__circular" />
  20. <block wx:if="{{ theme === 'dots' }}">
  21. <view
  22. class="{{classPrefix}}__dot"
  23. style="{{duration ? 'animation-duration: ' + duration/1000 + 's; animation-delay:' + 0 + 's;' : ''}} animation-play-state: {{pause ? 'paused' : 'running'}};"
  24. ></view>
  25. <view
  26. class="{{classPrefix}}__dot"
  27. style="{{duration ? 'animation-duration: ' + duration/1000 + 's; animation-delay:' + duration * 1 / 3000 + 's;' : ''}} animation-play-state: {{pause ? 'paused' : 'running'}};"
  28. ></view>
  29. <view
  30. class="{{classPrefix}}__dot"
  31. style="{{duration ? 'animation-duration: ' + duration/1000 + 's; animation-delay:' + duration * 2 / 3000 + 's;' : ''}} animation-play-state: {{pause ? 'paused' : 'running'}};"
  32. ></view>
  33. </block>
  34. <slot name="indicator" />
  35. </view>
  36. <view
  37. class="{{_.cls(classPrefix + '__text', [layout])}} {{prefix}}-class-text"
  38. aria-hidden="{{indicator}}"
  39. aria-label="{{ ariaLabel || text }}"
  40. >
  41. <block wx:if="{{text}}">{{text}}</block>
  42. <slot name="text" />
  43. <slot />
  44. </view>
  45. </view>