index.wxml 2.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. <view class="container">
  2. <swiper
  3. class="video-swiper"
  4. circular="{{circular}}"
  5. next-margin="{{nextMargin}}"
  6. easing-function="{{easingFunction}}"
  7. vertical
  8. current="0"
  9. duration="{{duration}}"
  10. bindanimationfinish="animationfinish">
  11. <!-- curQueue 循环会导致video重新插入,objectFit 不可变更 -->
  12. <swiper-item class="swiper_item" wx:for="{{curQueue}}" data-id="{{item.id}}" wx:key="*this">
  13. <view class="head_box">
  14. <view class="user_box" catchtap="headTap" data-id="{{item.uid}}">
  15. <image class="avatar" lazy-load="true" src="{{item.avatar}}" />
  16. <view class="user_right">
  17. <view class="nickname">{{item.nickName}}</view>
  18. </view>
  19. </view>
  20. <view class="time">
  21. <text>发布时间:{{item.time}}</text>
  22. </view>
  23. </view>
  24. <video
  25. id="video_{{index}}"
  26. class="video_item"
  27. loop="{{loop}}"
  28. enable-play-gesture
  29. enable-progress-gesture
  30. show-center-play-btn="{{false}}"
  31. controls="{{true}}"
  32. src="{{item.url}}"
  33. object-fit="contain"
  34. data-index="{{index}}"
  35. >
  36. <!-- bindplay="onPlay"
  37. bindpause="onPause"
  38. bindended="onEnded"
  39. binderror="onError"
  40. bindtimeupdate="onTimeUpdate"
  41. bindwaiting="onWaiting"
  42. bindprogress="onProgress"
  43. bindloadedmetadata="onLoadedMetaData" -->
  44. </video>
  45. <view class="video_title">
  46. <text>
  47. {{item.title}}
  48. </text>
  49. </view>
  50. <view class="foot_box">
  51. <view class="foot_left">
  52. <view class="btn collect_btn">
  53. <image class="collect_btn_icon" src="../../static/index/star.png" lazy-load="true" />
  54. <text>收藏</text>
  55. </view>
  56. <view class="btn share_btn">
  57. <image class="share_btn_icon" src="../../static/index/share.png" lazy-load="true" />
  58. <text>分享</text>
  59. </view>
  60. </view>
  61. <view class="foot_right">
  62. <view class="btn flower_btn">
  63. <image class="flower_btn_icon" src="../../static/index/flower.png" lazy-load="true" />
  64. <text>{{item.likes}}</text>
  65. </view>
  66. <view class="btn comment_btn" catchtap="openComment" data-id="{{item.id}}">
  67. <image class="comment_btn_icon" src="../../static/index/comment.png" lazy-load="true" />
  68. <text>{{item.likes}}123</text>
  69. </view>
  70. </view>
  71. </view>
  72. <view class="btn_wrapper" catchtap="goToReading" data-id="{{item.classId}}">
  73. <view class="reading_btn">
  74. <image src="../../static/index/star.png" />
  75. <text>我要配音</text>
  76. </view>
  77. </view>
  78. </swiper-item>
  79. </swiper>
  80. </view>