使用英语阅读

通过


Video and media interactions

Many Android applications have use cases with video or media players. Foldables provide additional screen area for content, and also offer unique device positioning that supports video consumption.

This page provides guidance for building multimedia experiences on larger screen displays, including recommended patterns and things to avoid.

Video guidelines

Two dual-screen wireframes - the first showing the correct placement of video content to the side of the hinge, the second showing the incorrect placement under the hinge

Do Don't
Consider displaying video on one screen with metadata and use the second screen to have additional content related to the media. Avoid having the video passing through the hinge and squeezing the related content on the remaining portion of the screen.

Two dual-screen wireframes - the first showing the correct placement of subtitles content to the side of the hinge, the second showing the incorrect placement under the hinge

Do Don't
Make subtitles hinge aware, so that they wrap on a single screen when necessary. Avoid having subtitles pass under the hinge, which can make part of the text unreadable.

Two dual-screen wireframes - the first showing the correct placement of video player controls to the side of the hinge, the second showing the incorrect placement under the hinge

Do Don't
Place video or media controls away from the hinge and positioned in the reachable portion of the screen. Avoid having controls that pass through the hinge, causing one or more controls to be unreachable.

Two dual-screen wireframes - the first showing the correct placement of video above the hinge and other content, such as a list of other content, below the hinge. The second shows the incorrect placement of video content under the hinge

Do Don't
In double landscape orientation, position the video player on the top screen and related content on the bottom screen, with no content behind the hinge. Avoid playing videos that are letterboxed with controls that render under the hinge.

Two dual-screen wireframes - the first showing the correct placement of video content above the hinge, the second showing the incorrect placement under the hinge

Do Don't
In double landscape orientation, position the video player on the top screen and the controls on the bottom screen. Avoid playing videos that are letterboxed with controls that render under the hinge.

Media guidelines

Two dual-screen wireframes (one wide and one tall) - the first showing the correct placement of video content to the side of the hinge and other content, such as a collection or list of videos, on the other screen. The second shows the incorrect placement of video content under the hinge

Do Don't
For portrait-orientation content, consider having a list of media/content on one screen and the current media displayed on the other screen. Avoid showing media content that is partly obscured by the hinge.

Two dual-screen wireframes in tall mode - the first showing the correct placement of video content to the side of the hinge and other content, such as a collection or list of videos, on the other screen. The second shows the incorrect placement of video content under the hinge

Do Don't
For portrait-orientation content, consider having a list of media/content on one screen and the current media displayed on the other screen. Avoid showing media content that is partly obscured by the hinge.

Two dual-screen wireframes (one wide and one tall)- the first showing the correct placement of video content to the side of the hinge and other content, such as a collection or metadata display, on the other screen. The second shows the incorrect placement of video content under the hinge

Do Don't
Consider having list of media/content on one screen and current media displayed on the other screen. Avoid having media content that is partly obscured by the hinge.