CN116775916A - 一种多媒体内容播放方法、装置、设备及存储介质 - Google Patents

一种多媒体内容播放方法、装置、设备及存储介质 Download PDF

Info

Publication number
CN116775916A
CN116775916A CN202210220023.8A CN202210220023A CN116775916A CN 116775916 A CN116775916 A CN 116775916A CN 202210220023 A CN202210220023 A CN 202210220023A CN 116775916 A CN116775916 A CN 116775916A
Authority
CN
China
Prior art keywords
node
content
dynamic page
page
playing
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN202210220023.8A
Other languages
English (en)
Inventor
易成
李斌
罗程
陈晓波
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Tencent Technology Shenzhen Co Ltd
Original Assignee
Tencent Technology Shenzhen Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Tencent Technology Shenzhen Co Ltd filed Critical Tencent Technology Shenzhen Co Ltd
Priority to CN202210220023.8A priority Critical patent/CN116775916A/zh
Priority to PCT/CN2023/078654 priority patent/WO2023169252A1/zh
Priority to US18/369,036 priority patent/US20240007701A1/en
Publication of CN116775916A publication Critical patent/CN116775916A/zh
Pending legal-status Critical Current

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/40Information retrieval; Database structures therefor; File system structures therefor of multimedia data, e.g. slideshows comprising image and additional audio data
    • G06F16/43Querying
    • G06F16/438Presentation of query results
    • G06F16/4387Presentation of query results by the use of playlists
    • G06F16/4393Multimedia presentations, e.g. slide shows, multimedia albums
    • HELECTRICITY
    • H04ELECTRIC COMMUNICATION TECHNIQUE
    • H04NPICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43Processing of content or additional data, e.g. demultiplexing additional data from a digital video stream; Elementary client operations, e.g. monitoring of home network or synchronising decoder's clock; Client middleware
    • H04N21/431Generation of visual interfaces for content selection or interaction; Content or additional data rendering
    • H04N21/4312Generation of visual interfaces for content selection or interaction; Content or additional data rendering involving specific graphical features, e.g. screen layout, special fonts or colors, blinking icons, highlights or animations
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/40Information retrieval; Database structures therefor; File system structures therefor of multimedia data, e.g. slideshows comprising image and additional audio data
    • G06F16/43Querying
    • G06F16/438Presentation of query results
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/455Emulation; Interpretation; Software simulation, e.g. virtualisation or emulation of application or operating system execution engines
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/455Emulation; Interpretation; Software simulation, e.g. virtualisation or emulation of application or operating system execution engines
    • G06F9/45533Hypervisors; Virtual machine monitors
    • G06F9/45558Hypervisor-specific management and integration aspects
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/455Emulation; Interpretation; Software simulation, e.g. virtualisation or emulation of application or operating system execution engines
    • G06F9/45533Hypervisors; Virtual machine monitors
    • G06F9/45558Hypervisor-specific management and integration aspects
    • G06F2009/45562Creating, deleting, cloning virtual machine instances

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Multimedia (AREA)
  • Signal Processing (AREA)
  • Data Mining & Analysis (AREA)
  • Databases & Information Systems (AREA)
  • Human Computer Interaction (AREA)
  • Information Transfer Between Computers (AREA)

Abstract

本申请实施例提供了一种多媒体内容播放方法、装置、设备及存储介质,可应用于云技术、智慧交通、地图、车载等各种场景,该方法包括:在第一动态化页面中播放多媒体内容,第一动态化页面的第一节点树中包括多媒体内容对应的内容节点以及与内容节点关联的第一原生容器节点。响应于在第一动态化页面中触发的页面切换操作,通过容器切换组件,在非动态化页面的第二节点树中创建第二原生容器节点,并解除内容节点与第一原生容器节点的关联,以及建立内容节点与第二原生容器节点的关联。通过第二原生容器节点在非动态化页面中渲染内容节点,并播放渲染获得的多媒体内容,实现在切换至非动态化页面后继续渲染并播放多媒体内容,从而提升对象的观看体验。

Description

