Methods, apparatus, devices, media, and products for displaying media content

Abstract

This document relates to methods, apparatus, devices, media, and products for displaying media content. The method includes displaying media content on a first interface. The method further includes displaying the first display area in a first display style in response to a first operation triggered on the first interface, the first display area being used to display the media content, and displaying a second display area associated with the first display area, the second display area being used to display descriptive content associated with the media content. The method also includes displaying the first display area in a second display style in response to a second operation triggered on the second display area, the second display style being different from the first display style.

Description

Technical Field

[0001] This article generally covers the field of content display, specifically methods, apparatuses, devices, media, and products for displaying media content. Background Technology

[0002] With the rapid development of mobile internet, smart terminals, and digital content platforms, images, videos, GIFs, and combinations of text and images have become important forms of information dissemination and content consumption. Users can browse, publish, and share media content through mobile phones, tablets, personal computers, and other terminal devices, and obtain information of interest through social media platforms, short video platforms, news platforms, or content communities. Media content can present people, scenes, and events in an intuitive and vivid way, helping to improve information transmission efficiency and enrich users' content browsing and social interaction experiences. However, there are still many issues that need to be addressed in the process of displaying media content. Summary of the Invention

[0003] This article provides a method, apparatus, device, medium, and product for displaying media content.

[0004] According to a first aspect of this document, a method for displaying media content is provided. The method includes displaying the media content on a first interface. The method further includes displaying a first display area in response to a first operation triggered on the first interface, the first display area being used to display the media content, and a second display area displayed in association with the first display area, the second display area being used to display descriptive content associated with the media content. The method also includes displaying the first display area in response to a second operation triggered on the second display area, the second display style being different from the first display style. This method can improve the efficiency of interface transitions between different display styles for media content, enhance the coherence between the display of media content and associated text, and improve the user's operational experience when browsing media content.

[0005] According to a second aspect of this document, an apparatus for displaying media content is provided. The apparatus includes a media content display module for displaying media content on a first interface; a first display style display module for displaying a first display area in a first display style in response to a first operation triggered on the first interface, the first display area being used to display the media content; a second display area displayed in association with the first display area, the second display area being used to display descriptive content associated with the media content; and a second display style display module for displaying the first display area in a second display style in response to a second operation triggered on the second display area, the second display style being different from the first display style. This apparatus can improve the efficiency of interface transitions between different display styles for media content, enhance the coherence between the display of media content and associated text, and improve the user's operational experience when browsing media content.

[0006] In a third aspect of this document, an electronic device is provided, including at least one processor and a storage device for storing at least one program, which, when executed by the at least one processor, causes the at least one processor to implement the method according to the first aspect of this document. This electronic device enables media content and its associated text to be presented continuously across different display styles, improving the efficiency of transitions between different display states and enhancing the consistency of state and user experience during media content display.

[0007] In a fourth aspect of this document, a computer-readable storage medium is provided having a computer program stored thereon that, when executed by a processor, implements the method according to the first aspect of this document. The program stored in this computer-readable storage medium enables the display and switching of media content and its associated text in different display styles, thereby improving the efficiency of transitions between different display states and enhancing the continuity of media content browsing and the user experience.

[0008] In a fifth aspect of this document, a computer program product is provided. This computer program product includes a computer program that, when executed by a processor, implements the method according to the first aspect of this document. Through this computer program product, media content and its associated text can be displayed in different display styles when the program is executed by the processor, and switching between different display styles in response to user operations, thereby improving the efficiency of media content display and the user browsing experience.

[0009] It should be understood that the content described in this section is not intended to define the key or essential features of this document, nor is it intended to limit the scope of this document. Other features of this document will become readily apparent from the following description. Attached Figure Description

[0010] The above and other objects, features and advantages of this document will become more apparent from a more detailed description taken in conjunction with the accompanying drawings, wherein like reference numerals generally denote like parts.

[0011] Figure 1 The illustration shows a schematic diagram of an example environment in which the device and / or method may be implemented;

[0012] Figure 2 The illustration shows a sample method for displaying media content;

[0013] Figure 3 The illustration shows an example of media content and its associated descriptive content in the first interface;

[0014] Figure 4 The illustration shows an example of text and image display under the first display style;

[0015] Figure 5 The illustration shows an example of a text and image details page under the second display style;

[0016] Figure 6 The illustration shows an example of complete media content in a text and image details page;

[0017] Figure 7 The illustration shows an example of the return operation on the text and image details page under the second display style;

[0018] Figure 8 The illustration shows an example of a text and image details page when the media content is in autoplay mode;

[0019] Figure 9 The illustration shows an example of a text and image details page when media content switches from playback to pause.

[0020] Figure 10 The illustration shows an example of a graphic details page when media content resumes playback and sound controls are displayed;

[0021] Figure 11 The illustration shows an example of entering a text and image details page when the media content is paused;

[0022] Figure 12 The illustration shows an example of media content resuming from a paused state to an autoplay state;

[0023] Figure 13 The illustration shows a schematic block diagram of a device for displaying media content;

[0024] Figure 14 A schematic block diagram is shown for an example device used to implement the contents of this article. Detailed Implementation

[0025] It is understood that the data involved in this article (including but not limited to the data itself, the acquisition or use of the data) shall comply with the requirements of relevant laws, regulations and related provisions.

[0026] It is understandable that before using the technical content disclosed in this article, users should be informed of the type, scope of use, and usage scenarios of the personal information involved in this article in an appropriate manner in accordance with relevant laws and regulations, and their authorization should be obtained.

[0027] For example, upon receiving a user's proactive request, a prompt message can be sent to the user to explicitly inform them that the requested operation will require the acquisition and use of the user's personal information. This allows the user to independently choose whether to provide personal information to the software or hardware, such as electronic devices, applications, servers, or storage media, that perform the operations described in this document.

