画中画

画中画 (PiP) 是一种多窗口模式,适用于播放全屏视频的 activity。通过该模式,用户可以在固定到屏幕一角的小窗口中观看视频,同时在应用之间进行导航或浏览主屏幕上的内容。

图 1:您的用户即使不在您的应用中,也可以继续观看视频

断球数

  • 请确保当 activity 处于画中画模式时,界面元素处于隐藏状态且视频播放继续。
  • 为非视频内容停用无缝大小调整。
  • 界面最少的视频播放 Activity 可提供最佳用户体验。
  • 避免展示除视频内容以外的任何其他内容。

向应用添加对画中画的支持

默认情况下,系统不会为应用自动支持画中画功能,需要声明该功能才能支持该功能。

画中画窗口显示在屏幕的最上层,位于系统选择的一角。

控件

默认情况下,Android 提供了用于关闭窗口、将其展开回全屏、设置和媒体播放的画中画控件。您的应用可以添加自定义操作和适当的图标资源,以允许用户与画中画内容互动。

用户可通过点按移动设备上的窗口或从电视遥控器中选择菜单,从画中画窗口菜单显示这些控件。如果应用具有活跃的媒体会话,则系统还会显示播放、暂停、下一个和上一个控件。了解如何添加这些控件

在画中画模式下,您的 activity 会显示在一个小窗口中。在此模式下,用户无法与应用的其他界面元素互动,并且可能很难在画中画窗口中看到小界面元素的详细信息。

图 2:默认画中画控件


图 3:自定义画中画控件示例

转场效果

从进入到画中画的流畅动画

如果用户触发画中画模式,当前 activity 会从全屏缩小到小窗口,从而继续显示内容,而不会叠加任何界面。

Android 12 对全屏窗口和画中画窗口之间的动画过渡效果进行了重大改进。我们强烈建议您实现所有适用的更改;完成后,这些更改会自动扩展到可折叠设备和平板电脑等大屏幕,而无需您执行进一步操作。

如果您的应用不包含这些适用的更新,画中画过渡仍然有效,但动画会不太美观。例如,从全屏转换为画中画模式可能会导致画中画窗口在过渡期间消失,然后在过渡完成后重新出现。

从 Android 12 开始,PictureInPictureParams.Builder.setAutoEnterEnabled(true) 标志可提供更流畅的动画,用于在画中画模式下使用手势导航过渡到视频内容(例如,从全屏向上滑动到主屏幕时)。如果您的应用属于 ENTERTAINMENTCOMMUNICATIONVIDEO_PLAYER 应用类别,我们建议您采用此方式。

如果您的应用未包含此变更,则包含手势导航的画中画转场仍然可用,但动画效果不太精致。视频 1 展示了一个这样的示例:窗口缩小为应用图标并消失,然后在过渡完成后重新出现。

视频 1:当画中画未正确实现 setAutoEnterEnabled 时,提供不太精致的过渡体验

视频 2 展示了一个相同过渡的示例,但向应用添加了 setAutoEnterEnabled

视频 2:更完善的过渡体验

流畅的视频画面

在 Android 8.0 中引入画中画功能时,sourceRectHint 用于指明在转换为画中画之后可见的 activity 区域,例如视频播放器中的视频视图边界。从 Android 12 开始,操作系统使用 sourceRectHint 在进入和退出画中画模式时实现更流畅的动画。

如果您的应用未提供适当的 sourceRectHint,画中画过渡仍正常运行,但动画不够精美。例如,视频 3 展示了一个从全屏到画中画模式的过渡不那么精致的示例:全屏窗口缩小到画中画窗口后,它会被一个黑色叠加层覆盖,然后再重新显示视频。

视频 3:当画中画未正确实现 sourceRectHint 时,提供不太精致的过渡体验

如需查看正确实现 sourceRectHint 后画中画动画的显示效果示例,请参阅上一部分中的视频 2。

如需了解如何实现精美的过渡体验,请参阅 Android Kotlin PictureInPicture 示例

用法

用户不仅可以在您的应用中继续观看视频,而且可以在其设备上继续观看视频。您的应用控制当前 activity 何时进入画中画模式,这可以是一种互动,例如退出当前视图或向上滑动返回主屏幕。

以下是一些可执行的操作示例:

  • 当用户点按主屏幕按钮或向上滑动到主屏幕时,activity 可以进入画中画模式。这就是 Google 地图在用户同时运行其他 activity 时继续显示路线的方式。

    图 4:用于继续寻路体验的画中画
  • 您的应用可以在用户从某个视频返回以浏览其他内容时,将该视频切换到画中画模式。

  • 您的应用可以在用户观看到某集内容结束时,将视频切换到画中画模式。主屏幕会显示有关这部电视剧下一集的宣传信息或剧情摘要信息。

  • 您的应用可以提供一种方式,让用户可以在观看视频时将其他内容加入播放队列。当主屏幕显示内容选择 activity 时,视频会继续以画中画模式播放。

利用可补充观看体验而不会造成干扰的互动模式。例如,如果视频正在播放某集内容的结尾,那么用户在离开主屏幕时进入画中画模式,需要执行额外的操作才能返回和停止播放,或者浏览一些小控件。

在您的应用中,用户可能会在主屏幕上浏览内容时选择新的视频,同时视频播放 activity 处于画中画模式。应采用全屏模式在现有播放 activity 中播放新视频,而不是启动可能会使用户感到困惑的新 activity。

用户可以将画中画窗口拖动到其他位置。

  • 点按一次该窗口可显示全屏切换开关、关闭按钮、设置按钮以及应用提供的自定义操作(例如播放控件)。

    图 5:默认画中画控件
  • 点按两次窗口即可在当前画中画大小与最大或最小画中画大小之间切换。例如,点按两次最大化窗口会将其最小化,反之亦然。

    图 6:点按两次尺寸在最小和最大尺寸之间切换
  • 将窗口拖动到左侧或右侧边缘,即可隐藏窗口。如需取消隐藏窗口,请点按已隐藏窗口的可见部分或将其拖出。

    图 7:已隐藏画中画
  • 使用“双指张合即可缩放”手势可调整画中画窗口的大小。

  • 向下滑动画中画即可移除该窗口。

    图 8:向下滑动

如需详细了解如何实现画中画,请参阅画中画开发者文档