一种多媒体内容播放方法、装置、设备及存储介质
技术领域
本发明实施例涉及计算机技术领域,尤其涉及一种多媒体内容播放方法、装置、设备及存储介质。
背景技术
随着互联网技术的发展,应用程序的种类和数量也越来越多,应用程序的功能也越来越丰富。为了满足一个应用程序中不同应用功能的开发需求,相关技术下,采用原生应用框架和跨平台动态化框架混合开发应用程序,这样使得应用程序中既包括采用跨平台动态化框架开发的动态化页面,以及采用原生应用框架开发的非动态化页面(也可以称之为原生页面)。
针对应用程序中的视频播放功能,若需要在动态化页面中播放视频,则需要在动态化页面中嵌入相应的内容节点。由于动态化页面中嵌入的内容节点强依赖于跨平台动态化框架,即无法脱离动态化页面单独存在,因此,当应用程序从动态化页面切换至非动态化页面时,动态化页面中的视频无法在非动态化页面保持渲染,从而导致视频无法在非动态化页面中播放。
发明内容
本申请实施例提供了一种多媒体内容播放方法、装置、设备及存储介质,用于从动态化页面切换至非动态化页面时,动态化页面中的视频继续在非动态化页面中播放,进而提升观看体验。
一方面,本申请实施例提供了一种多媒体内容播放方法,该方法包括:
在目标应用的第一动态化页面中播放目标多媒体内容,所述第一动态化页面对应的第一节点树中包括所述目标多媒体内容对应的内容节点,以及与所述内容节点关联的第一原生容器节点;
响应于在所述第一动态化页面中触发的页面切换操作,创建非动态化页面;
通过容器切换组件,在所述非动态化页面对应的第二节点树中创建第二原生容器节点,并解除所述内容节点与所述第一原生容器节点的关联,以及建立所述内容节点与所述第二原生容器节点的关联;
通过所述第二原生容器节点,在所述非动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
一方面,本申请实施例提供了一种多媒体内容播放装置,该装置包括:
播放模块,用于在目标应用的第一动态化页面中播放目标多媒体内容,所述第一动态化页面对应的第一节点树中包括所述目标多媒体内容对应的内容节点,以及与所述内容节点关联的第一原生容器节点;
切换模块,用于响应于在所述第一动态化页面中触发的页面切换操作,创建非动态化页面;
处理模块,用于通过容器切换组件,在所述非动态化页面对应的第二节点树中创建第二原生容器节点,并解除所述内容节点与所述第一原生容器节点的关联,以及建立所述内容节点与所述第二原生容器节点的关联;
所述播放模块,用于通过所述第二原生容器节点,在所述非动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
可选地,所述播放模块具体用于:
通过所述第二原生容器节点,在所述非动态化页面中按照所述展示属性信息渲染所述内容节点,并在所述非动态化页面中,按照所述展示属性信息播放所述目标多媒体内容。
可选地,所述展示属性信息包括视频最小化播放模式以及第一展示位置,所述目标多媒体内容为目标视频;
所述播放模块具体用于:
在所述非动态化页面中的第一展示位置,按照视频最小化播放模式播放所述目标视频。
可选地,所述播放模块具体用于:
响应于在所述目标应用中针对所述目标多媒体内容触发的播放操作,创建所述第一动态化页面;
通过所述容器切换组件,基于所述目标多媒体内容的播放源信息,在所述第一节点树中创建所述内容节点和所述第一原生容器节点;
通过所述第一原生容器节点,在所述第一动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
可选地,所述切换模块还用于:
通过所述第二原生容器节点,在所述非动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容之后,响应于在所述非动态化页面中触发的页面恢复操作,基于所述容器切换组件中保存的页面恢复信息,创建所述第一动态化页面;
所述处理模块还用于:
通过所述容器切换组件,在所述第一节点树中创建所述第一原生容器节点,并解除所述内容节点与所述第二原生容器节点的关联,以及建立所述内容节点与所述第一原生容器节点的关联;
所述播放模块还用于:
通过所述第一原生容器节点,在所述第一动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
可选地,所述处理模块还用于:
通过所述容器切换组件,基于所述目标多媒体内容的播放源信息,在所述第一节点树中创建所述内容节点和所述第一原生容器节点之前,对所述第一动态化页面进行解析,获得所述目标多媒体内容对应的多媒体标签;
从所述多媒体标签中获取所述目标多媒体内容的播放源信息以及所述第一动态化页面的页面恢复信息,并将所述播放源信息以及所述页面恢复信息传递至所述容器切换组件。
可选地,所述处理模块还用于:
通过所述容器切换组件,基于所述目标多媒体内容的播放源信息,在所述第一节点树中创建所述内容节点和所述第一原生容器节点之后,基于所述内容节点在所述第一节点树中的目标位置,获得所述内容节点的目标索引信息,并将所述内容节点的目标索引信息保存在所述容器切换组件中;
所述处理模块还用于:
解除所述内容节点与所述第一原生容器节点的关联,以及建立所述内容节点与所述第二原生容器节点的关联之前,通过所述容器切换组件,基于所述目标索引信息,从所述第一节点树中查询获得所述内容节点。
可选地,所述切换模块还用于:
响应于在所述第一动态化页面中触发的页面切换操作,创建第二动态化页面;
所述播放模块还用于:
通过所述第一原生容器节点,在所述第二动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
可选地,所述目标多媒体内容为目标视频;
所述播放模块具体用于:
通过所述第一原生容器节点,在所述第二动态化页面中,按照视频最小化播放模式和第二展示位置渲染所述内容节点;
在所述第二动态化页面中的第二展示位置,按照视频最小化播放模式播放渲染获得的所述目标视频。
一方面,本申请实施例提供了一种计算机设备,包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序,所述处理器执行所述程序时实现上述多媒体内容播放方法的步骤。
一方面,本申请实施例提供了一种计算机可读存储介质,其存储有可由计算机设备执行的计算机程序,当所述程序在计算机设备上运行时,使得所述计算机设备执行上述多媒体内容播放方法的步骤。
一方面,本申请实施例提供了一种计算机程序产品,所述计算机程序产品包括存储在计算机可读存储介质上的计算机程序,所述计算机程序包括程序指令,当所述程序指令被计算机设备执行时,使所述计算机设备执行上述多媒体内容播放方法的步骤。
本申请实施例中,当触发从第一动态化页面切换至非动态化页面时,通过容器切换组件,在非动态化页面对应的第二节点树中创建第二原生容器节点,并解除内容节点与第一原生容器节点的关联,以及建立内容节点与第二原生容器节点的关联,故在基于第二节点树渲染非动态化页面时,可以相应通过第二原生容器节点在非动态化页面中渲染内容节点,实现在页面切换后的非动态化页面中继续渲染并播放目标多媒体内容,从而提升对象的观看体验。
附图说明
为了更清楚地说明本发明实施例中的技术方案,下面将对实施例描述中所需要使用的附图作简要介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域的普通技术人员来讲,在不付出创造性劳动性的前提下,还可以根据这些附图获得其他的附图。
图1为本申请实施例提供的一种系统架构示意图;
图2为本申请实施例提供的一种工作台页面的示意图;
图3为本申请实施例提供的一种学习页面的示意图一;
图4为本申请实施例提供的一种视频播放页面的示意图;
图5为本申请实施例提供的一种学习页面的示意图二;
图6为本申请实施例提供的一种工作台页面的示意图二;
图7为本申请实施例提供的一种多媒体内容播放方法的流程示意图一;
图8为本申请实施例提供的一种跨平台动态化框架的结构示意图;
图9为本申请实施例提供的一种第一节点树的结构示意图;
图10为本申请实施例提供的一种节点树切换过程的示意图;
图11a为本申请实施例提供的一种页面切换过程的示意图;
图11b为本申请实施例提供的一种页面恢复过程的示意图;
图12为本申请实施例提供的一种多媒体内容播放方法的流程示意图二;
图13为本申请实施例提供的一种多媒体内容播放装置的结构示意图;
图14为本申请实施例提供的一种计算机设备的结构示意图。
具体实施方式
为了使本发明的目的、技术方案及有益效果更加清楚明白,以下结合附图及实施例,对本发明进行进一步详细说明。应当理解,此处所描述的具体实施例仅仅用以解释本发明,并不用于限定本发明。
为了方便理解,下面对本发明实施例中涉及的名词进行解释。
跨平台动态化技术:也指跨平台动态化框架,跨平台动态化技术是近年来应用于移动终端应用开发的热点技术,其中,跨平台指一套应用代码可以运行在多种移动终端(iOS/安卓等);动态化指更新的应用程序代码可以动态下载到移动终端以更新应用程序,从而摆脱应用程序更新功能需要发新版本的问题。在实际应用上,跨平台动态化技术有h5(JS动态解释执行代码+webview跨平台渲染)、小程序(h5结合系统原生控件渲染)、ReactNative(JS动态解释执行代码+原生控件渲染)等。
Flutter:一个跨平台移动UI(界面)框架。它最大的特点是:在Flutter框架下,所有界面元素都是自绘的(而不是使用各自系统的系统应用程序接口或者控件),因此在安卓和iOS能够表现出一模一样的UI画面。另外Flutter有非常出色的渲染性能,流畅性不逊于系统原生控件,因此目前在移动端跨平台解决方案中得到了广泛的应用。
视频最小化:最小化方式播放视频,通常也叫做视频小窗。比如,终端设备在应用程序的第一页面中播放视频时,响应于页面切换操作,展示第二页面的内容,同时在第二页面的某个角落持续以最小化方式播放这个视频,达到同时浏览第二页面的内容以及视频的良好体验。
支持可嵌入式原生控件技术:指跨平台动态化框架支持传入一个原生控件,然后将这个原生控件作为一个基础渲染节点,与其他动态化节点一并进行排版和渲染。可以由动态化页面开发者指定这个原生控件在动态化页面上显示的大小和位置,同时可以覆盖一些动态化组件在其之上,并可以跟随页面进行联动,比如:响应列表滚动、响应手势和触摸等操作。
动态化页面:采用跨平台动态化框架开发的页面。
非动态化页面:采用原生应用框架开发的页面,非动态化页面也可以称之为原生页面。
节点树:用于表示XML文档的树结构,包括多个节点,节点彼此之间都有等级关系,采用父、子和同级节点描述这种等级关系。常见的节点树包括DOM树和Flutter widget树等。
容器节点:一个控件节点或者视图节点可以包在一个父节点上,由父节点来决定控件节点或者视图节点的渲染位置、大小以及生命周期等;同时控件节点或者视图节点也可以由一个父节点,切到另外一个父节点进行重新渲染。这种父节点即为容器节点。比如,html的div节点、iOS原生控件中的UIView节点等为容器节点。
下面对本申请实施例的设计思想进行介绍。
为了满足一个应用程序中不同应用功能的开发需求,相关技术下,采用原生应用框架和跨平台动态化框架混合开发应用程序,这样使得应用程序中既包括采用跨平台动态化框架开发的动态化页面,以及采用原生应用框架开发的非动态化页面(也可以称之为原生页面)。
针对应用程序中的视频播放功能,若需要在动态化页面中播放视频,则需要在动态化页面中嵌入相应的内容节点。由于动态化页面中嵌入的内容节点强依赖于跨平台动态化框架,即无法脱离动态化页面单独存在,因此,当应用程序从动态化页面切换至非动态化页面时,动态化页面中的视频无法在非动态化页面保持渲染,从而导致视频无法在非动态化页面中播放。
鉴于此,本申请实施例中提供了一种多媒体内容播放方法,该方法包括:在目标应用的第一动态化页面中播放目标多媒体内容,其中,第一动态化页面对应的第一节点树中包括目标多媒体内容对应的内容节点,以及与内容节点关联的第一原生容器节点。响应于在第一动态化页面中触发的页面切换操作,创建非动态化页面。然后通过容器切换组件,在非动态化页面对应的第二节点树中创建第二原生容器节点,并解除内容节点与第一原生容器节点的关联,以及建立内容节点与第二原生容器节点的关联。之后再通过第二原生容器节点,在非动态化页面中渲染内容节点,并播放渲染获得的目标多媒体内容。
本申请实施例中,当触发从第一动态化页面切换至非动态化页面时,通过容器切换组件,在非动态化页面对应的第二节点树中创建第二原生容器节点,并解除内容节点与第一原生容器节点的关联,以及建立内容节点与第二原生容器节点的关联,故在基于第二节点树渲染非动态化页面时,可以相应通过第二原生容器节点在非动态化页面中渲染内容节点,实现在页面切换后的非动态化页面中继续渲染并播放目标多媒体内容,从而提升对象的观看体验。
参考图1,其为本申请实施例适用的一种系统架构图,该系统架构至少包括终端设备101和服务器102,终端设备101的数量可以是一个或多个,服务器102的数量也可以是一个或多个,本申请对终端设备101和服务器102的数量不做具体限定。
终端设备101中预先安装具备多媒体内容播放功能的目标应用,其中,目标应用的类型可以客户端应用、小程序应用等。目标应用具体可以是即时通信应用、办公应用、短视频应用、直播应用、地图应用等。终端设备101可以是智能手机、平板电脑、笔记本电脑、台式计算机、智能家电、智能语音交互设备、智能车载设备、飞行器等,但并不局限于此。
服务器102是目标应用的后台服务器,服务器102可以是独立的物理服务器,也可以是多个物理服务器构成的服务器集群或者分布式系统,还可以是提供云服务、云数据库、云计算、云函数、云存储、网络服务、云通信、中间件服务、域名服务、安全服务、内容分发网络(Content Delivery Network,CDN)、以及大数据和人工智能平台等基础云计算服务的云服务器。终端设备101与服务器102可以通过有线或无线通信方式进行直接或间接地连接,本申请在此不做限制。
本申请实施例中的多媒体内容播放方法可以是终端设备101执行,也可以由终端设备101与服务器102交互执行。
以终端设备101执行本申请实施例中的多媒体内容播放方法举例来说,包括以下步骤:
终端设备101在目标应用的第一动态化页面中播放目标多媒体内容,其中,第一动态化页面对应的第一节点树中包括目标多媒体内容对应的内容节点,以及与内容节点关联的第一原生容器节点。
终端设备101响应于在第一动态化页面中触发的页面切换操作,创建非动态化页面。通过容器切换组件,在非动态化页面对应的第二节点树中创建第二原生容器节点,并解除内容节点与所述第一原生容器节点的关联,以及建立内容节点与第二原生容器节点的关联。之后再通过第二原生容器节点,在非动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
在实际应用中,本申请实施例中的多媒体内容播放方法可以应用于在即时通信应用、办公应用、短视频应用、直播应用、地图应用等各类应用中播放多媒体内容的场景。
以在办公应用播放视频举例来说,参见图2,为本申请实施例提供的一种办公应用的工作台页面,工作台页面为非动态化页面。
响应于在工作台页面中针对“学习园地”图标触发的查看操作,从工作台页面切换至学习页面,学习页面如图3所示,学习页面为动态化页面,其中,学习页面中包括课程视频1、课程视频2、课程视频3、课程视频4。
响应于在学习页面中针对课程视频1触发的播放操作,从学习页面切换至视频播放页面,视频播放页面如图4所示,视频播放页面为动态化页面,其中,视频播放页面包括视频播放区域401,在视频播放区域401播放课程视频1,在其他区域展示课程视频1的相关信息。
响应于在视频播放页面中触发的页面切换操作,从视频播放页面切换至学习页面,其中,页面切换操作可以是点击视频播放页面中左上角的视频最小化按钮。此时,学习页面如图5所示,在学习页面的右下角采用视频最小化播放模式,播放课程视频1,即在最小化窗口501中播放课程视频1,其中,最小化窗口501中还包括位于左上的页面恢复按钮,以及位于右上角的关闭按钮。
响应于在学习页面中触发的页面切换操作,从学习页面切换至工作台页面,此时,工作台页面如图6所示,在工作台页面的右下角采用视频最小化播放模式,播放课程视频1,即在最小化窗口601中播放课程视频1,其中,最小化窗口601中还包括位于左上的页面恢复按钮,以及位于右上角的关闭按钮。
响应于在工作台页面中触发的页面恢复操作,从工作台页面切换至视频播放页面,页面恢复操作可以是点击最小化窗口601中的页面恢复按钮。此时,视频播放页面如图4所示,视频播放页面包括视频播放区域401,在视频播放区域401播放课程视频1,在其他区域展示课程视频1的相关信息。
基于图1所示的系统架构图,本申请实施例提供了一种多媒体内容播放方法的流程,如图7所示,该方法的流程由计算机设备执行,该计算机设备可以是图1所示的终端设备101和/或服务器102,包括以下步骤:
步骤S701,在目标应用的第一动态化页面中播放目标多媒体内容。
具体地,第一动态化页面对应的第一节点树中包括目标多媒体内容对应的内容节点,以及与内容节点关联的第一原生容器节点,内容节点也是原生节点。多媒体内容可以是视频、音频等,相应地,内容节点可以是视频节点、音频节点等。
本申请实施例中,目标应用中包含跨平台动态化框架,跨平台动态化框架用于实现动态化页面的相关功能。为了在动态化页面中嵌入原生容器节点以及内容节点等原生节点,跨平台动态化框架支持可嵌入式原生控件技术。
在实际应用场景中,跨平台动态化框架支持的可嵌入式原生控件技术可以是小程序中的同层渲染技术,也可以是JS+Flutter框架中的PlatformView技术。下面具体介绍一下JS+Flutter框架以及JS+Flutter框架中的PlatformView技术。
具体地,JS+Flutte框架为一种跨平台动态化框架,其结构示意图如图8所示,包括:JS层、跨平台抽象层和Flutter层。
通过JS层引擎解析动态化开发者的JS/CSS代码,并生成JS层里面的节点树(DOM树)。然后通过跨平台抽象层将DOM树转换为抽象节点树,再将抽象节点树映射到Flutter层里面的Widget树,并通过Flutter渲染框架完成渲染。
JS+Flutter框架中的PlatformView技术指:利用系统原生渲染能力来渲染单个原生节点,并从图形处理器(Graphics Processing Unit,简称GPU)中获取到渲染获得的原始数据,并将获得的原始数据采用GPU贴图方式加入到Flutter自身的渲染流程中,从而达到将原生节点与Flutter自身节点渲染结合的效果,进而实现支持可嵌入式原生控件。
在上述JS+Flutter框架下,本申请实施例中的第一节点树为Flutter Widget树,内容节点为原生节点。通过PlatformView技术将内容节点和第一原生容器节点,嵌入到第一节点树中,故在渲染第一节点树时,可以相应渲染第一原生容器节点,进而渲染内容节点,并在第一动态化页面中展示渲染获得的目标多媒体内容。
步骤S702,响应于在第一动态化页面中触发的页面切换操作,创建非动态化页面。
具体地,页面切换操作可以是点击操作、双击操作、滑动操作等。在创建非动态化页面时,相应创建非动态化页面对应的第二节点树,由于非动态化页面为原生页面,因此第二节点树为DOM树。
步骤S703,通过容器切换组件,在非动态化页面对应的第二节点树中创建第二原生容器节点,并解除内容节点与第一原生容器节点的关联,以及建立内容节点与第二原生容器节点的关联。
具体地,容器切换组件预先注册跨平台动态化框架中的页面推出通知。当第一动态化页面切换至非动态化页面,容器切换组件接收跨平台动态化框架发送的页面推出通知。由于非动态化页面为原生页面,因此相应的第二节点树本身支持原生节点,故通过容器切换组件可以直接在非动态化页面对应的第二节点树中创建第二原生容器节点。然后从第一节点树中查询获得内容节点,并解除内容节点与第一原生容器节点的关联,建立内容节点与第二原生容器节点的关联,即将内容节点的父节点,从第一原生容器节点,切换至第二原生容器节点。
举例来说,如图9所示,第一动态化页面对应的第一节点树为Flutter Widget树,在页面切换之前,第一节点树包括Widget根节点、N个Widget节点,以及通过PlatformView技术嵌入的第一原生容器节点和视频节点,其中,第一原生容器节点为视频节点的父节点。
参见图10,响应于在第一动态化页面中触发的页面切换操作,创建非动态化页面。通过容器切换组件,在非动态化页面对应的第二节点树中创建第二原生容器节点,并解除内容节点与第一原生容器节点的关联,以及建立内容节点与第二原生容器节点的关联。此时,第一节点树不包括视频节点,第二节点树为DOM树,包括原生根节点、N个原生节点、第二原生容器节点和视频节点,其中,第二原生容器节点为视频节点的父节点。
步骤S704,通过第二原生容器节点,在非动态化页面中渲染内容节点,并播放渲染获得的目标多媒体内容。
具体地,根据节点树渲染规则渲染第二节点树,其中,在渲染第二节点树中的第二原生容器节点时,自动触发渲染内容节点,并将渲染获得的目标多媒体内容展示在非动态化页面中。
本申请实施例中,当触发从第一动态化页面切换至非动态化页面时,通过容器切换组件,在非动态化页面对应的第二节点树中创建第二原生容器节点,并解除内容节点与第一原生容器节点的关联,以及建立内容节点与第二原生容器节点的关联,故在基于第二节点树渲染非动态化页面时,可以相应通过第二原生容器节点在非动态化页面中渲染内容节点,实现在页面切换后的非动态化页面中继续播放目标多媒体内容,从而提升对象的观看体验。
可选地,在上述步骤S701中,第二原生容器节点中携带目标多媒体内容在非动态化页面中的展示属性信息。通过第二原生容器节点,在非动态化页面中按照展示属性信息渲染内容节点,并在非动态化页面中,按照展示属性信息播放目标多媒体内容。
具体地,目标多媒体内容在非动态化页面中的展示属性信息可以是预先设置的,展示属性信息包括展示位置、播放模式、展示尺寸等。
一种可能的实施方式,目标多媒体内容为目标视频,展示属性信息包括视频最小化播放模式以及第一展示位置。
在进行渲染时,通过第二原生容器节点,在非动态化页面中按照视频最小化播放模式以及第一展示位置渲染内容节点,并在非动态化页面中的第一展示位置,按照视频最小化播放模式播放目标视频。
以多媒体内容为视频举例来说,参见图11a,为本申请实施例提供的一种视频应用中的页面切换过程的示意图,第一动态化页面中包括视频播放区域1101,在视频播放区域1101播放目标视频,在其他区域展示目标视频的相关信息,其中,第一动态化页面为网页形式,通过内嵌在视频应用中的浏览器加载并展示。
响应于在第一动态化页面中触发的页面切换操作,展示非动态化页面,在非动态化页面的第一展示位置1102,以视频最小化播放模式播放目标视频,非动态化页面为原生页面,直接通过视频应用加载并展示。
本申请实施例中,在目标应用中,当从动态化页面中切换至非动态化页面时,在动态化页面中播放的目标视频,依然可以在非动态化页面中保持渲染,并以视频最小化播放模式在非动态化页面中播放,这样既避免了目标视频对非动态化页面中的原始内容进行遮挡,同时使得对象可以继续观看目标视频,从而提升对象的使用体验。
可选地,在上述步骤S701中,本申请实施例至少采用以下方式获得在第一动态化页面中播放的目标多媒体内容:
响应于在目标应用中针对目标多媒体内容触发的播放操作,创建第一动态化页面。然后通过容器切换组件,基于目标多媒体内容的播放源信息,在第一节点树中创建内容节点和第一原生容器节点。再通过第一原生容器节点,在第一动态化页面中渲染内容节点,并播放渲染获得的目标多媒体内容。
具体地,预先按照动态化框架的嵌入协议,向跨平台动态化框架中注册一个特殊的多媒体标签,这个嵌入协议包括具体的标签类型。开发者可以可指定在对应动态化页面中使用这种特殊的多媒体标签,并指定该多媒体标签的相关参数,比如播放源信息、展示位置、展示尺寸、播放模式、页面恢复信息等信息。
在实际应用过程中,在创建第一动态化页面之后,通过跨平台动态化框架对第一动态化页面进行解析,获得目标多媒体内容对应的多媒体标签。然后从多媒体标签中获取目标多媒体内容的播放源信息以及页面恢复信息,并将播放源信息以及页面恢复信息传递至容器切换组件。同时,也可以将展示位置、展示尺寸、播放模式等展示属性信息传递至容器切换组件。
具体实施中,页面恢复信息包括第一动态化页面的标识和路径。比如,当第一动态化页面为h5页面时,第一动态化页面的页面恢复信息为h5页面的统一资源定位符(UniformResource Locator,简称URL)。又比如,当第一动态化页面为小程序中的动态化页面时,第一动态化页面的页面恢复信息为程序ID和页面路径。又比如,当第一动态化页面为应用程序(APP)中的动态化页面时,第一动态化页面的页面恢复信息为APP ID和页面路径。
在获得多媒体内容的播放源信息以及第一动态化页面的页面恢复信息之后,通过JS将播放源信息和页面恢复信息透传至容器切换组件。容器切换组件保存第一动态化页面的播放源信息和页面恢复信息。然后通过容器切换组件,基于目标多媒体内容的播放源信息,在第一节点树中创建内容节点和第一原生容器节点,并将内容节点挂载到第一节点树中的第一原生容器节点下,其中,第一原生容器节点中携带目标多媒体内容在第一动态化页面中的展示位置、展示尺寸、播放模式等展示属性信息。
在对第一节点树进行渲染过程中,根据节点树的渲染规则,在跨平台动态化框架中渲染第一节点树中的第一原生容器节点时,会自动触发原生渲染系统的节点树渲染流程,即按照内容节点的展示属性信息,渲染第一原生容器节点下的内容节点,然后将渲染获得的目标多媒体内容按照展示属性信息,呈现在第一动态化页面中。
本申请实施例中,在第一动态化页面的第一节点树中嵌入一个原生容器节点,通过渲染第一原生容器节点,实现在第一动态化页面中渲染原生的内容节点,从而保证了在第一动态化页面中正常播放内容节点对应的目标多媒体内容。
一种可能的实施方式,通过容器切换组件,基于目标多媒体内容的播放源信息,在第一节点树中创建内容节点和第一原生容器节点之后,基于内容节点在第一节点树中的目标位置,获得内容节点的目标索引信息,并将内容节点的目标索引信息保存在容器切换组件中,即容器切换组件保留内容节点的弱引用。这样,当从第一动态化页面切换至非动态化页面时,可以通过容器切换组件,基于目标索引信息,从第一节点树中查询获得内容节点。然后解除内容节点与第一原生容器节点的关联,以及建立内容节点与第二原生容器节点的关联。此时,可以将容器切换组件中保存的内容节点的目标索引信息,更新为内容节点在第二节点树中的目标位置。
进一步地,第二原生容器节点中携带目标多媒体内容在非动态化页面中的展示属性信息,其中,目标多媒体内容在非动态化页面中的展示属性信息与目标多媒体内容在第一动态化页面中的展示属性信息可以是相同的,也可以是不同的。之后再按照节点树渲染规则,渲染第二节点树。在渲染第二原生容器节点时,自动触发按照展示属性信息渲染内容节点,并按照展示属性信息,在非动态化页面中展示渲染获得的目标多媒体内容。
本申请实施例中,基于内容节点在第一节点树中的目标位置,获得内容节点的目标索引信息,并将内容节点的目标索引信息保存在容器切换组件中,故在进行页面切换时,基于内容节点的目标索引信息,容器切换组件可以快速定位内容节点在第一节点树中的位置,并将内容节点从第一原生容器节点中剥离出来,并对内容节点与第二原生容器节点建立关联,从而提高在页面切换过程中页面渲染的效率,进而提升观看对象的观看体验。
可选地,通过第二原生容器节点,在非动态化页面中渲染内容节点,并播放渲染获得的目标多媒体内容之后,响应于在所述非动态化页面中触发的页面恢复操作,基于容器切换组件中保存的页面恢复信息,创建第一动态化页面。然后通过容器切换组件,在第一节点树中创建第一原生容器节点,并解除内容节点与第二原生容器节点的关联,以及建立内容节点与第一原生容器节点的关联。之后再通过第一原生容器节点,在第一动态化页面中渲染内容节点,并播放渲染获得的目标多媒体内容。
具体地,当从第一动态化页面切换至非动态化页面之后,第一动态化页面相应销毁。因此,在进行页面恢复时,需要重新创建第一动态化页面。通过跨平台动态化框架对第一动态化页面进行解析,获得目标多媒体内容对应的多媒体标签。然后从多媒体标签中获取目标多媒体内容的播放源信息以及页面恢复信息,并将播放源信息以及页面恢复信息传递至容器切换组件。
此时,由于容器切换组件中保存了内容节点的目标索引信息,即内容节点在第二节点树中的目标位置,因此,不需要再创建新的内容节点,而只是再次创建一个第一原生容器节点。然后通过容器切换组件,基于目标索引信息,从第二节点树中查询获得内容节点,解除内容节点与第二原生容器节点的关联,以及建立内容节点与第一原生容器节点的关联。此时,再次将容器切换组件中保存的内容节点的目标索引信息,更新为内容节点在第一节点树中的目标位置。
根据节点树的渲染规则,在跨平台动态化框架中渲染第一节点树中的第一原生容器节点和内容节点,然后将渲染获得的目标多媒体内容按照展示属性信息,呈现在第一动态化页面中。
举例来说,以多媒体内容为视频举例来说,参见图11b,为本申请实施例提供的一种页面恢复过程的示意图,在非动态化页面的第一展示位置1102,以视频最小化播放模式播放目标视频,非动态化页面其他区域展示非动态化页面的原始内容。
响应于在非动态化页面中点击页面恢复按钮的操作,展示第一动态化页面,第二动态化页面中包括视频播放区域1101,在视频播放区域1101播放目标视频,在其他区域展示目标视频的相关信息。
本申请实施例中,当从动态化页面切换至非动态化页面之后,依然可以响应于页面恢复操作从非动态化页面中恢复至动态化页面,同时在动态化页面中保持对目标多媒体内容的渲染,使得目标多媒体内容能够在动态化页面中继续播放,保证了对象观看视频的流畅性,从而提升观看体验。
可选地,本申请实施例中的目标应用除了支持从动态化页面切换至非动态化页面时保持多媒体内容的渲染之外,还支持从一个动态化页面切换至另一个动态化页面时保持多媒体内容的渲染,具体如下:
响应于在第一动态化页面中触发的页面切换操作,创建第二动态化页面。然后通过第一原生容器节点,在第二动态化页面中渲染内容节点,并播放渲染获得的目标多媒体内容。
具体地,由于第一动态化页面和第二动态化页面对应同一个跨平台动态化框架,因此,第一动态化页面和第二动态化页面共享第一节点树。基于此,当从第一动态化页面切换至第二动态化页面时,不需要借助容器切换组件额外创建原生容器节点,可以沿用第一节点树中的第一原生容器节点和内容节点,同时,修改第一原生容器节点中携带的目标多媒体内容的展示属性信息。然后按照修改后的目标多媒体内容的展示属性信息,渲染内容节点,并按照修改后的目标多媒体内容的展示属性信息,展示渲染获得的目标多媒体内容。
一种可能的实施方式,目标多媒体内容为目标视频,修改后的目标多媒体内容的展示属性信息为第二展示位置和视频最小化播放模式。
通过第一原生容器节点,在第二动态化页面中,按照视频最小化播放模式和第二展示位置渲染内容节点。然后在第二动态化页面中的第二展示位置,按照视频最小化播放模式播放渲染获得的目标视频。
具体地,在对第一节点树进行渲染过程中,根据节点树的渲染规则,在跨平台动态化框架中渲染第一节点树中的第一原生容器节点时,会自动触发原生渲染系统的节点树渲染流程,即按照目标视频的展示属性信息,渲染第一原生容器节点下的内容节点,然后将渲染获得的目标视频按照展示属性信息,呈现在第二动态化页面中。
本申请实施例中,在目标应用中,当从一个动态化页面中切换至另一个动态化页面时,在一个动态化页面中播放的目标视频,依然可以在另一个动态化页面中保持渲染,并以视频最小化播放模式在另一个动态化页面中播放,这样既避免了目标视频对另一个动态化页面中的原始内容进行遮挡,同时使得对象可以继续观看目标视频,从而提升对象的使用体验。
需要说明的是,当从第一动态化页面切换至第二动态化页面之后,还可以继续从第二动态化页面切换至非动态化页面,然后响应于在非动态化页面中的页面恢复操作,从非动态化页面直接恢复至第一动态化页面,或者恢复至第二动态化页面。也就是说,在本申请中,目标应用中各页面之间的切换以及恢复关系可以根据实际需求进行设置,对此,本申请不做具体限定。
为了更好地解释本申请实施例,下面结合具体实施场景介绍本申请实施例提供的一种多媒体内容播放方法,该方法的流程可以由图1所示的终端设备101执行,如图12所示,包括以下页面切换阶段和页面恢复阶段。
在页面切换阶段,包括以下步骤:
步骤S1201,响应于在目标应用中针对目标视频触发的播放操作,创建第一动态化页面。
通过跨平台动态化框架,对第一动态化页面进行解析,获得目标视频对应的视频标签。然后从视频标签中获取目标视频的播放源信息以及第一动态化页面的页面恢复信息,并将播放源信息以及页面恢复信息传递至容器切换组件。
步骤S1202,通过容器切换组件,基于目标视频的播放源信息,在第一节点树中创建视频节点和第一原生容器节点。
基于视频节点在第一节点树中的目标位置,获得视频节点的目标索引信息,并将视频节点的目标索引信息保存在容器切换组件中。
步骤S1203,通过第一原生容器节点,在第一动态化页面中渲染视频节点,并播放渲染获得的目标视频。
步骤S1204,响应于在第一动态化页面中触发的页面切换操作,创建非动态化页面。
步骤S1205,通过容器切换组件,在非动态化页面对应的第二节点树中创建第二原生容器节点。
步骤S1206,通过容器切换组件,解除视频节点与第一原生容器节点的关联,以及建立视频节点与第二原生容器节点的关联。
具体地,通过容器切换组件,基于目标索引信息,从第一节点树中查询获得视频节点。然后解除视频节点与第一原生容器节点的关联,以及建立视频节点与第二原生容器节点的关联。将目标索引信息更新为视频节点在第二节点树中的目标位置。
步骤S1207,通过第二原生容器节点,在非动态化页面中渲染视频节点,并播放渲染获得的目标视频。
在页面恢复阶段,包括以下步骤:
步骤S1208,响应于在非动态化页面中触发的页面恢复操作,基于容器切换组件中保存的页面恢复信息,创建第一动态化页面。
通过跨平台动态化框架,对第一动态化页面进行解析,获得目标视频对应的视频标签。然后从视频标签中获取目标视频的播放源信息以及第一动态化页面的页面恢复信息,并将播放源信息以及页面恢复信息传递至容器切换组件。
步骤S1209,通过容器切换组件,在第一节点树中创建第一原生容器节点。
步骤S1210,解除视频节点与第二原生容器节点的关联,以及建立视频节点与第一原生容器节点的关联。
具体地,通过容器切换组件,基于目标索引信息,从第二节点树中查询获得视频节点。然后解除视频节点与第二原生容器节点的关联,以及建立视频节点与第一原生容器节点的关联。将目标索引信息更新为视频节点在第一节点树中的目标位置。
步骤S1211,通过第一原生容器节点,在第一动态化页面中渲染视频节点,并播放渲染获得的目标视频。
本申请实施例中,当触发从第一动态化页面切换至非动态化页面时,通过容器切换组件,在非动态化页面对应的第二节点树中创建第二原生容器节点,并解除视频节点与第一原生容器节点的关联,以及建立视频节点与第二原生容器节点的关联,故在基于第二节点树渲染非动态化页面时,可以相应通过第二原生容器节点在非动态化页面中渲染视频节点,实现在页面切换后的非动态化页面中继续渲染并播放目标视频,从而提升对象的观看体验。
基于相同的技术构思,本申请实施例提供了一种多媒体内容播放装置的结构示意图,如图13所示,该多媒体内容播放装置1300包括:
播放模块1301,用于在目标应用的第一动态化页面中播放目标多媒体内容,所述第一动态化页面对应的第一节点树中包括所述目标多媒体内容对应的内容节点,以及与所述内容节点关联的第一原生容器节点;
切换模块1302,用于响应于在所述第一动态化页面中触发的页面切换操作,创建非动态化页面;
处理模块1303,用于通过容器切换组件,在所述非动态化页面对应的第二节点树中创建第二原生容器节点,并解除所述内容节点与所述第一原生容器节点的关联,以及建立所述内容节点与所述第二原生容器节点的关联;
所述播放模块1301,用于通过所述第二原生容器节点,在所述非动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
可选地,所述播放模块1301具体用于:
通过所述第二原生容器节点,在所述非动态化页面中按照所述展示属性信息渲染所述内容节点,并在所述非动态化页面中,按照所述展示属性信息播放所述目标多媒体内容。
可选地,所述展示属性信息包括视频最小化播放模式以及第一展示位置,所述目标多媒体内容为目标视频;
所述播放模块1301具体用于:
在所述非动态化页面中的第一展示位置,按照视频最小化播放模式播放所述目标视频。
可选地,所述播放模块1301具体用于:
响应于在所述目标应用中针对所述目标多媒体内容触发的播放操作,创建所述第一动态化页面;
通过所述容器切换组件,基于所述目标多媒体内容的播放源信息,在所述第一节点树中创建所述内容节点和所述第一原生容器节点;
通过所述第一原生容器节点,在所述第一动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
可选地,所述切换模块1302还用于:
通过所述第二原生容器节点,在所述非动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容之后,响应于在所述非动态化页面中触发的页面恢复操作,基于所述容器切换组件中保存的页面恢复信息,创建所述第一动态化页面;
所述处理模块1303还用于:
通过所述容器切换组件,在所述第一节点树中创建所述第一原生容器节点,并解除所述内容节点与所述第二原生容器节点的关联,以及建立所述内容节点与所述第一原生容器节点的关联;
所述播放模块1301还用于:
通过所述第一原生容器节点,在所述第一动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
可选地,所述处理模块1303还用于:
通过所述容器切换组件,基于所述目标多媒体内容的播放源信息,在所述第一节点树中创建所述内容节点和所述第一原生容器节点之前,对所述第一动态化页面进行解析,获得所述目标多媒体内容对应的多媒体标签;
从所述多媒体标签中获取所述目标多媒体内容的播放源信息以及所述第一动态化页面的页面恢复信息,并将所述播放源信息以及所述页面恢复信息传递至所述容器切换组件。
可选地,所述处理模块1303还用于:
通过所述容器切换组件,基于所述目标多媒体内容的播放源信息,在所述第一节点树中创建所述内容节点和所述第一原生容器节点之后,基于所述内容节点在所述第一节点树中的目标位置,获得所述内容节点的目标索引信息,并将所述内容节点的目标索引信息保存在所述容器切换组件中;
所述处理模块1303还用于:
解除所述内容节点与所述第一原生容器节点的关联,以及建立所述内容节点与所述第二原生容器节点的关联之前,通过所述容器切换组件,基于所述目标索引信息,从所述第一节点树中查询获得所述内容节点。
可选地,所述切换模块1302还用于:
响应于在所述第一动态化页面中触发的页面切换操作,创建第二动态化页面;
所述播放模块1301还用于:
通过所述第一原生容器节点,在所述第二动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
可选地,所述目标多媒体内容为目标视频;
所述播放模块1301具体用于:
通过所述第一原生容器节点,在所述第二动态化页面中,按照视频最小化播放模式和第二展示位置渲染所述内容节点;
在所述第二动态化页面中的第二展示位置,按照视频最小化播放模式播放渲染获得的所述目标视频。
本申请实施例中,当触发从第一动态化页面切换至非动态化页面时,通过容器切换组件,在非动态化页面对应的第二节点树中创建第二原生容器节点,并解除视频节点与第一原生容器节点的关联,以及建立视频节点与第二原生容器节点的关联,故在基于第二节点树渲染非动态化页面时,可以相应通过第二原生容器节点在非动态化页面中渲染视频节点,实现在页面切换后的非动态化页面中继续渲染并播放目标视频,从而提升对象的观看体验。
基于相同的技术构思,本申请实施例提供了一种计算机设备,该计算机设备可以是图1所示的终端设备和/或服务器,如图14所示,包括至少一个处理器1401,以及与至少一个处理器连接的存储器1402,本申请实施例中不限定处理器1401与存储器1402之间的具体连接介质,图14中处理器1401和存储器1402之间通过总线连接为例。总线可以分为地址总线、数据总线、控制总线等。
在本申请实施例中,存储器1402存储有可被至少一个处理器1401执行的指令,至少一个处理器1401通过执行存储器1402存储的指令,可以执行上述多媒体内容播放方法的步骤。
其中,处理器1401是计算机设备的控制中心,可以利用各种接口和线路连接计算机设备的各个部分,通过运行或执行存储在存储器1402内的指令以及调用存储在存储器1402内的数据,从而实现多媒体内容播放。可选的,处理器1401可包括一个或多个处理单元,处理器1401可集成应用处理器和调制解调处理器,其中,应用处理器主要处理操作系统、用户界面和应用程序等,调制解调处理器主要处理无线通信。可以理解的是,上述调制解调处理器也可以不集成到处理器1401中。在一些实施例中,处理器1401和存储器1402可以在同一芯片上实现,在一些实施例中,它们也可以在独立的芯片上分别实现。
处理器1401可以是通用处理器,例如中央处理器(CPU)、数字信号处理器、专用集成电路(Application Specific Integrated Circuit,ASIC)、现场可编程门阵列或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件,可以实现或者执行本申请实施例中公开的各方法、步骤及逻辑框图。通用处理器可以是微处理器或者任何常规的处理器等。结合本申请实施例所公开的方法的步骤可以直接体现为硬件处理器执行完成,或者用处理器中的硬件及软件模块组合执行完成。
存储器1402作为一种非易失性计算机可读存储介质,可用于存储非易失性软件程序、非易失性计算机可执行程序以及模块。存储器1402可以包括至少一种类型的存储介质,例如可以包括闪存、硬盘、多媒体卡、卡型存储器、随机访问存储器(Random AccessMemory,RAM)、静态随机访问存储器(Static Random Access Memory,SRAM)、可编程只读存储器(Programmable Read Only Memory,PROM)、只读存储器(Read Only Memory,ROM)、带电可擦除可编程只读存储器(Electrically Erasable Programmable Read-Only Memory,EEPROM)、磁性存储器、磁盘、光盘等等。存储器1402是能够用于携带或存储具有指令或数据结构形式的期望的程序代码并能够由计算机设备存取的任何其他介质,但不限于此。本申请实施例中的存储器1402还可以是电路或者其它任意能够实现存储功能的装置,用于存储程序指令和/或数据。
基于同一发明构思,本申请实施例提供了一种计算机可读存储介质,其存储有可由计算机设备执行的计算机程序,当程序在计算机设备上运行时,使得计算机设备执行上述多媒体内容播放方法的步骤。
基于同一发明构思,本申请实施例提供了一种计算机程序产品,所述计算机程序产品包括存储在计算机可读存储介质上的计算机程序,所述计算机程序包括程序指令,当所述程序指令被计算机设备执行时,使所述计算机设备执行上述多媒体内容播放方法的步骤。
本领域内的技术人员应明白,本发明的实施例可提供为方法、或计算机程序产品。因此,本发明可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且,本发明可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本发明是参照根据本发明实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器,使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中,使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品,该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上,使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理,从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
尽管已描述了本发明的优选实施例,但本领域内的技术人员一旦得知了基本创造性概念,则可对这些实施例作出另外的变更和修改。所以,所附权利要求意欲解释为包括优选实施例以及落入本发明范围的所有变更和修改。
显然,本领域的技术人员可以对本发明进行各种改动和变型而不脱离本发明的精神和范围。这样,倘若本发明的这些修改和变型属于本发明权利要求及其等同技术的范围之内,则本发明也意图包含这些改动和变型在内。

