HarmonyOS鸿蒙Next中Avplayer用NavDestination包一下黑屏。在EntryAbility.ets的入口页更换时，入口页是Index，用Navigation跳转黑屏；入口页是Avplayer页时，能正常播放。

HarmonyOS鸿蒙Next中Avplayer用NavDestination包一下黑屏。在EntryAbility.ets的入口页更换时，入口页是Index，用Navigation跳转黑屏；入口页是Avplayer页时，能正常播放。 【问题描述】：Avplayer用NavDestination包一下黑屏。在EntryAbility.ets的入口页更换时，入口页是Index，用Navigation跳转黑屏；入口页是Avplayer页时，能正常播放

【问题现象】：Avplayer用NavDestination包一下黑屏。在EntryAbility.ets的入口页更换时，入口页是Index，用Navigation跳转黑屏；入口页是Avplayer页时，能正常播放

【版本信息】：DevEco Studio 6.0.1 Release，API 21

【复现代码】：不涉及

【尝试解决方案】：暂无


更多关于HarmonyOS鸿蒙Next中Avplayer用NavDestination包一下黑屏。在EntryAbility.ets的入口页更换时，入口页是Index，用Navigation跳转黑屏；入口页是Avplayer页时，能正常播放。的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

楼主可以看一下Avplayer页是不是写了onPageShow、onPageHide的逻辑，如果有

可以把onPageShow里的方法都移到NavDestination的onShown事件里面，

onPageHide里的方法都移到NavDestination的onHidden事件

【背景知识】

Navigation组件是路由导航的根视图容器，一般作为Page页面的根容器使用，其内部默认包含了标题栏、内容区和工具栏，其中内容区默认首页显示导航内容（Navigation的子组件）或非首页显示（NavDestination的子组件）。

【解决方案】

使用Navigation跳转的页面不会走onPageShow生命周期，onPageShow、onPageHide、onBackPress等生命周期回调函数，仅对@Entry装饰的自定义组件生效，NavDestination提供了onShown、onHidden、onBackPressed等属性可以设置对应的回调函数，通过这些属性监听页面的显示隐藏，示例如下：

@Component
struct page {
  build() {
    NavDestination() {
      // ...
    }
    // 当NavDestination即将构建子组件之前会触发此回调。
    .onShown(() => {
      // ...
    })
    // 当该NavDestination页面隐藏时触发此回调。
    .onHidden(() => {

    })
    // 当与Navigation绑定的导航控制器中存在内容时，此回调生效。当点击返回键时，触发该回调。
    .onBackPressed(() => {
      return true
    })
  }
}

更多关于HarmonyOS鸿蒙Next中Avplayer用NavDestination包一下黑屏。在EntryAbility.ets的入口页更换时，入口页是Index，用Navigation跳转黑屏；入口页是Avplayer页时，能正常播放。的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


鸿蒙Next中Avplayer在NavDestination内黑屏问题

该问题与Navigation的页面生命周期管理有关。当EntryAbility入口页设为Index时，通过Navigation跳转到Avplayer页，可能因页面初始状态或资源加载时机导致播放器初始化异常。

入口页直接设为Avplayer页能正常播放，说明播放器本身功能正常。需检查NavDestination组件的加载流程及Avplayer的初始化时机，确保在页面显示时完成播放器设置。

这是一个典型的导航栈与媒体组件生命周期管理的问题。

核心原因： 当Index作为入口页时，通过Navigation跳转到包含AvPlayer的NavDestination页面，该页面在初始创建时可能处于非激活状态（例如，在aboutToAppear之前或页面切换动画期间），此时AvPlayer组件可能无法正确初始化或获取到有效的显示区域，导致黑屏。

而当AvPlayer页直接作为入口页时，页面在应用启动时即处于完全激活状态，AvPlayer能够正常初始化和渲染。

解决方案：

  1. 延迟初始化AvPlayer：不要在aboutToAppear中立即调用AvPlayer的prepare()或play()。可以尝试在页面显示后，通过setTimeout或nextFrame延迟一小段时间（例如100ms）再启动播放。

    aboutToAppear() {
  // 不要在这里直接prepare/play
}
onPageShow() {
  // 在页面完全显示后初始化
  setTimeout(() => {
    this.avPlayer.prepare();
    this.avPlayer.play();
  }, 100);
}

  2. 使用页面生命周期回调：确保在正确的生命周期阶段（如onPageShow）初始化播放器，而不是在aboutToAppear中。onPageShow会在页面切换动画完成、完全可见时触发。

  3. 检查SurfaceProvider：如果使用了XComponent作为AvPlayer的渲染表面，请确保XComponent的尺寸在页面跳转后已正确分配，并且AvPlayer的surfaceId是在XComponent的onLoad回调中获取的。

  4. 检查导航参数传递：如果跳转时传递了视频路径等参数，请确保参数在AvPlayer页面初始化时已正确接收，避免因数据未就绪而初始化失败。

  5. 查看日志：通过HiLog或控制台输出，检查AvPlayer在跳转场景下的状态回调（如stateChange、error事件），确认具体错误信息。

总结： 根本在于页面跳转过程中，组件的创建、布局与激活状态存在时序差。将媒体播放器的初始化时机与页面的完全显示事件同步，通常可解决此类问题。

回到顶部