在app端如何实现一个视频画中画的功能

在App端实现视频画中画功能，需注意以下关键点：

1. 避免在Vue页面混用NVue组件：
   Vue页面采用混合渲染（部分原生组件），存在层级问题，导致NVue组件无法正常覆盖。知识库明确说明："小程序和App的vue页面...原生组件带来了前端组件无法覆盖原生控件的层级问题"。应将直播功能独立为NVue页面开发。

2. 推荐NVue方案：

   • 使用<live-pusher>（推流）或<video>（拉流）组件，NVue无层级问题，可直接用普通组件覆盖视频（如按钮、标题）。
   • 实现画中画核心：通过subNVue将直播窗口作为子视图嵌入主页面。参考文档：subNVue API。
   • 若需全屏覆盖（如分享按钮），NVue 2.1.5+ 支持cover-view，但App端因无层级问题，可直接用普通view覆盖。

3. 关键配置：

   • 确保manifest.json启用VideoPlayer模块（App打包必需）。
   • 使用最新版（HBuilderX 4.85+），因旧版NVue对视频支持有限。
   • FLV流需注意：App端video组件支持网络流，但若性能不足，可考虑插件市场商业SDK（如腾讯视频插件）。

4. 避坑提示：

   • 不要在Vue页面嵌套NVue组件实现画中画（混合渲染导致失效）。
   • 抖音式滑动切换仅NVue支持，参考插件市场示例。

结论：新建独立NVue页面承载直播，通过subNVue实现画中画悬浮窗口。避免在Vue页面中混合使用，详见原生组件层级说明。