[0028] As an optional but non-limiting implementation, in response to a user's active request, sending a prompt message to the user can be done via a pop-up window, where the prompt message can be presented in text format. Furthermore, the pop-up window can also include a selection control allowing the user to choose "agree" or "disagree" to provide personal information to the electronic device.

[0029] It is understood that the above notification and user authorization process is merely illustrative and does not limit the implementation method described in this article. Other methods that comply with relevant laws and regulations may also be applied to the implementation method described in this article.

[0030] The present invention will now be described in more detail with reference to the accompanying drawings. While the drawings illustrate the contents of this document, it should be understood that this document can be implemented in various forms and should not be construed as limited to the contents set forth herein; rather, these contents are provided to provide a more thorough and complete understanding of the document. It should be understood that the drawings and contents of this document are for illustrative purposes only and are not intended to limit the scope of this document.

[0031] In this description, the term "including" and similar terms should be understood as open inclusion, i.e., "including but not limited to". The term "based on" should be understood as "at least partially based on". The terms "first", "second", etc., may refer to different or the same objects. Other explicit and implicit definitions may also be included below.

[0032] In existing media content display technologies, users can typically browse media content such as images and videos in content stream interfaces, recommendation interfaces, or information display interfaces, and then view related titles, body text, descriptions, or other text information by entering detail pages. For example, a user can first view media content in the content stream interface, and then enter an information page by clicking on the media content or detail controls to view more complete text content. However, media content and related text are usually distributed across different interfaces or displayed in a fixed style, requiring users to switch between multiple interfaces, which can easily interrupt the media content browsing process.

[0033] Furthermore, existing media content display interfaces typically employ relatively fixed area layouts and display styles, making it difficult to flexibly adjust to different user browsing needs for media content and related text. For example, when a user needs to view a large amount of text information, the display space for media content may be limited; when a user wants to continue browsing media content, they may need to exit the current page or re-enter another interface. Consequently, existing technologies are prone to problems such as disjointed transitions between media content and related text, cumbersome switching between different display states, and long user browsing paths, affecting the efficiency of media content browsing and the user experience.

[0034] To address this, this paper proposes a method for displaying media content. In this method, a computing device displays media content on a first interface. Then, in response to a first operation triggered by the first interface, the computing device displays a first display area with a first display style. The first display area is used to display the media content, and a second display area is displayed in association with the first display area. The second display area displays descriptive content associated with the media content. Then, in response to a second operation triggered by the second operation, the computing device displays the first display area with a second display style different from the first display style. This method reduces the need for users to repeatedly enter and exit different pages, improving the efficiency of transitions between different display states, the continuity of content browsing, and the user experience.

[0035] The following will describe this article in further detail with reference to the accompanying drawings. Figure 1 An example environment 100 is shown in which the devices and / or methods described herein may be implemented. Figure 1 As shown, environment 100 may include computing device 102 and application 104 running on computing device 102. Computing device 102 can display a corresponding interface, receive user operations, process interface data, and display processing results by running application 104.

[0036] Examples of computing device 102 include, but are not limited to, personal computers, server computers, handheld or laptop devices, mobile devices (such as mobile phones, personal digital assistants (PDAs), media players, etc.), multiprocessor systems, consumer electronics, minicomputers, mainframe computers, and distributed computing environments that include any of the above systems or devices. The application 104 running on the computing device may be a content platform application, a social application, a content creation application, a shopping application, an office application, a live streaming application, or a combined application that includes one or more of the above functions.

[0037] The steps performed by the computing device 102 in this article, such as interface display, information presentation, operation reception, data processing, content updating, page switching, and result display, can all be implemented by the application 104 running in the computing device 102, and will not be described in detail hereafter.

[0038] The above combination Figure 1 A schematic diagram illustrating an example environment in which the devices and / or methods described herein may be implemented is provided below. Figure 2 A diagram illustrating an example method for displaying media content according to this article. Figure 2 The method in can be derived from Figure 1 The computing device 102 or any suitable device in the system can be used for execution.

[0039] like Figure 2 As shown, in example method 200, at box 202, the computing device can display media content on a first interface. The first interface can be a content streaming interface, a recommendation interface, a media content browsing interface, or other interfaces used to display media content. Media content can include images, videos, graphic content consisting of multiple images, animated GIFs, or other digital content that can be viewed by the user.

[0040] In one scenario, the first interface may include a first control, and the first action may be an action triggered by the first control. The first control may be a control used to view media content details or expand text associated with the media content. In one scenario, the first control may be displayed as "Expand," "View Full Text," "Comments," "Details," or other controls used to trigger the display of more content. Users can trigger the first action by clicking, touching, or selecting the first control. For example, in a content stream interface, a user can perform an action on the "Comments" control to pull up a panel displaying comment information associated with the current media content.

[0041] At box 204, the computing device can respond to a first operation to display a first display area and a second display area in a first display style. The first operation is triggered by a first interface. The first display area is used to display media content, and the second display area is displayed in association with the first display area. The second display area is used to display descriptive content associated with the media content. In one scenario, the media content can be graphic content. Graphic content can include images and text. The first display area can be used to display images in the graphic content, and the second display area can be used to display descriptive content in the graphic content. For example, the first display area can display one image or multiple images sequentially, and the second display area can display titles, body text, or comments corresponding to the one or more images. In one scenario, the first and second display styles can be used to define the display style of the first display area. For the second display area used to display information associated with the media content, the display style of the second display area can be the same or different under the first and second display styles. For example, the display position, display size, display content, or layout of the second display area can remain unchanged or change with the switching of the display style of the first display area.

