收藏
回答

安卓系统下,video全屏展示时控制的cover-view内容没有展示,怎么解决?

wxml:
<video id="myVideo" class="video" src="{{videoSrc}}" enable-danmu controls show-fullscreen-btn show-center-play-btn="{{false}}" auto-pause-if-navigate auto-pause-if-open-native show-play-btn object-fit="contain" bindpause="bindpause" bindended="bindended" bindfullscreenchange="bindfullscreenchange" title="保单服务" bindcontrolstoggle="bindcontrolstoggle" poster="{{videoCoverImg}}">
    <cover-view class="videoH" wx:if="{{isvideoH}}">
       <cover-view class="videoH-01" data-id="2" bindtap="clickList">
            <cover-image src="https://yjm.henan100.com/littleCode/images/product_01.png" mode="widthFix" class="videoH-01-cover-image"></cover-image>
            <cover-view class="videoH-01-text">详情</cover-view>
       </cover-view>
       <cover-view class="videoH-01" data-id="3" bindtap="clickList">
            <cover-image src="https://yjm.henan100.com/littleCode/images/product_02.png" mode="widthFix" class="videoH-01-cover-image"></cover-image>
            <cover-view class="videoH-01-text">流程</cover-view>
       </cover-view>
       <cover-view class="videoH-01" data-id="4" bindtap="clickList">
            <cover-image src="https://yjm.henan100.com/littleCode/images/product_03.png" mode="widthFix" class="videoH-01-cover-image"></cover-image>
            <cover-view class="videoH-01-text">案例</cover-view>
       </cover-view>
    </cover-view>
</video>
wsxx:
.videoH{ width:200rpx; height: 100vh; position: absolute; left:0; top: 0; z-index: 99999; background: rgba(0,0,0,1); display: flex; align-items: center; justify-content: center; flex-direction:column;}
   .videoH-01{ width:50%; text-align: center; padding-top: 40rpx;}
   .videoH-01-cover-image{ width:80rpx; height: 80rpx; margin:0 auto;}
   .videoH-01-text{ display: block; width:100%; font-size: 30rpx; color:#fff; padding-top:10rpx;}
js:
bindfullscreenchange:function (e) {
        let screen = e.detail.fullScreen; 
        let direction = e.detail.direction;        
        if (direction=="horizontal" ){ 
            this.setData({        
                direction:"horizontal",    
                fullScreen:screen,
                isvideoH:true
            })
        }else{
            this.setData({   
                direction:"vertical",    
                fullScreen:false,      
                isvideoH:false
            })
        }
        console.log("是否全屏"+screen);
        console.log("屏方向"+direction); 
        console.log("出现了么"+this.data.isvideoH); 
    },
    bindcontrolstoggle:function (e) {
        if(this.data.fullScreen && e.detail.show && this.data.direction=="horizontal"){
            console.log("aa");
            this.setData({            
                isvideoH:true
            })
        }else{
            console.log("bb");
            this.setData({            
                isvideoH:false
            })
        }
    }  




回答关注问题邀请回答
收藏

2 个回答

  • KK
    KK
    发表于移动端
    2022-04-07
    。。
    2022-04-07
    有用
    回复
  • Cjiang
    Cjiang
    2021-11-09

    cover-view 正常

    2021-11-09
    有用
    回复 6
    • 咩
      2021-12-15
      全屏的时候cover-view无法显示
      2021-12-15
      回复
    • 鼻歌三丁
      鼻歌三丁
      2021-12-16
      全屏播放时不显示,设置了z-index 也没用
      2021-12-16
      回复
    • 冯振禹Hxcy
      冯振禹Hxcy
      2021-12-29
      全屏播放cover-view的内容无法展示
      2021-12-29
      回复
    • 冯振禹Hxcy
      冯振禹Hxcy
      2021-12-29回复鼻歌三丁
      这个解决没,貌似没解决啊
      2021-12-29
      回复
    • Cjiang
      Cjiang
      2021-12-30回复冯振禹Hxcy
      可以使用view试试
      2021-12-30
      回复
    查看更多(1)
登录 后发表内容