From 3d28531b72ede27c5a1eda32ba155f912c6685a3 Mon Sep 17 00:00:00 2001
From: qiang <guoshengqiang@live.com>
Date: Tue, 12 May 2020 11:45:04 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20H5=20=E7=AB=AF=20video=20=E6=94=AF?=
 =?UTF-8?q?=E6=8C=81=20show-center-play-btn?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../h5/view/components/video/index.vue        | 57 +++++++++++--------
 1 file changed, 32 insertions(+), 25 deletions(-)

diff --git a/src/platforms/h5/view/components/video/index.vue b/src/platforms/h5/view/components/video/index.vue
index da77041b0..f3f5022f3 100644
--- a/src/platforms/h5/view/components/video/index.vue
+++ b/src/platforms/h5/view/components/video/index.vue
@@ -1,7 +1,7 @@
 <template>
   <uni-video
     :id="id"
-    v-on="$listeners"
+    v-on="$listeners"
   >
     <div
       ref="container"
@@ -15,7 +15,7 @@
     >
       <video
         ref="video"
-        :style="{opacity:!start?0.8:1,objectFit:objectFit}"
+        :style="{objectFit:objectFit}"
         :muted="muted"
         :loop="loop"
         :src="srcSync"
@@ -42,7 +42,7 @@
       <div
         v-show="controlsShow"
         class="uni-video-bar uni-video-bar-full"
-        @click.stop
+        @click.stop
       >
         <div class="uni-video-controls">
           <div
@@ -51,8 +51,8 @@
             class="uni-video-control-button"
             @click.stop="trigger"
           />
-          <div class="uni-video-current-time">
-            {{ currentTime|time }}
+          <div class="uni-video-current-time">
+            {{ currentTime|time }}
           </div>
           <div
             ref="progress"
@@ -62,19 +62,19 @@
             <div class="uni-video-progress">
               <div
                 :style="{width:buffered+'%'}"
-                class="uni-video-progress-buffered"
+                class="uni-video-progress-buffered"
               />
               <div
                 ref="ball"
                 :style="{left:progress+'%'}"
-                class="uni-video-ball"
+                class="uni-video-ball"
               >
                 <div class="uni-video-inner" />
               </div>
             </div>
           </div>
-          <div class="uni-video-duration">
-            {{ (duration||durationTime)|time }}
+          <div class="uni-video-duration">
+            {{ (duration||durationTime)|time }}
           </div>
         </div>
         <div
@@ -82,8 +82,8 @@
           :class="{'uni-video-danmu-button-active':enableDanmuSync}"
           class="uni-video-danmu-button"
           @click.stop="triggerDanmu"
-        >
-          弹幕
+        >
+          弹幕
         </div>
         <div
           v-show="showFullscreenBtn"
@@ -96,27 +96,27 @@
         v-show="start&&enableDanmuSync"
         ref="danmu"
         style="z-index: 0;"
-        class="uni-video-danmu"
+        class="uni-video-danmu"
       />
       <div
-        v-if="!start"
+        v-if="centerPlayBtnShow"
         class="uni-video-cover"
-        @click.stop
+        @click.stop
       >
         <div
           class="uni-video-cover-play-button"
-          @click.stop="play"
+          @click.stop="play"
         />
-        <p class="uni-video-cover-duration">
-          {{ (duration||durationTime)|time }}
+        <p class="uni-video-cover-duration">
+          {{ (duration||durationTime)|time }}
         </p>
       </div>
       <div
         :class="{'uni-video-toast-volume':gestureType==='volume'}"
-        class="uni-video-toast"
+        class="uni-video-toast"
       >
-        <div class="uni-video-toast-title">
-          音量
+        <div class="uni-video-toast-title">
+          音量
         </div>
         <svg
           class="uni-video-toast-icon"
@@ -133,7 +133,7 @@
         <div class="uni-video-toast-value">
           <div
             :style="{width:volumeNew*100+'%'}"
-            class="uni-video-toast-value-content"
+            class="uni-video-toast-value-content"
           >
             <div class="uni-video-toast-volume-grids">
               <div
@@ -147,10 +147,10 @@
       </div>
       <div
         :class="{'uni-video-toast-progress':gestureType=='progress'}"
-        class="uni-video-toast"
+        class="uni-video-toast"
       >
-        <div class="uni-video-toast-title">
-          {{ currentTimeNew|time }} / {{ durationTime|time }}
+        <div class="uni-video-toast-title">
+          {{ currentTimeNew|time }} / {{ durationTime|time }}
         </div>
       </div>
     </div>
@@ -278,6 +278,10 @@ export default {
     showPlayBtn: {
       type: [Boolean, String],
       default: true
+    },
+    showCenterPlayBtn: {
+      type: [Boolean, String],
+      default: true
     }
   },
   data () {
@@ -306,8 +310,11 @@ export default {
     }
   },
   computed: {
+    centerPlayBtnShow () {
+      return this.controls && this.showCenterPlayBtn && !this.start
+    },
     controlsShow () {
-      return this.start && this.controls && this.controlsVisible
+      return !this.centerPlayBtnShow && this.controls && this.controlsVisible
     },
     autoHideContorls () {
       return this.controlsShow && this.playing && !this.controlsTouching
-- 
GitLab