[0042] In the first display style, the first display area can be located above the second display area. The second operation can be an operation to swipe upwards on the second display area. For example, the second display area can be displayed at the bottom of the first interface, and the user can move the second display area upwards along the screen by performing an upward swipe operation on the second display area. In this way, users can adjust the display area through intuitive swipe operations, improving the convenience of interface operation.

[0043] In one scenario, as the second display area moves upward, the computing device can detect the position of the second display area within the interface. In response to the second display area moving to a first predetermined position, the computing device can switch the first display area from a first display style to a second display style. The first predetermined position can be determined based on the screen size, the size of the first display area, the size of the second display area, or a preset interface layout. This method allows for accurate triggering of display style switching based on the position of the second display area, improving the stability of interface switching.

[0044] In one scenario, the first display style can correspond to a panel-style display style formed by the first and second display areas. For example, the second display area can cover at least a portion of the first interface, and the first display area can be displayed above the second display area to show scaled-down media content. As the second display area moves upward, the first and second display areas can gradually form an interface layout corresponding to the second display style. This approach allows for the display of more related text while maintaining the visibility of the media content, improving the continuity of content browsing.

[0045] During the second operation, the computing device can also detect a first distance the second display area has moved upwards. In response to the first distance exceeding a first threshold distance, the computing device can control the second display area to continue moving upwards a second distance, which may be greater than the first distance. For example, when the user slides the second display area upwards beyond the first threshold distance, the computing device can trigger an automatic snapping effect, causing the second display area to continue moving to a position corresponding to the second display style, without requiring the user to continuously perform a sliding operation. This reduces the need for continuous sliding operations by the user, improving the efficiency and smoothness of display style switching.

[0046] At box 206, the computing device can respond to a second operation to display the first display area in a second display style, the second operation being triggered for the second display area, and the second display style being different from the first display style. The second operation may be an upward swipe operation performed on the second display area. In one case, the first display style may be a panel display style attached to the first interface, and the second display style may be an information page display style.

[0047] In one scenario, the first and second display areas, displayed in a second display style, can constitute a second interface. Compared to the first display style, the second display style can provide different display sizes, display positions, or interactive components for the first display area, and allows users to further browse media content and its associated text within the second interface. This approach provides more ample display space and interactive functionality for the media content and its associated text.

[0048] In one scenario, the second display style may include a third control for controlling the playback of media content. For example, the third control could be a playback control used to control the automatic rotation of multiple images, video playback, or audio associated with the media content. The first display style may not display the third control, while the second display style may display the third control in or near the first display area. This allows users to conveniently control the playback of media content in the second display style.

[0049] In one scenario, the computing device can display a third control based on the playback status of media content on a first interface. The playback status indicates whether the media content is playing or paused on the first interface. The computing device can acquire this playback status when switching from a first display style to a second display style, and determine the playback mode of the media content and the display style of the third control in the second display style based on the acquired playback status. This method ensures that the playback status of the media content and the display style of the third control remain consistent before and after interface switching.

[0050] In one scenario, when the playback status of media content in the first interface indicates that the media content is in playback mode, the computing device can continue playing the media content in a second display style. In this case, the content items and audio of the media content can continue playing. For example, when the media content includes multiple images, the images can continue to rotate automatically; when the media content includes audio, the audio can continue to play. This method avoids interruptions to media content playback caused by display style switching, improving playback continuity.

[0051] When media content is playing, the computing device can display a third control in a first style. The first style of the third control can be a pause style, such as displaying a pause icon. By displaying the third control in a pause style, the user is informed that the media content is currently playing, and the user can stop playback by operating the third control. This method provides a clear indication that the media content is currently playing and makes it easy for the user to stop playback.

[0052] In one scenario, the computing device can stop playback of media content in response to a fifth operation triggered by a third control. Stopping media content playback can include stopping playback of content items and stopping audio playback. For example, the computing device can stop the automatic rotation of multiple images and stop the audio associated with those images. After stopping media content playback, the computing device can update the third control from a first style to a second style. The second style of the third control can be a playback style, such as displaying a play icon. By updating the display style of the third control, the display state of the third control can be made to correspond to the current playback state of the media content. In this way, the display style of the third control can be synchronized with the actual playback state of the media content.

[0053] In one scenario, the computing device can also display a fourth control in response to a sixth action triggered by the third control. The fourth control can be used for audio control of media content, such as turning audio on, off, or adjusting the volume. The sixth action can be triggered when the third control is displayed in the second style, or it can be used to resume media content playback. This approach enhances the flexibility of audio control for media content playback.

[0054] In one scenario, when the playback status of the media content in the first interface indicates that the media content is in playback mode, the computing device may not display the fourth control. For example, the computing device can continue playing the media content when entering the second display style and only display the third control for stopping playback, while temporarily not displaying the fourth control for controlling the audio. The fourth control can be displayed after the user further interacts with the third control, thereby reducing the number of controls initially displayed. In this way, the number of controls initially displayed in the second display style can be reduced, lowering the complexity of the interface display.

[0055] In another scenario, when the media content's playback status in the first interface indicates that the media content is paused, the computing device can continue playing the media content in the second display style. Both the content items and audio of the media content can remain paused. For example, when the media content includes multiple images, the computing device can stop the automatic rotation of multiple images and continue displaying the image currently shown when switching to the second display style. This method avoids the media content unexpectedly resuming playback after an interface switch and maintains the user's original browsing state.

[0056] When media content is paused, the computing device can display a third control in a second style. The second style of the third control can be a playback style, used to indicate to the user that the media content is currently paused. The user can resume playback by interacting with the third control displayed in the second style. This method provides a clear indication that the media content is currently paused and facilitates the user's resumption of playback.

[0057] In one scenario, when the first and second display areas are displayed in a first display style, the computing device can, in response to a third operation, redisplay the media content on the first interface. The third operation could be an operation to swipe down on the second display area. For example, a user can swipe down on the second display area to collapse it and exit the first display style. In response to this operation, the computing device can stop displaying the first and second display areas in the first display style and restore the first interface. In this way, the user can quickly collapse the display area and return to the first interface by swiping down.

