收藏
回答

iOS video标签 object-fit属性动态设置无效?

机型:iphone xs

微信版本:7.0.5

问题描述:iOS video标签 object-fit属性动态设置无效。现在调用视频全屏方法后,设置objectFit为 contain无效

期望:视频在页面内播放的时候objectFit 是 cover。当调用视频全屏方法后,设置objectFit为 contain。

html代码:

<video custom-cache="{{false}}" id="myVideo" src="{{src}}" objectFit="{{ objectFit }}" direction="{{ 0 }}" bindfullscreenchange="screenChange"></video>

<view>

<button catchtap="playVideo">播放</button>

<button catchtap="fullScreen">全屏</button>

</view>

js处理逻辑:

// 系统全屏变化事件
screenChange(e) {
  // 如果退出全屏,则设置 cover
  if (!e.detail.fullScreen) {
    this.setData({
      objectFit: 'cover'
    })
  }
},
// 按钮点击 播放视频
playVideo() {
  console.log(this.data.objectFit)
  this.videoContext.play()
},
// 按钮点击 全屏
fullScreen() {
  this.setData({
    objectFit: 'contain'
  })
  this.videoContext.requestFullScreen()
}


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

1 个回答

  • 流萤
    流萤
    2019-09-05

    代码片段https://developers.weixin.qq.com/s/oWAma9mZ7Db2

    2019-09-05
    有用 3
    回复 2
    •        .
      .
      2019-09-17
      有解决方案吗 遇到了相同的问题
      2019-09-17
      回复
    • 流萤
      流萤
      2019-09-18回复 .
      demo证明了 objectFit不能动态设置,可以考虑用两个video标签切换实现。但性能上肯定是会影响的
      2019-09-18
      回复
登录 后发表内容
问题标签