Claims (13)

1.一种多媒体内容播放方法,其特征在于,包括:
在目标应用的第一动态化页面中播放目标多媒体内容,所述第一动态化页面对应的第一节点树中包括所述目标多媒体内容对应的内容节点,以及与所述内容节点关联的第一原生容器节点;
响应于在所述第一动态化页面中触发的页面切换操作,创建非动态化页面;
通过容器切换组件,在所述非动态化页面对应的第二节点树中创建第二原生容器节点,并解除所述内容节点与所述第一原生容器节点的关联,以及建立所述内容节点与所述第二原生容器节点的关联;
通过所述第二原生容器节点,在所述非动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
2.如权利要求1所述的方法,其特征在于,所述第二原生容器节点中携带所述目标多媒体内容在所述非动态化页面中的展示属性信息;
所述通过所述第二原生容器节点,在所述非动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容,包括:
通过所述第二原生容器节点,在所述非动态化页面中按照所述展示属性信息渲染所述内容节点,并在所述非动态化页面中,按照所述展示属性信息播放所述目标多媒体内容。
3.如权利要求2所述的方法,其特征在于,所述展示属性信息包括视频最小化播放模式以及第一展示位置,所述目标多媒体内容为目标视频;
所述在所述非动态化页面中,按照所述展示属性信息播放所述目标多媒体内容,包括:
在所述非动态化页面中的第一展示位置,按照视频最小化播放模式播放所述目标视频。
4.如权利要求1所述的方法,其特征在于,所述在目标应用的第一动态化页面中播放目标多媒体内容,包括:
响应于在所述目标应用中针对所述目标多媒体内容触发的播放操作,创建所述第一动态化页面;
通过所述容器切换组件,基于所述目标多媒体内容的播放源信息,在所述第一节点树中创建所述内容节点和所述第一原生容器节点;
通过所述第一原生容器节点,在所述第一动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
5.如权利要求4所述的方法,其特征在于,所述通过所述第二原生容器节点,在所述非动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容之后,还包括:
响应于在所述非动态化页面中触发的页面恢复操作,基于所述容器切换组件中保存的页面恢复信息,创建所述第一动态化页面;
通过所述容器切换组件,在所述第一节点树中创建所述第一原生容器节点,并解除所述内容节点与所述第二原生容器节点的关联,以及建立所述内容节点与所述第一原生容器节点的关联;
通过所述第一原生容器节点,在所述第一动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
6.如权利要求5所述的方法,其特征在于,所述通过所述容器切换组件,基于所述目标多媒体内容的播放源信息,在所述第一节点树中创建所述内容节点和所述第一原生容器节点之前,还包括:
对所述第一动态化页面进行解析,获得所述目标多媒体内容对应的多媒体标签;
从所述多媒体标签中获取所述目标多媒体内容的播放源信息以及所述第一动态化页面的页面恢复信息,并将所述播放源信息以及所述页面恢复信息传递至所述容器切换组件。
7.如权利要求4所述的方法,其特征在于,所述通过所述容器切换组件,基于所述目标多媒体内容的播放源信息,在所述第一节点树中创建所述内容节点和所述第一原生容器节点之后,还包括:
基于所述内容节点在所述第一节点树中的目标位置,获得所述内容节点的目标索引信息,并将所述内容节点的目标索引信息保存在所述容器切换组件中;
所述解除所述内容节点与所述第一原生容器节点的关联,以及建立所述内容节点与所述第二原生容器节点的关联之前,包括:
通过所述容器切换组件,基于所述目标索引信息,从所述第一节点树中查询获得所述内容节点。
8.如权利要求4所述的方法,其特征在于,还包括:
响应于在所述第一动态化页面中触发的页面切换操作,创建第二动态化页面;
通过所述第一原生容器节点,在所述第二动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
9.如权利要求8所述的方法,其特征在于,所述目标多媒体内容为目标视频;
所述通过所述第一原生容器节点,在所述第二动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容,包括:
通过所述第一原生容器节点,在所述第二动态化页面中,按照视频最小化播放模式和第二展示位置渲染所述内容节点;
在所述第二动态化页面中的第二展示位置,按照视频最小化播放模式播放渲染获得的所述目标视频。
10.一种多媒体内容播放装置,其特征在于,包括:
播放模块,用于在目标应用的第一动态化页面中播放目标多媒体内容,所述第一动态化页面对应的第一节点树中包括所述目标多媒体内容对应的内容节点,以及与所述内容节点关联的第一原生容器节点;
切换模块,用于响应于在所述第一动态化页面中触发的页面切换操作,创建非动态化页面;
处理模块,用于通过容器切换组件,在所述非动态化页面对应的第二节点树中创建第二原生容器节点,并解除所述内容节点与所述第一原生容器节点的关联,以及建立所述内容节点与所述第二原生容器节点的关联;
所述播放模块,用于通过所述第二原生容器节点,在所述非动态化页面中渲染所述内容节点,并播放渲染获得的目标多媒体内容。
11.一种计算机设备,包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序,其特征在于,所述处理器执行所述程序时实现权利要求1~9任一所述方法的步骤。
12.一种计算机可读存储介质,其特征在于,其存储有可由计算机设备执行的计算机程序,当所述程序在计算机设备上运行时,使得所述计算机设备执行权利要求1~9任一所述方法的步骤。
13.一种计算机程序产品,其特征在于,所述计算机程序产品包括存储在计算机可读存储介质上的计算机程序,所述计算机程序包括程序指令,当所述程序指令被计算机设备执行时,使所述计算机设备执行权利要求1-9任一项所述的方法的步骤。
CN202210220023.8A 2022-03-08 2022-03-08 一种多媒体内容播放方法、装置、设备及存储介质 Pending CN116775916A (zh)