[0058] In one scenario, when the first and second display areas are displayed in a second display style, the computing device can respond to a fourth operation to switch the first display area from the second display style back to the first display style. The fourth operation could be an operation involving swiping down on the second display area. Thus, the user can return from the second display style to the first display style by swiping in the opposite direction to entering the second display style. This method enables bidirectional switching between the first and second display styles, improving operational continuity.

[0059] During the downward swiping of the second display area, the computing device can detect the position of the second display area within the interface. In response to the second display area moving to a second predetermined position, the computing device can switch the first and second display areas from a second display style to a first display style. The second predetermined position can be the same as or different from the first predetermined position, thereby controlling the triggering conditions for entering the second display style and returning to the first display style, respectively. This method allows for precise control of the timing of the return from the second display style to the first display style, reducing accidental operations.

[0060] In one scenario, the first display area, displayed in a second display style, is shown in the second interface. The second interface may also include a second control, which could be a return control for returning to the first interface. The computing device can, in response to an operation on the second control, stop displaying the second interface and redisplay the media content in the first interface. The computing device can, in response to a swipe operation performed on one side of the second interface, redisplay the media content in the first interface. For example, a user can swipe right from the left edge of the screen in the second interface to exit the second interface and return to the first interface. This provides users with multiple ways to return to the first interface, improving the convenience of exiting the interface.

[0061] This method reduces the number of times users need to repeatedly enter and exit multiple pages, improving the efficiency of display transitions between media content and related text, browsing continuity, and user experience.

[0062] The above combination Figure 2 A diagram illustrating the example method used in this paper for displaying media content is shown below. Figure 3 A schematic diagram illustrating examples of media content and its associated descriptive content in the first interface. Figure 3 Example 300 in the example can be derived from Figure 1 The computing device 102 or any suitable device in the process is processed by running the application.

[0063] like Figure 3 As shown, the first interface 302 can be a content stream interface for continuously displaying media content. The media content display area in the first interface 302 can be used to display images, carousel content composed of multiple images, animated GIFs, or other media content, allowing users to browse the corresponding media content in the content stream.

[0064] The first interface 302 can also display descriptive content 304 associated with the current media content. The descriptive content 304 may include a username, title, body text, content description, comments, or other information used to introduce the media content. In some cases, where display space in the first interface 302 is limited, the descriptive content 304 may only display a portion of the complete descriptive content, such as showing the beginning of the body text while hiding the rest. The first interface 302 may also include an expand control 306. Users can click or touch the expand control 306 to trigger the display of the portion of the descriptive content 304 that is not yet displayed, thereby viewing more descriptive information associated with the current media content.

[0065] The above combination Figure 3 This diagram illustrates an example of media content and its associated descriptive content in the first interface. The following section combines... Figure 4 A schematic diagram illustrating an example of text and image display under the first display style. Figure 4 Example 400 in the example can be derived from... Figure 1 The computing device 102 or any suitable device processes the data by running the application. In response to a touch operation triggered by an expand control or title in the content flow interface, the computing device can display... Figure 4 The image and text details page 402 is shown.

[0066] When a computing device receives a touch operation triggered by a user targeting an expand control or title in the content stream interface, it can display a first display area 408 and a second display area 404 in a first display style on interface 402. The first display area 408 may be located above the second display area 404 and is used to display images, carousel content composed of multiple images, or animated GIFs. The second display area 404 may cover a portion of the interface in a panel format and is used to display text and comment information associated with the current media content. Additionally, the second display area and the first display area may form a 7x3 screen configuration.

[0067] The second display area 404 may include a text display area 406. The text display area 406 can display complete text content associated with the current image, such as a title, body text, publication date, or other descriptive information. Compared to... Figure 3 The text shown in the content flow interface is displayed in a thumbnail. Text display area 406 can provide a larger text display space so that users can view more or complete text information. Additionally, this second display area can be a pop-up panel.

[0068] Users can perform a horizontal swipe operation in the first display area 408 to switch between other images included in the displayed media content. Users can also perform a downward swipe operation on the second display area 404 to collapse the second display area 404 and return. Figure 3The content flow interface shown allows users to view images, full text, and comments without directly accessing the full details page, and they can easily return to the content flow by swiping down.

[0069] The above combination Figure 4 A schematic diagram illustrating an example of text and image display under the first display style is shown below; combined with... Figure 5 This is a schematic diagram illustrating an example of a text and image details page in the second display style. Figure 5 Example 500 in the example can be derived from Figure 1 The computing device 102 or any suitable device in the system processes the data by running an application. This is in response to user requests. Figure 4 After the second display area 504 continues to perform an upward swiping operation, the computing device can display the graphic details page 502.

[0070] like Figure 5 As shown, Figure 5 This may include a detailed image and text page (502). Users targeting... Figure 4 After the second display area 504 continues to slide upwards, the computing device can control the second display area 504 to move upwards. When the moving distance or position of the second display area 504 meets preset conditions, the computing device can trigger an automatic snapping effect, causing the second display area 504 to continue moving upwards to a position corresponding to the second display style, and displaying at least a portion including the player. Subsequently, the computing device can switch the first display area and the second display area from the first display style to the second display style, and display the graphic details page 502. The graphic details page 502 can be distinguished from the panel-style page overlaid on the content stream interface; it displays the current media content and its associated information as a page.

[0071] In the second display style, the upper part of the text and image details page 502 can continue to display the current media content, such as images, a carousel of multiple images, or animated GIFs; the second display area 504 can display the complete text associated with the media content, publication time, comment information, related recommendations, and other content. Users can continue to perform swiping operations on the text and image details page 502 to view text, comments, or other related content outside the currently visible area. The text and image details page 502 can also display author information, a follow control, a back control, a search control, and interactive controls such as likes, comments, favorites, and shares. Users can exit the page and return to the content flow interface using the back control.

