HarmonyOS鸿蒙Next中不同组件间切换时，无法实现无缝续播如何解决

【问题现象】

在列表里每个item是一个视频，当视频可见时候会自动播放，点击进入详情页面的视频也会自动播放，但是进入到详情页面时会发生断层，无法实现播放器的无缝续播。

【背景知识】

视频播放组件AVPlayer使用详见指南。

【定位思路】

列表和详情的视频播放是两个不同的视频播放组件，直接切换会有卡顿。

【解决方案】

对于每一个视频，都可以创建一个AVPlayer。

然后通过动态切换surface，实现同视频跨页面播放的无缝转场效果。

具体操作步骤如下：

1. 在page1页面通过GlobalContext将AVPlayer当做全局单例变量放到Map<string, media.AVPlayer>里面。
2. 通过Navigation的NavPathStack跳转到page2页面，通过Map<string, media.AVPlayer>获取单例AVPlayer，将page2页面的XComponent的SurfaceId设置给AVPlayer：

import { media } from '@kit.MediaKit';

export class GlobalContext {
    private constructor() {}
    private static instance: GlobalContext;
    private _objects = new Map<string, media.AVPlayer>();

    public static getContext(): GlobalContext {
        if (!GlobalContext.instance) {
            GlobalContext.instance = new GlobalContext();
        }
        return GlobalContext.instance;
    }

    getObject(value: string): media.AVPlayer | undefined {
        return this._objects.get(value);
    }

    setObject(key: string, objectClass: media.AVPlayer): void {
        this._objects.set(key, objectClass);
    }
}

onJumpClick(): void {
    pageStack.pushPathByName("page2", "Page2 Param")
}

1. 将AVPlayer放进全局map中：

// 将AVPlayer放进全局map
if (this.player) {
    GlobalContext.getContext().setObject('value', this.player);
}

1. 将XComponent的surfaceId提供给avPlayer：

XComponent({
    id: '',
    type: XComponentType.SURFACE,
    libraryname: '',
    controller: this.xComponentController
})
.onLoad(() => {
    this.xComponentController.setXComponentSurfaceSize({
        surfaceWidth: 1920,
        surfaceHeight: 1080
    });
    this.surfaceID = this.xComponentController.getXComponentSurfaceId();
    // 取出全局map里面的AVPlayer
    avPlayer=GlobalContext.getContext().getObject('value');
    if (avPlayer) {
        avPlayer.surfaceId=this.surfaceID;
    }
})