Priority Applications (3)

Application Number Priority Date Filing Date Title
CN202210220023.8A CN116775916A (zh) 2022-03-08 2022-03-08 一种多媒体内容播放方法、装置、设备及存储介质
PCT/CN2023/078654 WO2023169252A1 (zh) 2022-03-08 2023-02-28 多媒体内容处理方法、装置、设备、程序产品及存储介质
US18/369,036 US20240007701A1 (en) 2022-03-08 2023-09-15 Continuing video playback when switching from a dynamic page to a non-dynamic page

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202210220023.8A CN116775916A (zh) 2022-03-08 2022-03-08 一种多媒体内容播放方法、装置、设备及存储介质

Publications (1)

Publication Number Publication Date
CN116775916A true CN116775916A (zh) 2023-09-19

Family

ID=87937209

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202210220023.8A Pending CN116775916A (zh) 2022-03-08 2022-03-08 一种多媒体内容播放方法、装置、设备及存储介质

Country Status (3)

Country Link
US (1) US20240007701A1 (zh)
CN (1) CN116775916A (zh)
WO (1) WO2023169252A1 (zh)

Families Citing this family (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN117032907B (zh) * 2023-10-10 2023-12-19 成都华栖云科技有限公司 一种移动端组件的容器化方法及app容器系统
CN117376652B (zh) * 2023-12-07 2024-04-09 深圳市优友互联股份有限公司 直播场景交互追溯的方法和装置、计算机设备、存储介质

Family Cites Families (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US7219308B2 (en) * 2002-06-21 2007-05-15 Microsoft Corporation User interface for media player program
CN107197393A (zh) * 2017-06-16 2017-09-22 广州荔枝网络有限公司 一种单例视频播放器的实现方法
CN107341018B (zh) * 2017-07-07 2020-12-29 阿里巴巴(中国)有限公司 一种在页面切换后继续显示视图的方法和装置
CN107277601B (zh) * 2017-07-12 2020-03-10 北京潘达互娱科技有限公司 视频播放方法及装置
CN110582017B (zh) * 2019-09-10 2022-04-19 腾讯科技(深圳)有限公司 一种视频播放方法、装置、终端及存储介质
CN113891135B (zh) * 2021-03-08 2023-10-27 北京字跳网络技术有限公司 一种多媒体数据播放方法、装置、电子设备及存储介质

Also Published As

Publication number Publication date
WO2023169252A1 (zh) 2023-09-14
US20240007701A1 (en) 2024-01-04

Similar Documents

Publication Publication Date Title
CN108279966B (zh) 网页截图方法、装置、终端及存储介质
CN105955888B (zh) 一种页面调试预览方法及系统
US11262883B2 (en) Associating browser with application
CN116775916A (zh) 一种多媒体内容播放方法、装置、设备及存储介质
CN111611518B (zh) 基于Html5的可视化展示页面自动发布方法及系统
CN111796823A (zh) 页面更新、页面展示的方法、装置及页面维护系统
CN113268226A (zh) 页面数据生成方法、装置、存储介质及设备
EP2711846A1 (en) Method and device for processing template file
CN113411664B (zh) 基于子应用的视频处理方法、装置和计算机设备
CN111984902A (zh) 可视化页面配置方法、系统、计算机设备和存储介质
CN112015485A (zh) 页面展示方法、装置、电子设备及存储介质
CN105723364A (zh) 从第一搜索结果环境转变到第二搜索结果环境
JP2023500203A (ja) 画像置換修復
EP4080507A1 (en) Method and apparatus for editing object, electronic device and storage medium
JP2018508061A (ja) 適応型電子文書
CN111626021B (zh) 一种演示文稿生成方法及装置
CN114756228A (zh) 页面处理方法、装置、设备及存储介质
CN113784194A (zh) 一种视频播放器的嵌入方法和装置
CN111414507A (zh) 一种信息显示方法、设备、装置及计算机可读存储介质
CN110569460B (zh) 推送信息展示方法、装置及存储介质
CN113672829B (zh) 页面展示方法、装置、电子设备及存储介质
CN113038225B (zh) 视频播放方法、装置、计算设备以及存储介质
CN114063958A (zh) 页面分屏显示方法及装置
CN113608737A (zh) 页面生成方法、装置、设备及介质
CN112307378B (zh) 网络视图展示方法

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
REG Reference to a national code

Ref country code: HK

Ref legal event code: DE

Ref document number: 40093793

Country of ref document: HK