[0072] The above combination Figure 5 This diagram illustrates an example of a text and image details page in the second display style. The following section combines... Figure 6 An illustration depicting an example of the complete media content in a text and image detail page. Figure 6 Example 600 in the example can be derived from... Figure 1 The computing device 102 or any suitable device in the system processes the data by running an application. This is in response to user requests. Figure 5 After performing a downward scrolling operation on the image and text details page shown, the computing device can maintain the display of image and text details page 602.

[0073] Upon receiving a user's downward swipe operation on the image and text details page, the computing device can maintain the display of the image and text details page 602 and adjust the display positions of the first display area and the second display area on the page, so that the first display area can display more complete media content. For example, the first display area can expand the visible range of the image to display a complete image, a carousel composed of multiple images, or an animated GIF, and can display controls for controlling the playback of the media content.

[0074] In this display state, the user's downward swipe is used to browse content within the image and text details page 602, and not to switch the image and text details page 602 back. Figure 4 The interface is panel-style. The computing device can continue displaying media content and related information outside the currently visible area based on the user's swiping actions on the text and image details page 602. The text and image details page 602 can also display complete text 604 associated with the media content, which may include a title, body text, content description, or other text information. Thus, the user can continuously view the complete media content and complete text while keeping the text and image details page displayed.

[0075] In another scenario, the computing device can respond to a user's downward swiping operation on media content or a second display area under the second display style, controlling the first and second display areas to move downwards. When the first or second display area moves to a predetermined position corresponding to the first display style, for example, to a position where the second display area forms a seven-screen panel, the computing device can switch the first and second display areas from the second display style back to the first display style, causing the second display area to cover the first interface as a panel. Subsequently, in response to continued downward swiping operations by the user, the computing device can control the second display area to continue moving downwards, and when it moves to another predetermined position or the moving distance reaches a predetermined threshold, the panel is closed, and media content is displayed on the first interface.

[0076] The above combination Figure 6 This diagram illustrates an example of complete media content within a text and image details page. The following section combines... Figure 7 This is a schematic diagram illustrating an example of the return operation on the image and text details page under the second display style. Figure 7 Example 700 in the example can be derived from... Figure 1 The computing device 102 or any suitable device in the process is processed by running the application.

[0077] like Figure 7 As shown, the image and text detail page 702 can display media content, complete text associated with the media content, comment information, and interactive controls such as likes, comments, favorites, and shares. The image and text detail page 702 may also include a return control 704, which may be located, for example, in the upper left corner of the image and text detail page 702.

[0078] In one scenario, the computing device can respond to a user's action triggered by the return control 704, stopping the display of the text and image details page 702 and returning to the content stream interface for continuously displaying multiple media contents. In another scenario, the computing device can respond to a user's swipe operation 706 triggered by the left edge area of ​​the text and image details page 702, exiting the text and image details page 702 and returning to the content stream interface. Thus, the user can conveniently return to the single-column display state of the media content from the text and image details page in the second display style by operating the return control 704 or performing the edge swipe operation 706.

[0079] The above combination Figure 7 This diagram illustrates an example of the return operation on a text and image details page under the second display style. The following section combines... Figure 8 This is an illustration showing an example of a text and image details page when media content is in autoplay mode. Figure 8 Example 800 in the example can be derived from Figure 1 The computing device 102 or any suitable device in the process is processed by running the application.

[0080] like Figure 8 As shown, when a user enters the image and text details page 802 from the content stream interface, the computing device can obtain the playback status of the media content in the content stream interface. If the media content was in autoplay mode before entering the image and text details page 802, the computing device can maintain this autoplay mode in the image and text details page 802, allowing the content items and audio of the media content to continue playing. For example, when the media content includes multiple images, the computing device can continue to automatically rotate through the multiple images.

[0081] The image and text details page 802 can display a playback control 80, and a playback control 804 can correspond to the third control. Since the media content is currently in autoplay mode, the playback control 804 can be displayed in a playback style, corresponding to the first style, to inform the user that the media content is playing and to allow the user to stop autoplay by operating the playback control 804. The sound state of the media content can be inherited from the sound state before entering the image and text details page 802, while the sound control used to control the sound, i.e., the fourth control, can be temporarily hidden. This allows the playback and sound states of the media content to remain continuous between the content flow interface and the image and text details page.

[0082] The above combination Figure 8 This illustration shows an example of a text and image details page when media content is in autoplay mode. The following section combines... Figure 9 This is an illustration showing an example of a text and image details page when media content switches from playback to pause. Figure 9 Example 900 in the example can be derived from... Figure 1 The computing device 102 or any suitable device processes the data by running an application. In response to a user action triggered by the playback control 804, the computing device can display a graphic and text details page corresponding to the paused state in Example 900.

[0083] like Figure 9 As shown, example 900 may include a graphic details page 902. In Figure 8 When the media content is in autoplay mode, the computing device can stop the playback of the media content in response to an operation triggered by the user on the playback control 804. For example, when the media content includes multiple images, the computing device can stop the automatic rotation of multiple images and continue displaying the image that is currently displayed when the operation is received; when the media content includes audio, the computing device can also stop the playback of the audio.

[0084] After media playback is stopped, the computing device can update the playback control to a playback control 904 displayed in a second style. Playback control 904 can be used to indicate that the media content is currently paused and to respond to subsequent user actions to resume playback. Thus, the display style of the playback control can change synchronously with the playback status of the media content, allowing the user to intuitively identify the current playback status and control the playback of the media content.

