1***@qq.com
1***@qq.com
  • 发布:2024-11-01 00:49
  • 更新:2024-11-01 02:21
  • 阅读:52

【报Bug】video开启全屏后canvas无法正常显示

分类:uni-app

产品分类: uniapp/小程序/微信

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: win11

HBuilderX类型: 正式

HBuilderX版本号: 4.29

第三方开发者工具版本号: 1.06.2409140

基础库版本号: 3.6.3

项目创建方式: HBuilderX

示例代码:
<video id="bsVideo" :controls="false" style="width: 100%;">  
    <canvas style="width: 100%;height: 100px;" canvas-id="bsCanvas" id="bsCanvas"></canvas>  
</video>
methods: {  
            play() {  
                const videoContext = uni.createVideoContext('bsVideo', this);  
                videoContext.requestFullScreen({direction: 0});  

                var ctx = uni.createCanvasContext('bsCanvas', this)  
                ctx.setFillStyle('red')  
                ctx.fillRect(10, 10, 150, 75)  
                ctx.draw()  

            }  
        }

操作步骤:

参考以上代码

预期结果:

video全屏后canvas正常显示

实际结果:

video全屏后canvas不显示

bug描述:

在video标签中包含canvas标签,没有全屏时canvas可以正常显示,video开启全屏后canvas无法显示

2024-11-01 00:49 负责人:无 分享
已邀请:
1***@qq.com

1***@qq.com (作者)

解决方案:使用条件编译,直接用新版微信小程序canvas 2d接口可以解决,与同层渲染有关,等待uniapp接口适配

要回复问题请先登录注册