[0085] The above combination Figure 9 This diagram illustrates an example of a text and image details page when media content switches from playback to pause. The following section combines... Figure 10 This is an illustration showing an example of a text and image details page when media content resumes playback and sound controls are displayed. Figure 10 Example 1000 in the example can be derived from... Figure 1 The computing device 102 or any suitable device processes the data by running the application. In response to an operation triggered by the user on the playback control 904, the computing device can restore the image and text details page corresponding to the playback state in Example 1000.

[0086] like Figure 10 As shown, example 1000 may include a graphic details page 1002. In Figure 9When the media content is paused, the computing device can resume playback in response to a user action triggered by the playback control 904. For example, if the media content includes multiple images, the computing device can resume automatic image rotation; if the media content includes audio, the computing device can also play the audio according to the corresponding sound state.

[0087] After resuming playback of the media content, the computing device can display the sound control 1004 and update the playback control 904 to the playback control 1006 displayed in a first style. The sound control 1004 can be used to control the audio status of the media content, such as turning the audio on, off, or adjusting the volume; the playback control 1006 can be used to indicate that the media content is currently playing and to pause the media content again in response to subsequent user actions. Thus, the user can control both the playback status and the sound status of the media content after playback has resumed.

[0088] The above combination Figure 10 This diagram illustrates an example of a graphic details page when media content resumes playback and sound controls are displayed. The following section combines... Figure 11 This is an illustration showing an example of how media content can be accessed via a text and image details page when it is paused. Figure 11 Example 1100 in the example can be derived from... Figure 1 The computing device 102 or any suitable device in the process is processed by running the application.

[0089] When a user enters the image and text details page 1102 from the content stream interface, the computing device can obtain the playback status of the media content in the content stream interface. If the media content was paused before entering the image and text details page 1102, the computing device can maintain the paused state in the image and text details page 1102, turn off the automatic rotation of the media content, and maintain the display of the image that was displayed when entering the image and text details page 1102.

[0090] When media content is paused, the computing device can display playback control 1104 to indicate that the media content is not currently playing and allow the user to initiate automatic playback of the media content by operating the playback control 1104. The initial sound state of the image and text details page 1102 can be muted, and the sound control is not displayed temporarily. After the user operates the playback control 1104, the computing device can resume automatic playback of the media content and display the sound control according to the corresponding interaction rules.

[0091] The above combination Figure 11 This illustration shows an example of navigating to a text and image details page when media content is paused. Below, we combine... Figure 12 This is a diagram illustrating an example of media content resuming from a paused state to an autoplay state. Figure 12Example 1200 in the example can be derived from... Figure 1 The computing device 102 or any suitable device processes the data by running an application. In response to a user action triggered by the playback control 1104, the computing device can display the playback page corresponding to Example 1200.

[0092] like Figure 12 As shown, example 1200 may include a graphic details page 1202. In Figure 11 When the media content is paused, the computing device can initiate automatic playback of the media content in response to a user's operation triggered by the playback control 1104. For example, when the media content includes multiple images, the computing device can automatically rotate the multiple images in a predetermined order; when the media content also includes audio, the computing device can play or stop playing the audio according to the sound state before entering the image and text details page 1202.

[0093] After initiating automatic playback of the media content, the computing device can update the playback control 1104 to the playback control 1206 displayed in the first style, and display the sound control 1204. The playback control 1206 can be used to indicate that the media content is currently in playback state, and to stop automatic playback in response to subsequent user operations. The sound control 1204 can be used to indicate or control the sound state of the media content, and its initial display state can inherit the sound state before the media content entered the graphic details page 1202. Thus, the playback state of the media content, the playback control style, and the sound state can correspond to each other, maintaining the continuity of the state before and after page switching.

[0094] Figure 13 The illustration shows a schematic block diagram of a device for displaying media content according to this document. Figure 13 As shown, device 1300 can Figure 1 The device 1300 is implemented in a computing device 102, and the device 1300 includes a media content display module 1302 for displaying media content on a first interface; a first display style display module 1304 for displaying a first display area in a first display style in response to a first operation triggered for the first interface, the first display area being used to display media content, a second display area being displayed in association with the first display area, the second display area being used to display descriptive content associated with the media content; and a second display style display module 1306 for displaying the first display area in a second display style in response to a second operation triggered for the second display area, the second display style being different from the first display style.

[0095] In one scenario, the first interface also includes a first control, and the first operation is triggered on the first control.

[0096] In one scenario, where the first display area is located above the second display area, the second operation is used to slide the second display area upwards.

[0097] In one scenario, the device 1300 further includes a second display style switching module, configured to switch the first display area from a first display style to a second display style in response to the second display area moving to a first predetermined position during the upward movement of the second display area.

[0098] In one scenario, the device 1300 further includes a media content first interface display module, configured to display media content in a first interface in response to a third operation, wherein the third operation is configured to slide down a second display area.

[0099] In one scenario, the device 1300 further includes a first display style switching module, configured to switch the first display area from the second display style to the first display style in response to a fourth operation, wherein the fourth operation is configured to slide the second display area downwards.

[0100] In one scenario, where a first display area displayed in a second display style is displayed in a second interface, the device 1300 further includes a first interface return module for displaying media content in the first interface based on at least one of the following: an operation on a second control in the second interface; or a swiping operation on an area located on one side of the second interface.

[0101] In one scenario, the device 1300 further includes a sliding distance threshold triggering module, configured to, during the execution of the second operation, move the second display area upward by a second distance, wherein the second distance is greater than the first distance, in response to the first distance the second display area moves upward exceeding a first threshold distance.

[0102] In one scenario, the media content is graphic content, the first display area is used to display images, and the second display area is used to display text. The graphic content includes both images and text.

[0103] In one scenario, the second display style includes a third control used to control the playback of media content.

[0104] In one scenario, the device 1300 further includes a third control display module for displaying a third control based on the playback status of the media content in the first interface.

[0105] In one scenario, based on the playback state of the media content in the first interface, the third control display module includes: a playback state inheritance and playback control display module, used to play the media content in response to a playback state indication that the media content is in a playback state, wherein the content items and audio of the media content are played; and to display the third control in a first style.

[0106] In one scenario, the third control display module further includes: a media content playback stop module, used to stop the playback of media content in response to a fifth operation, the fifth operation being triggered for the third control, and the third control being displayed in a second style; and a fourth control display module, used to display a fourth control in response to a sixth operation, the sixth operation being triggered for the third control, and the fourth control being used for audio control of the media content.

[0107] In one scenario, based on the playback status of the media content on the first interface, the third control display module further includes a fourth control non-display module, used to not display the fourth control in response to the playback status indication that the media content is in playback state.

[0108] In one scenario, the third control display module further includes: a paused state media playback stop and control style display module, used to stop playing the media content in response to a playback state indication that the media content is in a paused state, wherein the content items and audio of the media content stop playing; and to display the third control in a second style.

[0109] Figure 14 A schematic block diagram of an example device 1400 that can be used to implement this document is shown. Figure 1 The computing device 102 can be implemented using device 1400. As shown, device 1400 includes a central processing unit (CPU) 1401, which can perform various appropriate actions and processes according to computer program instructions stored in read-only memory (ROM) 1402 or loaded from storage unit 1408 into random access memory (RAM) 1403. Various programs and data required for the operation of device 1400 can also be stored in RAM 1403. CPU 1401, ROM 1402, and RAM 1403 are interconnected via bus 1404. Input / output (I / O) interface 1405 is also connected to bus 1404.

[0110] Multiple components in device 1400 are connected to I / O interface 1405, including: input unit 1406, such as a keyboard, mouse, etc.; output unit 1407, such as various types of displays, speakers, etc.; storage unit 1408, such as a disk, optical disk, etc.; and communication unit 1409, such as a network card, modem, wireless transceiver, etc. Communication unit 1409 allows device 1400 to exchange information / data with other devices through computer networks such as the Internet and / or various telecommunications networks.

[0111] The various processes and handling described above, such as method 200, can be executed by processing unit 1401. For example, in one case, method 200 can be implemented as a computer software program tangibly contained in a machine-readable medium, such as storage unit 1408. In another case, part or all of the computer program can be loaded and / or installed on device 1400 via ROM 1402 and / or communication unit 1409. When the computer program is loaded into RAM 1403 and executed by CPU 1401, one or more actions of example method 200 described above can be performed.

[0112] This document can be a method, apparatus, system, and / or computer program product. A computer program product may include a computer-readable storage medium having computer-readable program instructions loaded thereon for performing various aspects of this document.

[0113] Computer-readable storage media can be tangible devices capable of holding and storing instructions for use by an instruction execution device. Computer-readable storage media can be, for example—but not limited to—electrical storage devices, magnetic storage devices, optical storage devices, electromagnetic storage devices, semiconductor storage devices, or any suitable combination of the foregoing. More specific examples (a non-exhaustive list) of computer-readable storage media include: portable computer disks, hard disks, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), static random access memory (SRAM), portable compact disc read-only memory (CD-ROM), digital multifunction disc (DVD), memory sticks, floppy disks, mechanical encoding devices, such as punch cards or recessed protrusions storing instructions thereon, and any suitable combination of the foregoing. The computer-readable storage media used herein are not to be construed as transient signals themselves, such as radio waves or other freely propagating electromagnetic waves, electromagnetic waves propagating through waveguides or other transmission media (e.g., light pulses through fiber optic cables), or electrical signals transmitted through wires.

[0114] The computer-readable program instructions described herein can be downloaded from computer-readable storage media to various computing / processing devices, or downloaded via a network, such as the Internet, local area network, wide area network, and / or wireless network, to an external computer or external storage device. The network may include copper transmission cables, fiber optic transmission, wireless transmission, routers, firewalls, switches, gateway computers, and / or edge servers. A network adapter card or network interface in each computing / processing device receives the computer-readable program instructions from the network and forwards them to the computer-readable storage media in the respective computing / processing device.

[0115] The computer program instructions used to perform the operations described herein may be assembly instructions, instruction set architecture (ISA) instructions, machine instructions, machine-dependent instructions, microcode, firmware instructions, state setting data, or source code or object code written in any combination of one or more programming languages, including object-oriented programming languages ​​such as Smalltalk, C++, etc., and conventional procedural programming languages ​​such as the "C" language or similar programming languages. The computer-readable program instructions may execute entirely on the user's computer, partially on the user's computer, as a software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In cases involving remote computers, the remote computer may be connected to the user's computer via any type of network—including a local area network (LAN) or a wide area network (WAN)—or may be connected to an external computer (e.g., via the Internet using an Internet service provider). In one scenario, electronic circuitry, such as programmable logic circuitry, field-programmable gate arrays (FPGAs), or programmable logic arrays (PLAs), is personalized by utilizing state information from the computer-readable program instructions. This electronic circuitry can execute the computer-readable program instructions to implement various aspects of this document.

[0116] Various aspects of this document are described herein with reference to flowchart illustrations and / or block diagrams of the methods, apparatus (systems), and computer program products thereof. It should be understood that each block of the flowchart illustrations and / or block diagrams, as well as combinations of blocks in the flowchart illustrations and / or block diagrams, can be implemented by computer-readable program instructions.

[0117] These computer-readable program instructions can be provided to a processing unit of a general-purpose computer, a special-purpose computer, or other programmable data processing apparatus to produce a machine such that, when executed by the processing unit of the computer or other programmable data processing apparatus, they create means for implementing the functions / actions specified in one or more blocks of the flowchart and / or block diagram. These computer-readable program instructions can also be stored in a computer-readable storage medium that causes a computer, programmable data processing apparatus, and / or other device to operate in a particular manner. Thus, the computer-readable medium storing the instructions comprises an article of manufacture that includes instructions for implementing aspects of the functions / actions specified in one or more blocks of the flowchart and / or block diagram.

[0118] Computer-readable program instructions may also be loaded onto a computer, other programmable data processing apparatus, or other device to cause a series of operational steps to be performed on the computer, other programmable data processing apparatus, or other device to produce a computer-implemented process, thereby causing the instructions executed on the computer, other programmable data processing apparatus, or other device to perform the functions / actions specified in one or more boxes of a flowchart and / or block diagram.

[0119] The flowcharts and block diagrams in the accompanying figures illustrate the architecture, functionality, and operation of possible implementations of the systems, methods, and computer program products according to this document. In this regard, each block in a flowchart or block diagram may represent a module, segment, or portion of an instruction containing one or more executable instructions for implementing the specified logical function. In some alternative implementations, the functions marked in the blocks may occur in a different order than those shown in the figures. For example, two consecutive blocks may actually be executed substantially in parallel, and they may sometimes be executed in reverse order, depending on the functions involved. It should also be noted that each block in the block diagrams and / or flowcharts, and combinations of blocks in the block diagrams and / or flowcharts, may be implemented using a dedicated hardware-based system that performs the specified function or action, or using a combination of dedicated hardware and computer instructions.

[0120] The above description is exemplary and not exhaustive, nor is it limited to the disclosed content. Many modifications and variations will be apparent to those skilled in the art without departing from the scope and spirit of the description. The terminology used herein is chosen to best explain the principles, practical applications, or technical improvements to technology in the market, or to enable others skilled in the art to understand the disclosure herein.

Claims

1. A method for displaying media content, comprising: The media content is displayed on the first screen. In response to a first operation, a first display area is displayed in a first display style, the first operation being triggered for the first interface, the first display area being used to display the media content, a second display area being displayed in association with the first display area, the second display area being used to display descriptive content, the descriptive content being associated with the media content; as well as In response to a second operation, the first display area is displayed in a second display style, the second operation being triggered for the second display area, the second display style being different from the first display style.

2. The method according to claim 1, wherein the first interface further includes a first control, and the first operation is triggered on the first control.

3. The method according to claim 1, wherein the first display area is located above the second display area, and the second operation is used to slide the second display area upward.

4. The method according to claim 3, further comprising: During the upward movement of the second display area, in response to the second display area moving to a first predetermined position, the first display area is switched from the first display style to the second display style.

5. The method according to claim 3, further comprising: In response to a third operation, the media content is displayed on the first interface, the third operation being used to slide the second display area downwards.

6. The method according to claim 1, further comprising: In response to a fourth operation, the first display area is switched from the second display style to the first display style, the fourth operation being used to slide the second display area downwards.

7. The method according to claim 6, wherein switching the first display area from the second display style to the first display style comprises: During the downward sliding of the second display area, in response to the second display area moving to a second predetermined position, the first display area is switched from the second display style to the first display style.

8. The method of claim 1, wherein the first display area displayed in a second display style is displayed in the second interface, and the method further comprises: The media content is displayed on the first interface based on at least one of the following: Operations on the second control in the second interface; or A sliding operation performed on the area located on one side of the second interface.

9. The method of claim 1, further comprising: During the execution of the second operation, in response to the second display area moving upward by a first distance exceeding a first threshold distance, the second display area is moved upward by a second distance, the second distance being greater than the first distance.

10. The method according to claim 1, wherein: The media content is graphic content, the first display area is used to display images, the second display area is used to display text, and the graphic content includes the images and text.

11. The method of claim 1, wherein the second display style includes a third control for controlling the playback of the media content.

12. The method of claim 11, further comprising: The third control is displayed based on the playback status of the media content on the first interface.

13. The method of claim 12, wherein displaying the third control based on the playback status of the media content in the first interface comprises: In response to the playback status indication that the media content is in playback state, Play the media content, wherein the content items and audio of the media content are played; as well as The third control is displayed in the first style.

14. The method of claim 13, further comprising: In response to a fifth operation, playback of the media content is stopped, the fifth operation being triggered by the third control, and the third control being displayed in a second style; and In response to the sixth operation, a fourth control is displayed, the sixth operation being triggered by the third control, the fourth control being used for audio control of the media content.

15. The method of claim 14, wherein displaying the third control based on the playback status of the media content in the first interface further comprises: In response to the playback status indicating that the media content is in playback state, the fourth control is not displayed.

16. The method of claim 12, wherein displaying the third control based on the playback status of the media content in the first interface comprises: In response to the playback status indicating that the media content is paused, Stop playing the media content, wherein the content items and audio of the media content stop playing; as well as The third control is displayed in the second style.

17. An apparatus for displaying media content, comprising: The media content display module is used to display media content on the first interface. A first display style display module is configured to display a first display area in a first display style in response to a first operation, wherein the first operation is triggered for the first interface, the first display area is used to display the media content, and a second display area is displayed in association with the first display area, wherein the second display area is used to display descriptive content, and the descriptive content is associated with the media content; as well as The second display style display module is used to display the first display area in a second display style in response to a second operation. The second operation is triggered for the second display area, and the second display style is different from the first display style.

18. An electronic device comprising: At least one processor; as well as A memory for storing at least one program, which, when executed by the at least one processor, causes the at least one processor to implement the method according to any one of claims 1-16.

19. A computer-readable storage medium having a computer program stored thereon, the computer program implementing the method according to any one of claims 1-16 when executed by a processor.

20. A computer program product comprising a computer program that, when executed by a processor, implements the method according to any one of claims 1-16.

Images