Content display method, apparatus, device, storage medium, and program

Abstract

Embodiments of the present disclosure disclose a content display method, apparatus, device, and storage medium, relating to the field of computer technology. This method includes displaying a floating control on a target page, displaying a media stream on the floating control, determining a touch position in response to detecting that the user touches the floating control, detecting a current gesture operation starting from the touch position, determining a current operation type of the detected current gesture operation based on a target area where the touch position is located in the floating control, and performing corresponding control on the floating control based on the current operation type and the current gesture operation. Here, different operation types correspond to different areas in the floating control.

Description

Technical Field

[0001] This application claims the priority of a Chinese patent application with the application number 202210999813.0, which was filed with the China National Intellectual Property Administration on August 19, 2022, and all the contents of this application are incorporated into this application by reference.

[0002] Embodiments of the present disclosure relate to the field of computer technology, for example, to a content display method, device, equipment, and storage medium.

Background Art

[0003] With the rapid development of Internet technology and terminal technology, the content that can be displayed in applications is becoming increasingly rich.

[0004] Currently, many applications display floating controls such as floating windows on the application page, display different contents on the application page and the floating window respectively, and users can view different contents simultaneously. However, in order to improve the user experience, it is necessary to optimize the content display solution based on the floating window.

Summary of the Invention

[0005] Embodiments of the present disclosure provide a content display method, device, storage medium, and equipment that can optimize the content display solution based on the floating control of the related technology.

[0006] In a first aspect, an embodiment of the present disclosure provides a content display method. This content display method includes displaying a floating control on a target page, displaying a media stream on the floating control, determining a touch position in response to detecting that a user has touched the floating control, detecting a current gesture operation starting from the touch position, determining a current operation type of the detected current gesture operation based on a target area where the touch position is located in the floating control, and performing corresponding control on the floating control based on the current operation type and the current gesture operation. Here, different operation types correspond to different areas in the floating control.

[0007] In a second aspect, an embodiment of the present disclosure further provides a content display device. This content display device includes a floating control display module, a gesture operation detection module, and a floating control control module. The floating control display module is configured to display a floating control on a target page and display a media stream on the floating control. The gesture operation detection module is configured to determine a touch position and detect a current gesture operation starting from the touch position in response to detecting that a user has touched the floating control. The floating control control module is configured to determine a current operation type of the detected current gesture operation based on a target area where the touch position is located in the floating control, and perform corresponding control on the floating control based on the current operation type and the current gesture operation. Here, different operation types correspond to different areas in the floating control.

[0008] In a third aspect, embodiments of the present disclosure further provide an electronic device. The electronic device includes at least one processor and a storage device. The storage device is configured to store at least one program. When the at least one program is executed by the at least one processor, the at least one processor is caused to implement the content display method according to the embodiments of the present disclosure.

[0009] In a fourth aspect, embodiments of the present disclosure further provide a storage medium including computer-executable instructions. When the computer-executable instructions are executed by a computer processor, the content display method according to the embodiments of the present disclosure is executed.

Brief Description of the Drawings

[0010]

Figure 1

Figure 2

Figure 3

Figure 4

Figure 5

Figure 6

Figure 7

Modes for Carrying Out the Invention

[0011] As used herein, the term "comprising" and its variations are of the open type, i.e., they mean "including but not limited to". The term "based on" means "at least partially based on". The term "one embodiment" refers to "at least one embodiment", the term "another embodiment" refers to "at least one another embodiment", and the term "some embodiments" refers to "at least some embodiments". Related definitions of other terms will be described later.

[0012] Concepts such as "first", "second", etc. referred to in the present disclosure are only for distinguishing different devices, modules or units, and do not limit the order or interdependence of the functions performed by these devices, modules or units.

[0013] The modifications of "one" and "a plurality" referred to in the present disclosure are illustrative rather than limiting, and those skilled in the art should understand them as "at least one" unless otherwise specified in the context.

[0014] The names of messages or information exchanged between multiple devices in the embodiments of the present disclosure are used only for the purpose of description and do not limit the scope of these messages or information.

[0015] It should be understood that before using the technical solutions disclosed in the embodiments of the present disclosure, the user should be notified in an appropriate manner of the types, usage scopes, usage scenarios, etc. of the personal information related to the present disclosure based on relevant laws and obtain the user's approval.

[0016] For example, in response to receiving a spontaneous request from the user, by sending presentation information to the user, it is clearly presented to the user that the operation the user intends to perform needs to obtain and utilize the user's personal information. Thereby, the user can autonomously select whether to provide personal information to software or hardware such as an electronic device, an application, a server, or a storage medium that executes the operation of the technical solution of the present disclosure based on the presentation information.

[0017] Although it is optional, as a non-limiting implementation method, the method of sending presentation information to the user in response to receiving a spontaneous request from the user may be, for example, in the form of a pop-up window. The presentation information in the pop-up window may be presented in text. Further, the pop-up window may be further equipped with a selection control that allows the user to select "permit" or "not permit" to provide personal information to the electronic device.

[0018] The above notification and user permission acquisition process is merely exemplary and does not limit the implementation methods of the present disclosure. Other methods that comply with relevant laws may be applied to the embodiments of the present disclosure.

[0019] It can be understood that the data related to the present technical solution (including but not limited to the data itself, the acquisition or use of the data) should comply with the corresponding laws and related requirements.

[0020] FIG. 1 is a flowchart of a content display method according to an embodiment of the present disclosure. The embodiments of the present disclosure are applicable to the case of content display. The method may be executed by a content display device, and the device may be implemented in at least one form of software and hardware, and optionally, may be implemented by an electronic device. The electronic device may be a portable terminal such as a mobile phone, a smart watch, a tablet computer, and a personal digital assistant, or may be a device such as a personal computer (PC) or a server.

[0021] As shown in FIG. 1, the method includes the following steps.

[0022] In step 101, a floating control is displayed on the target page, and a media stream is displayed on the floating control.

[0023] In an embodiment of the present disclosure, the target page may be a page in a predetermined application, and the type of the predetermined application is not limited. For example, it may be a video application, a live streaming application, a shopping application, or an information application, etc., or it may be other types of applications. The target page may be any page in the predetermined application, and the page type and the page content included are not limited. For example, it may be a message interaction page, a media content display page, a product detail page, or an information display page, etc.

[0024] Exemplarily, the floating control can be understood as a view element, and displaying the floating control on the target page can be understood as overlaying and displaying the view element on the target page. Here, the attributes of the floating control, such as shape, size, color, transparency, and display position, etc., may be set according to actual needs. For example, the floating control may be a control in the form of a floating box.

[0025] In an embodiment of the present disclosure, a media stream is displayed on the floating control, and the media content included in the media stream may include an image, a character, an audio, or a video, etc. The media stream displayed on the floating control may be a media stream pushed to the current user. For example, a corresponding media stream determination method is generated according to the current user, and according to the media stream determination method, a personalized media stream of the current user is determined. The embodiment of the present disclosure may also be applied to a content sharing scenario, that is, the current user can share a media stream with at least one other user, and the media stream displayed on the floating control may be a shared media stream.

[0026] FIG. 2 is a schematic diagram of a screen according to an embodiment of the present disclosure. As shown in FIG. 2, a floating control 202 is displayed on a target page 201. Optionally, the floating control 202 is located at the upper left corner of the target page 201. A media stream is displayed on the floating control 202.

[0027] In step 102, in response to detecting that the user has touched the floating control, determine a touch position, and detect a current gesture operation starting from the touch position.

[0028] Exemplarily, the user can touch the screen (touch screen) of the electronic device with a body part such as a finger or an object such as a touch pen (hereinafter collectively referred to as a touch object). For example, the user can touch a floating box displayed on the target page. When the user touches the floating control displayed on the touch screen with the touch object, the touch screen detects the touch position of the touch object, and subsequently, the touch screen can detect a gesture operation starting from the touch position. The gesture operation may be, for example, a slide, a long press, or a drag.

[0029] In step 103, based on the touch position and a target area where the floating control is located, determine a current operation type of the detected current gesture operation, and perform corresponding control on the floating control based on the current operation type and the current gesture operation. Here, different operation types correspond to different areas in the floating control.

[0030] Exemplarily, the floating control may be divided into at least two areas. Exemplary division methods are not limited to two areas, upper and lower, two areas, left and right, or a central area and a surrounding area. As shown in FIG. 2, the floating control 202 is divided into two areas, left and right, which are a first area 203 and a second area 204, respectively.

[0031] Note that different regions correspond to different operation types of the same gesture operation, and different operation types are arranged to control the floating control in different ways. Exemplarily, the operation type may include at least one of moving the floating control (denoted as the first operation type), switching the media content currently displayed on the floating control (denoted as the second operation type), and adjusting the floating box size (denoted as the third operation type). Moving the floating control can be understood as adjusting the display position of the floating control on the target page, switching the media content currently displayed on the floating control can be understood as exchanging the media content currently displayed on the floating control with other media content in the media stream (for example, the previous media content or the next media content), and adjusting the floating box size can be understood as adjusting the width, height, aspect ratio, etc. of the floating box.

[0032] For example, as shown in FIG. 2, the first region 203 corresponds to the first operation type, and the second region 204 corresponds to the second operation type.

[0033] Exemplarily, when the current gesture operation is detected, the current operation type of the current gesture operation is determined based on the region (referred to as the target region) where the touch position falls, and further, corresponding control can be performed on the floating control based on the current operation type and the current gesture operation.

[0034] As shown in FIG. 2, since the touch position where the user's finger touches the floating control enters the first region 203, the target region becomes the first region 203, and the corresponding operation type is the first operation type. Therefore, the floating control is controlled to move based on the current gesture operation. Assume that the touch position where the user's finger touches the touch control enters the second region 204. Then the target region becomes the second region 204, and the corresponding operation type is the second operation type. Therefore, based on the current gesture operation, the media content currently displayed on the floating control is switched.

[0035] The content display method according to the embodiments of the present disclosure displays a floating control on the target page, displays a media stream on the floating control, determines the touch position when it detects that the user touches the floating control, detects the current gesture operation starting from the touch position, determines the current operation type of the detected current gesture operation based on the target region where the touch position is located on the floating control, and performs corresponding control on the floating control based on the current operation type and the current gesture operation. Here, different operation types correspond to different regions on the floating control. By adopting the above technical solution, the operation type of the user's gesture operation can be accurately identified, and different controls can be performed on the floating control for displaying the media stream based on different operation types, making the control of the floating control more flexible, making the display of media content more flexible, meeting the diversified media content viewing needs of users, and improving the user experience.

[0036] In some embodiments, the current operation type is the first operation type. Based on the current operation type and the current gesture operation, performing corresponding control on the floating control includes moving the floating control to a corresponding display position on the target page based on at least one of the first operation type, the acting direction of the current gesture operation, and the acting distance and acting speed of the current gesture operation. This has the advantage that the movement of the floating control can be accurately controlled.

[0037] Exemplarily, the current gesture operation may be, for example, a slide operation. Here, the acting direction may be the slide direction, corresponding to the moving direction of the floating control, and the two may be in the same direction; the acting distance may be the slide distance, corresponding to the moving distance of the floating control, and the two may be equal or have a positive correlation; the acting speed may be the slide speed, corresponding to the moving speed of the floating control, and the two may be equal or have a positive correlation.

[0038] In some embodiments, the target page includes a predetermined page. The method further includes detecting that the background playback mode has been triggered on the target page, displaying the first media content currently displayed on the floating control as the background of the target page, and canceling the display of the floating control. This has the advantage that the display mode of the media content can be flexibly switched, enabling the user to view the page content of the predetermined page and the media content in the media stream in different ways.

[0039] Exemplarily, the background playback mode can be understood as a mode in which media content in the floating control is played as the background of a predetermined page. The predetermined page may include a page in which the display area ratio of the page content to the entire display area of the page is smaller than a predetermined ratio threshold, and the area other than the page content may display background content. The predetermined page may include, for example, a message interaction page (such as a chat page or a message list page, etc.), and may further include a page such as a personal homepage.

[0040] In some embodiments, the target page includes a message interaction page, and displaying the first media content currently displayed in the floating control as the background of the target page includes replacing the background of the target page with the first media content currently displayed in the floating control and displaying the page content of the message interaction page on the upper layer of the first media content. Here, the page content includes at least one of message content and related content of the message content.

[0041] Exemplarily, taking the message interaction page as an example, the page content may include message content and related content of the message content, and the related content may be, for example, an object identifier for the message interaction object (such as a username or a user avatar, etc.). In this way, the user can view media content in full screen (when the target page is in the full screen display state) while sending and receiving messages, and can achieve both the message interaction experience and the media content viewing experience.

[0042] In some embodiments, detecting that the background playback mode has been triggered on the target page includes determining that the background playback mode has been triggered when a predetermined gesture operation is received on the target page, where the predetermined gesture operation is configured to trigger the background playback mode. This has the advantage that the background playback mode can be triggered by inputting a predetermined gesture operation. Here, the predetermined gesture operation may be, for example, a pinch-out operation acting on a floating control, i.e., two fingers touch the floating control and move in opposite directions.

[0043] In some embodiments, the operation type includes a first operation type, the first operation type being to move the floating control. The current operation type is the first operation type. Based on the current operation type and the current gesture operation, performing corresponding control on the floating control includes moving the floating control to a corresponding display position on the target page based on the first operation type and the current gesture operation. Here, detecting that the background playback mode has been triggered on the target page includes detecting that the user's touch on the screen has stopped, determining whether the current display position of the floating control is the target display position, and determining that the background playback mode has been triggered in response to the current display position of the floating control being the target display position. This has the advantage that the first operation type can be multiplexed, facilitating the realization of triggering the background playback mode during the process of moving the floating box.

[0044] Exemplarily, the target display position may be set according to actual needs. For example, the target display position includes positions within a predetermined range on the target page. Optionally, the predetermined range includes the center point of the target page. Optionally, at least one boundary of the predetermined range overlaps with the boundary of the target page.

[0045] In some embodiments, determining whether the current display position of the floating control is the target display position, and if the current display position of the floating control is the target display position, determining that it is detected that the background playback mode has been triggered, includes determining whether the current display position of the floating control is the target display position, and if the current display position of the floating control is the target display position, then determining whether the length of time that the current display position continues to be held at the target display position is greater than a predetermined time length threshold, and if it is greater than the predetermined time length threshold, determining that it is detected that the background playback mode has been triggered. Thereby, the movement operation of the floating control by the user can be made smoother, and when there is no need to display media content in the background, there is no need to avoid a predetermined range where the target display position is located, and the advantage is that misoperations can be prevented.

[0046] In some embodiments, displaying the first media content currently displayed on the floating control as the background of the target page, and after canceling the display of the floating control, if it is detected that the playback of the current media content has been completed, automatically switching to displaying the next media content in the media stream or automatically repeating the playback of the current media content. Thereby, the advantage is that the active operation of the user can be reduced and continuous playback or loop playback can be automatically performed, and the automatic playback method is autonomously set by the user in advance.

[0047] In some embodiments, the first media content currently displayed in the floating control is displayed as the background of the target page. After canceling the display of the floating control, in response to a first predetermined operation by the user on the target page, it switches to a non-display playback mode and displays the first media content. Here, in the non-display playback mode, the page content displayed on the upper layer of the background on the target page in the background playback mode is made non-display. Thereby, by making the page content non-display, there is an advantage that it can be quickly switched to display the media content in full screen and a purer media content viewing experience can be obtained.

[0048] Exemplarily, taking a message interaction page as an example, the page content to be made non-display may include the above-mentioned message content and related content of the message content, etc. Thereby, the user can obtain a purer media content viewing page. Here, the first predetermined operation may be a trigger operation on a predetermined non-display button or a slide operation. The direction of the slide operation generally differs from the direction of the slide operation for viewing message content. For example, the up and down slide operations may be set for viewing message content, and the left or right slide operation may be set for making the page content non-display. Optionally, when the non-display of the page content is triggered by a slide operation, a dynamic effect during the non-display process of the page content can be set. For example, the page content moves to a predetermined page following the slide operation and gradually disappears from the predetermined page to achieve a non-display effect.

[0049] In some embodiments, after switching to the non-display playback mode and displaying the first media content, further in response to a second predetermined operation by the user on the target page, switching the media content currently displayed on the target page is included. Thereby, in the process of displaying media content in the non-display playback mode, the user is allowed to switch the media content by inputting a second predetermined operation, which has the advantage of improving the viewing experience. Here, the second predetermined operation may be, for example, a slide operation such as a up-slide or a down-slide.

[0050] Optionally, after switching to the non-display playback mode and displaying the first media content, further in response to a third predetermined operation by the user on the target page, switching to the background playback mode is included. Thereby, the display of page content can be conveniently switched, such as resuming the display of chat content. Here, the third predetermined operation may be a trigger operation on a predetermined display button, or a slide operation. The direction of the slide operation may be opposite to the direction of the first predetermined operation. For example, if the first predetermined operation is a right-slide, the third predetermined operation may be a left-slide.

[0051] In some embodiments, after switching to the non-display playback mode and displaying the first media content, further including displaying a predetermined control on the target page. Here, the predetermined control is installed to perform at least one of controlling the media content displayed on the target page, interacting with the media content displayed on the target page, and triggering the display of the floating control to switch to displaying the media content displayed on the target page on the floating control.

[0052] Optionally, the number of predetermined controls may be at least one, and the display methods of different predetermined controls may be different. For example, the first predetermined control may be automatically displayed after the page content is hidden, and the second predetermined control may be displayed in response to a user's trigger operation on the target page (such as clicking on the target page). Exemplarily, controlling media content may include switching the media content, pausing the playback of the media content, muting the audio of the media content, etc. Interacting with the media content displayed on the target page may include "liking" input operation, favorite input operation, transfer input operation, or input of comment content, etc.

[0053] In some embodiments, the current operation type is the second operation type. Based on the current operation type and the current gesture operation, performing corresponding control on the floating control includes switching the second media content currently displayed on the floating control to a third media content based on the action direction of the second operation type and the current gesture operation, where the third media content is the previous media content or the next media content of the second media content in the media stream. Thereby, without switching to the full-screen mode and without displaying controls on the floating control, the media content to be switched can be quickly determined based on the action direction of the gesture operation, which has the advantage of improving the efficiency of content switching. Optionally, the second media content may be the same as or different from the first media content.

[0054] FIG. 3 is a flowchart of a content display method according to an embodiment of the present disclosure. The embodiments of the present disclosure are optimized based on multiple selectable options in the above embodiments. Exemplarily, the method includes the following steps.

[0055] In step 301, a floating control is displayed on the target page, and a media stream is displayed on the floating control.

[0056] FIG. 4 is a schematic diagram of a screen interaction according to an embodiment of the present disclosure. As shown in FIG. 4, a floating control 402 is displayed on a target page 401. The target page 401 may be, for example, a message interaction page. A video stream may be displayed on the floating control 402. Related controls for triggering message input may be displayed at the bottom of the target page 401, such as a microphone control, an input box control, and an expression control in the figure. Note that the video stream may include video works publicly released by different users.

[0057] In step 302, when it is detected that the user touches the floating control, the touch position is determined, and a gesture operation starting from the touch position is detected.

[0058] As shown in FIG. 4, the user can touch the screen with a finger. When the user's finger touches the floating control 402, the touch position of the finger is determined, and a gesture operation starting from the touch position is detected. The gesture operation may be, for example, a slide operation.

[0059] In step 303, based on the target area where the touch position is located in the floating control, the current operation type of the detected current gesture operation is determined.

[0060] Exemplarily, as shown in FIG. 4, the floating control 402 may be divided into two regions, namely a first region 403 and a second region (which may be a region other than the first region 403 in the floating control 402), and an area identifier may be displayed within the first region 403 like the horizontal line in FIG. 4 so that the user can visually quickly know the position of the first region. Here, the first region 403 corresponds to a first operation type, the second region corresponds to a second operation type, the first operation type is to move the floating control, and the second operation type is to switch the media content currently displayed on the floating control. If the touch position is within the first region 403, it is determined that the detected current gesture operation is of the first operation type.

[0061] In step 304, it is determined whether the current operation type is the first operation type. If the current operation type is the first operation type, step 305 is executed. If the current operation type is not the first operation type, step 310 is executed.

[0062] In step 305, based on at least one of the first operation type, the acting direction of the current gesture operation, the acting distance and the acting speed of the current gesture operation, the floating control is moved to the corresponding display position on the target page.

[0063] Exemplarily, when it is determined that the current operation type is the first operation type, it can be considered that the current user intends to move the floating control, and based on the acting direction of the current gesture operation, and the acting distance and the acting speed of the current gesture operation, etc., the floating control is dynamically moved to the corresponding display position on the target page following the current gesture operation.

[0064] In step 306, when it is detected that the touch on the user's screen has stopped, it is determined whether the current display position of the floating control is the target display position. If the current display position of the floating control is the target display position, step 307 is executed. If the current display position of the floating control is not the target display position, the process ends.

[0065] Exemplarily, in the process of moving the floating control to the corresponding display position on the target page, that is, before the touch on the user's screen stops, it may be determined in real time whether the current display position of the floating control is the target display position. If the current display position of the floating control is the target display position, presentation information may be displayed. The presentation information is set to present that when the user currently releases the hand, the media content in the floating control can be played in the background. As shown in FIG. 4, when the user moves the floating control to the center of the target page, it is considered that the current display position is the target display position, and presentation information "Play in the background when you release your hand" 404 can be displayed on the floating control.

[0066] In step 307, when it is determined that the background playback mode has been triggered, the first media content currently displayed on the floating control is displayed as the background of the target page, and the display of the floating control is cancelled.

[0067] Exemplarily, when the user releases the finger, if the current display position of the floating control is the target display position, the media content in the floating control can continue to be displayed in the background of the target page.

[0068] As shown in FIG. 4, before the user releases their hand, a landscape video (first media content) is played within the floating control. After the user releases their hand, the landscape video can continue to be played in the background of the target page, and the floating control disappears.

[0069] In step 308, in response to a first predetermined operation by the user on the target page, it switches to the hidden state playback mode, displays the first media content, hides the page content that is displayed in the upper layer of the background in the background playback mode, and displays a predetermined control on the target page.

[0070] Exemplarily, the first predetermined operation may be a slide operation. On the target page, the user can browse message content by swiping up and down, and the first predetermined operation may also be a left - right slide. As shown in FIG. 4, the user inputs a right - swipe operation, the message content and page content such as related controls for triggering message input are hidden, the playback of the landscape video continues on the target page, a predetermined control can be displayed on the target page, the predetermined control includes at least one interaction control such as the four interaction controls 405 in the figure, and the predetermined control may further include a floating control switching control such as the switch button 406 in the figure.

[0071] In step 309, in response to a second predetermined operation by the user on the target page, the media content currently displayed on the target page is switched.

[0072] Exemplarily, after the page content is hidden, the user can switch the media content on the target page. As shown in FIG. 4, the user inputs an up - swipe operation and can switch the landscape video to a joker video by switching the video content.

[0073] Optionally, as shown in FIG. 4, the user can trigger the display of the floating box by triggering the switching button 406, and switch the joker video currently displayed on the target page to the floating control and continue playing it.

[0074] In step 310, based on the second operation type and the acting direction of the current gesture operation, switch the second media content currently displayed on the floating control to the third media content.

[0075] Note that the third media content is the media content before or after the second media content in the media stream.

[0076] Exemplarily, if the touch position determined when the user's finger touches the screen enters the second area, the corresponding operation type becomes the second operation type, and it is considered that the user is currently trying to switch the media content within the floating control. FIG. 5 is a schematic diagram of another screen interaction according to an embodiment of the present disclosure. As shown in FIG. 5, the user inputs a downward slide operation, and can switch the landscape video (the second media content) currently displayed on the floating control to a person video (the third media content). By inputting an upward slide operation or a downward slide operation to the floating control, the switching of media content can be conveniently realized.

[0077] According to the content display method according to an embodiment of the present disclosure, by displaying a floating control for displaying media content on a message interaction page, it is possible to realize viewing media content while chatting, accurately identify the operation type of the user's gesture operation, and move the floating control for displaying a media stream or switch the media content according to different operation types, making the control of the floating control more flexible. In the process of moving the floating control, the media content can be switched to the page background and continue to play, and the function of hiding the page content on the target page can be provided. As a result, the user can easily switch to viewing the media content in full screen. In the full-screen playback process, by providing various predetermined controls, it is easy for the user to perform control or interaction based on the media content. By switching back to playback with the floating control, the display of the media content is made more flexible, satisfying the diversified media content viewing needs of the user and improving the user experience.

[0078] In some embodiments, displaying the first media content currently displayed on the floating control as the background of the target page and canceling the display of the floating control includes unbinding the canvas switching component from the floating control, binding the canvas switching component to the background view of the target page, obtaining related information of the first media content from a predetermined database, and continuing to display the first media content based on the canvas switching component in the background view based on the related information, and canceling the display of the floating control, where the canvas switching component includes a plurality of canvases, a media player is arranged on the canvas, the media player is installed to play the first media content currently displayed on the floating control, and the related information includes at least one of a media identifier, a playback progress, and a playback state. This has the advantage of ensuring smooth switching of the display of media content.

[0079] Exemplarily, the canvas switching component is also called a page switching component or a view switching component (ViewPager). The canvas switching component includes a plurality of canvases. The canvas is also called a view holder, and each canvas may be set to cache one piece of media content. Here, the canvas switching component can batch retrieve a plurality of media contents from the server. The number of media contents retrieved at one time may match the number of canvases in the canvas switching component. For example, if five videos are retrieved at one time, it may have five canvases. A media player is arranged on the canvas. The media player is set to play the media content currently displayed in the floating control. Each canvas may independently have a media player arranged, or a plurality of canvases may share one media player, which is not limited here.

[0080] In an embodiment of the present disclosure, both the floating control and the background view can be regarded as containers of the canvas switching component. When it is necessary to display the first media content currently displayed on the floating control as the background of the target page, the canvas switching component can be removed from the floating control (for example, the remove view function can be called) and placed into the background view. The removal process can be regarded as unbinding (for example, the addview function can be called), and the placement process can be regarded as binding. In order to ensure the continuity of the playback of the media content before and after the container exchange, during the process of displaying the media content on the floating control, at least one of the related information of the media content currently displayed in the predetermined database in real time, such as the media identifier (set to indicate the identity of the media content, and its format is not limited), the playback progress, and the playback state (which may include being in playback and paused playback, etc.) is saved. After the canvas switching component is bound to the background view, the latest related information is obtained from the predetermined database, and based on the obtained related information, the media content can be continuously displayed by the canvas switching component in the background view. Optionally, after the canvas switching component is bound to the background view of the target page, the predetermined parameters of the media player may be rearranged to match the background view. The predetermined parameters may include, for example, the size of the media player.

[0081] In some embodiments, a canvas switching component is bound to the floating control, a plurality of canvases are included in the canvas switching component, a media player is arranged on the canvas, and the media player is installed to play media content loaded on the corresponding canvas, so as to realize displaying media content on the floating control. Here, based on the second operation type and the acting direction of the current gesture operation, switching the second media content currently displayed on the floating control to a third media content includes transmitting the current gesture operation to the canvas switching component based on the second operation type, so that the canvas switching component can determine a second content identifier of the third media content to be switched based on the acting direction of the current gesture operation and a first content identifier of the second media content currently displayed on the floating control; and broadcasting the second content identifier to a plurality of canvases by the canvas switching component, so that the media player corresponding to the canvas matching the second content identifier plays the second media content. This has the advantage that the switching of media content within the floating control can be accurately realized.

[0082] Exemplarily, in the canvas switching component, the media content loaded on multiple canvases can be numbered and recorded as a content identifier. After detecting a gesture operation of the second operation type, based on the acting direction and the first content identifier, a second content identifier is determined. By applying the observer mode of the EventBus (which can be understood as a type of broadcast mechanism) and matching the content identifier of the video cached by itself with the second content identifier, all canvases in the canvas switching component are notified to determine whether it should be processed by itself. For the canvas that has successfully matched, operations such as loading and rendering the corresponding media content are performed and played by the media player.

[0083] FIG. 6 is a schematic configuration diagram of a content display device according to an embodiment of the present disclosure. As shown in FIG. 6, the device includes a floating control display module 601, a gesture operation detection module 602, and a floating control control module 603.

[0084] The floating control display module 601 is installed to display a floating control on the target page and display a media stream on the floating control.

[0085] The gesture operation detection module 602 is installed to determine the touch position in response to detecting that the user has touched the floating control, and detect the current gesture operation starting from the touch position.

[0086] The floating control module 603 determines the current operation type of the detected current gesture operation based on the target area where the touch position is located in the floating control, and is installed to perform corresponding control on the floating control based on the current operation type and the current gesture operation. Here, different operation types correspond to different areas in the floating control.

[0087] The content display device according to an embodiment of the present disclosure displays a floating control on a target page, displays a media stream on the floating control, determines a touch position when detecting that the user touches the floating control, detects a current gesture operation starting from the touch position, determines the current operation type of the detected current gesture operation based on the target area where the touch position is located in the floating control, and performs corresponding control on the floating control based on the current operation type and the current gesture operation. Here, different operation types correspond to different areas in the floating control. By adopting the above technical solution, the operation type of the user's gesture operation is accurately identified, and different controls are performed on the floating control for displaying the media stream based on different operation types, so as to make the control of the floating control more flexible, make the display of media content more flexible, meet the diversified media content viewing needs of the user, and improve the user experience.

[0088] Optionally, the operation type includes at least one of a first operation type and a second operation type. The first operation type is to move the floating control, and the second operation type is to switch the media content currently displayed on the floating control.

[0089] Optionally, when the floating control control module performs corresponding control on the floating control based on the current operation type and the current gesture operation in response to the current operation type being the first operation type, it is installed to move the floating control to the corresponding display position on the target page based on at least one of the first operation type, the acting direction of the current gesture operation, and the acting distance and acting speed of the current gesture operation.

[0090] Optionally, the target page includes a predetermined page, and the device further includes a background playback mode trigger module. When the background playback mode trigger module detects that the background playback mode has been triggered on the target page, it is installed to display the first media content currently displayed on the floating control as the background of the target page and cancel the display of the floating control.

[0091] Optionally, detecting that the background playback mode has been triggered on the target page includes determining that the background playback mode has been triggered when a predetermined gesture operation is received on the target page, where the predetermined gesture operation is installed to trigger the background playback mode.

[0092] Optionally, the operation type includes a first operation type, and the first operation type is to move the floating control. When the floating control control module performs corresponding control on the floating control based on the current operation type and the current gesture operation in response to the current operation type being the first operation type, it is installed to move the floating control to the corresponding display position on the target page based on the first operation type and the current gesture operation.

[0093] Here, detecting that the background playback mode has been triggered on the target page means that when it is detected that the touch on the user's screen has stopped, it is determined whether the current display position of the floating control is the target display position, and according to the fact that the current display position of the floating control is the target display position, it is determined that it has been detected that the background playback mode has been triggered.

[0094] Optionally, the target display position includes positions within a predetermined range on the target page, and the predetermined range includes the center point of the target page.

[0095] Optionally, the target page includes a message interaction page, and displaying the first media content currently displayed on the floating control as the background of the target page includes replacing the background of the target page with the first media content currently displayed on the floating control so that the page content of the message interaction page is displayed on the upper layer of the first media content, where the page content includes at least one of message content and related content of the message content.

[0096] Optionally, the device further includes a hidden state playback mode switching module, which is configured to switch to the hidden state playback mode in response to a first predetermined operation by the user on the target page and display the first media content. Here, in the hidden state playback mode, the page content displayed on the upper layer of the background in the background playback mode is hidden.

[0097] Optionally, the device further includes a content switching module. After switching to the non-display playback mode to display the first media content, the content switching module is configured to switch the media content currently displayed on the target page in response to a second predetermined operation by the user on the target page.

[0098] Optionally, the device further includes a predetermined control display module. After switching to the non-display playback mode and displaying the first media content, the predetermined control display module is configured to display a predetermined control on the target page. The predetermined control is configured to perform at least one of the following: controlling the media content displayed on the target page, interacting with the media content displayed on the target page, and triggering the display of the floating control to switch the media content displayed on the target page to be displayed on the floating control.

[0099] Optionally, the background display module displays, as the background of the target page, the first media content currently displayed on the floating control, and when canceling the display of the floating control, unbinds the canvas switching component from the floating control and binds the canvas switching component to the background view of the target page, obtains related information of the first media content from a predetermined database, and based on the related information, continues to display the first media content based on the canvas switching component in the background view and cancels the display of the floating control, where the canvas switching component includes a plurality of canvases, a media player is arranged on the canvas, the media player is installed to play the first media content currently displayed on the floating control, and the related information includes at least one of a media identifier, a playback progress, and a playback state.

[0100] Optionally, in response to the current operation type being the second operation type, when the floating control module performs corresponding control on the floating control based on the current operation type and the current gesture operation, it is installed to switch the second media content currently displayed on the floating control to the third media content based on the second operation type and the acting direction of the current gesture operation, where the third media content is the previous media content or the next media content of the second media content in the media stream.

[0101] Optionally, a canvas switching component is bound to the floating control, the canvas switching component includes a plurality of canvases, a media player is arranged on the canvas, and the media player is installed to play media content loaded on the corresponding canvas so as to display media content on the floating control.

[0102] Here, based on the second operation type and the acting direction of the current gesture operation, switching the second media content currently displayed on the floating control to third media content means that the canvas switching component is based on the acting direction of the current gesture operation and the first content identifier of the second media content currently displayed on the floating control, transmitting the current gesture operation to the canvas switching component based on the second operation type so that the second content identifier of the third media content to be switched can be determined, and the canvas switching component broadcasting the second content identifier to a plurality of canvases, and playing the second media content through a media player corresponding to the canvas that matches the second content identifier.

[0103] The content display device according to an embodiment of the present disclosure can execute the content display method according to any embodiment of the present disclosure, and has a function module and an effect for executing the method.

[0104] The units and modules included in the above device are only divided by functional logic, but are not limited to the above division, as long as the corresponding functions can be realized, and the names of the functional units are also for distinguishing each other and do not limit the protection scope of the embodiments of the present disclosure.

[0105] FIG. 7 is a schematic configuration diagram of an electronic device according to an embodiment of the present disclosure. Hereinafter, FIG. 7 will be referred to. FIG. 7 shows a schematic configuration diagram of an electronic device (for example, a terminal device or a server in FIG. 7) 700 for realizing an embodiment of the present disclosure. The terminal device in the embodiment of the present disclosure may include, but is not limited to, mobile terminals such as mobile phones, notebook computers, digital broadcast receivers, personal digital assistants (PDAs), tablet computers (PADs), portable media players (PMPs), in-vehicle terminals (for example, in-vehicle navigation terminals), and fixed terminals such as digital TVs and desktop computers. The electronic device shown in FIG. 7 is merely an example and does not impose any limitations on the functions and usage ranges of the embodiments of the present disclosure.

[0106] As shown in FIG. 7, the electronic device 700 may include a processor (for example, a central processing unit, a graphics processor, etc.) 701, and the processor 701 may execute various appropriate operations and processes based on a program stored in a read-only memory (ROM) 702 or a program loaded from a storage device 708 into a random access memory (RAM) 703. Various programs and data necessary for the operation of the electronic device 700 are also stored in the RAM 703. The processor 701, the ROM 702, and the RAM 703 are interconnected by a bus 704. An input / output I / O interface 705 is also connected to the bus 704.

[0107] Typically, input devices 706 including a touch screen, a touch pad, a keyboard, a mouse, a camera, a microphone, an accelerometer, a gyroscope, etc., output devices 707 including a liquid crystal display (LCD), a speaker, a vibrator, etc., storage devices 708 including a magnetic tape, a hard disk, etc., and devices such as a communication device 709 may be connected to the I / O interface 705. The communication device 709 enables the electronic device 700 to exchange data with other devices through wireless or wired communication. FIG. 7 shows an electronic device 700 having various devices, but it is not required to implement or include all the shown devices. Alternatively, more or fewer devices may be provided.

[0108] In particular, according to an embodiment of the present disclosure, the process described with reference to the above flowchart may be implemented as a computer software program. For example, an embodiment of the present disclosure includes program code for executing the method shown in the flowchart, and includes a computer program product including a computer program carried on a non-transitory computer-readable medium. In such an embodiment, the computer program can be downloaded and installed from a network via the communication device 709, installed from the storage device 708, or installed from the ROM 702. When the computer program is executed by the processor 701, the above-described functions limited in the method of the embodiment of the present disclosure are executed.

[0109] The electronic device according to an embodiment of the present disclosure belongs to the same concept as the content display method according to the above embodiment. For technical details not described in detail in this embodiment, reference may be made to the above embodiment, and this embodiment has the same effects as the above embodiment.

[0110] An embodiment of the present disclosure provides a computer-readable storage medium storing a computer program, and when the program is executed by a processor, the content display method according to the above embodiment is realized.

[0111] Note that the computer-readable storage medium according to the present disclosure may be a computer-readable signal medium, a computer-readable storage medium, or any combination of the above two. The computer-readable storage medium may be, for example, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination of the above, but is not limited thereto. Examples of computer-readable storage media include, but are not limited to, electrical connections having at least one wire, portable computer magnetic disks, hard disks, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM), flash memory, optical fibers, portable compact disc read-only memory (CD-ROM), optical storage devices, magnetic storage devices, or any suitable combination of the above. In the present disclosure, the computer-readable storage medium may be any tangible medium that includes or stores a program, and the program may be used by or in combination with an instruction execution system, apparatus, or device. In the present disclosure, the computer-readable signal medium may include a data signal propagated in a baseband or as part of a carrier wave, in which computer-readable program code is carried. Such propagated data signals can take various forms including, but not limited to, electromagnetic signals, optical signals, or any suitable combination of the above. The computer-readable signal medium may be any computer-readable storage medium other than the computer-readable storage medium, and the computer-readable signal medium can transmit, propagate, or transmit a program used by or in combination with an instruction execution system, apparatus, or device. The program code included in the computer-readable storage medium can be transmitted via any suitable medium including, but not limited to, wires, optical cables, radio frequency (RF), or any suitable combination of these.

[0112] In some embodiments, the client and the server communicate using a current known or future-developed network protocol such as the Hyper Text Transfer Protocol (HTTP), and can be interconnected with digital data communication of any format or medium (e.g., a communication network). Examples of communication networks include Local Area Networks (LANs), Wide Area Networks (WANs), WWW networks (e.g., the Internet) and end-to-end networks (e.g., ad hoc networks), and current known or future-developed networks.

[0113] The computer-readable storage medium may be included in the electronic device or may exist independently without being incorporated into the electronic device.

[0114] At least one program is carried on the computer-readable storage medium. When the at least one program is executed by the electronic device, the electronic device displays a floating control on a target page, displays a media flow on the floating control, determines a touch position when it detects that the user has touched the floating control, detects a current gesture operation starting from the touch position, determines a current operation type of the detected current gesture operation based on a target area where the touch position is located in the floating control, and performs corresponding control on the floating control based on the current operation type and the current gesture operation. Here, different operation types correspond to different areas in the floating control.

[0115] The computer program code for performing the operations of the present disclosure may be created in at least one programming language or a combination thereof, and the programming languages include, but are not limited to, object-oriented programming languages such as Java, Smalltalk, and C++, and also include conventional procedural programming languages such as the "C" language or similar programming languages. The program code may be executed entirely on the user computer, may be executed partially on the user computer, may be executed as an independent software package, may be executed partially on the user computer and partially on a remote computer, or may be executed entirely on a remote computer or server. In the case of a remote computer, the remote computer may be connected to the user 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 (for example, connected via the Internet using an Internet service provider).

[0116] Flowcharts and block diagrams in the drawings illustrate the possible system architectures, functions, and operations of systems, methods, and computer program products according to various embodiments of the present disclosure. In this regard, each block in a flowchart or block diagram can represent a module, segment, or portion of code that includes at least one executable instruction for implementing a given logical function. It should be noted that, alternatively, the functions described in the blocks may be generated in an order different from the order described in the drawings. For example, two consecutively shown blocks may actually be executed substantially in parallel, may be executed in reverse order, or may be defined by such functions. Each block in the block diagrams and flowcharts, as well as combinations of blocks in the block diagrams and flowcharts, may be implemented by a system of dedicated hardware for performing a given function or operation, or may be implemented by a combination of dedicated hardware and computer instructions.

[0117] The units mentioned in the embodiments of the present disclosure may be implemented in software or in hardware. Here, the name of the module does not limit the module itself. For example, the floating control display module may be described as "a module that displays a floating control on the target page and displays a media stream on the floating control".

[0118] The functions described in this specification may be at least partially executed by at least one hardware logic component. For example, without limitation, exemplary types of hardware logic components that may be used include Field Programmable Gate Array (FPGA), Application Specific Integrated Circuit (ASIC), Application Specific Standard Parts (ASSP), System on Chip (SOC), Complex Programmable Logic Device (CPLD), and the like.

[0119] In the context of the present disclosure, a machine-readable storage medium may be a tangible medium that may contain or store a program for use by or in connection with an instruction execution system, apparatus, or device. The machine-readable storage medium may be a machine-readable signal medium or a machine-readable storage medium. The machine-readable storage medium includes, but is not limited to, electronic, magnetic, optical, electromagnetic, infrared, or semiconductor systems, apparatus, or devices, or any suitable combination thereof. Examples of the machine-readable storage medium include, but are not limited to, electrical connections based on at least one wire, a portable computer diskette, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM), a flash memory, an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above contents.

[0120] According to one or more embodiments of the present disclosure, a content display method is provided. The content display method includes displaying a floating control on a target page and displaying a media stream on the floating control; determining a touch position in response to detecting that a user touches the floating control, and detecting a current gesture operation starting from the touch position; determining a current operation type of the detected current gesture operation based on a target area where the touch position is located in the floating control; and performing corresponding control on the floating control based on the current operation type and the current gesture operation, where different operation types correspond to different areas in the floating control.

[0121] According to one or more embodiments of the present disclosure, the operation type includes at least one of a first operation type and a second operation type. The first operation type is to move the floating control, and the second operation type is to switch the media content currently displayed on the floating control.

[0122] According to one or more embodiments of the present disclosure, the current operation type is the first operation type. Based on the current operation type and the current gesture operation, performing corresponding control on the floating control includes moving the floating control to a corresponding display position on the target page based on at least one of the first operation type, the acting direction of the current gesture operation, and the acting distance and acting speed of the current gesture operation.

[0123] According to one or more embodiments of the present disclosure, the target page includes a predetermined page. The method further includes, when detecting that the background playback mode is triggered on the target page, displaying the first media content currently displayed on the floating control as the background of the target page and canceling the display of the floating control.

[0124] According to one or more embodiments of the present disclosure, detecting that the background playback mode is triggered on the target page includes determining that it is detected that the background playback mode is triggered in response to receiving a predetermined gesture operation on the target page, where the predetermined gesture operation is set to trigger the background playback mode.

[0125] According to one or more embodiments of the present disclosure, the operation type includes a first operation type, and the first operation type is to move the floating control. The current operation type is the first operation type. Based on the current operation type and the current gesture operation, performing corresponding control on the floating control includes moving the floating control to a corresponding display position on the target page based on the first operation type and the current gesture operation. Detecting that the background playback mode has been triggered on the target page includes, when detecting that the user's touch on the screen has stopped, determining whether the current display position of the floating control is the target display position, and if the current display position of the floating control is the target display position, determining that it has been detected that the background playback mode has been triggered.

[0126] According to one or more embodiments of the present disclosure, the target display position includes a position within a predetermined range on the target page, and the predetermined range includes the center point of the target page.

[0127] According to one or more embodiments of the present disclosure, the target page includes a message interaction page. Displaying the first media content currently displayed on the floating control as the background of the target page includes replacing the background of the target page with the first media content currently displayed on the floating control so that the page content of the message interaction page is displayed on the upper layer of the first media content. The page content includes at least one of message content and related content of the message content.

[0128] According to one or more embodiments of the present disclosure, the first media content currently displayed in the floating control is displayed as the background of the target page. After canceling the display of the floating control, in response to a first predetermined operation by the user on the target page, a non-display playback mode is switched to, and the first media content is displayed. Here, in the non-display playback mode, the page content displayed on top of the first media content in the background playback mode is hidden.

[0129] According to one or more embodiments of the present disclosure, after switching to the non-display playback mode and displaying the first media content, further, in response to a second predetermined operation by the user on the target page, the media content currently displayed on the target page is switched.

[0130] According to one or more embodiments of the present disclosure, after switching to the non-display playback mode and displaying the first media content, further, a predetermined control is displayed on the target page. Here, the predetermined control is installed to perform at least one of controlling the media content displayed on the target page, performing an interaction on the media content displayed on the target page, and triggering the display of the floating control and switching to displaying the media content displayed on the target page on the floating control.

[0131] According to one or more embodiments of the present disclosure, displaying the first media content currently displayed on the floating control as the background of the target page and canceling the display of the floating control includes unbinding the canvas switching component from the floating control, binding the canvas switching component to the background view of the target page, obtaining related information of the first media content from a predetermined database, and continuing to display the first media content based on the related information in the background view based on the canvas switching component, and canceling the display of the floating control. Here, the canvas switching component includes a plurality of canvases, a media player is arranged on the canvas, the media player is installed to play the first media content currently displayed on the floating control, and the related information includes at least one of a media identifier, a playback progress, and a playback state.

[0132] According to one or more embodiments of the present disclosure, the current operation type is a second operation type, and performing corresponding control on the floating control based on the current operation type and the current gesture operation includes switching the second media content currently displayed on the floating control to a third media content based on the second operation type and the acting direction of the current gesture operation. Here, the third media content is the previous media content or the next media content of the second media content in the media stream.

[0133] According to one or more embodiments of the present disclosure, a canvas switching component is bound to the floating control, a plurality of canvases are included in the canvas switching component, a media player is arranged on the canvas, and the media player is installed to play media content loaded on the corresponding canvas so as to realize displaying media content on the floating control. Here, based on the second operation type and the acting direction of the current gesture operation, switching the second media content currently displayed on the floating control to a third media content includes transmitting the current gesture operation to the canvas switching component based on the second operation type so that the canvas switching component can determine a second content identifier of the third media content to be switched based on the acting direction of the current gesture operation and a first content identifier of the second media content currently displayed on the floating control, and broadcasting the second content identifier to a plurality of canvases by the canvas switching component so as to play the second media content through a media player corresponding to the canvas matching the second content identifier.

[0134] According to one or more embodiments of the present disclosure, a content display device is provided. The content display device includes a floating control display module, a gesture operation detection module, and a floating control control module. The floating control display module is configured to display a floating control on a target page and is installed to display a media stream on the floating control. The gesture operation detection module is configured to determine a touch position and detect a current gesture operation starting from the touch position in response to detecting that the user touches the floating control. The floating control control module is configured to determine a current operation type of the detected current gesture operation based on a target area where the touch position is located in the floating control, and perform corresponding control on the floating control based on the current operation type and the current gesture operation. Here, different operation types correspond to different areas in the floating control.

[0135] According to one or more embodiments of the present disclosure, an electronic device is provided. The electronic device includes at least one processor and a storage device. The storage device is installed to store at least one program. When the at least one program is executed by the at least one processor, the at least one processor is caused to implement the content display method according to the embodiments of the present disclosure.

[0136] According to at least one embodiment of the present disclosure, a storage medium including computer-executable instructions is provided. When the computer-executable instructions are executed by a computer processor, the content display method according to the embodiments of the present disclosure is executed.

Claims

1. Displaying a floating control on a target page and displaying a media stream on the floating control; Determining a touch position in response to detecting that a user has touched the floating control, and detecting a current gesture operation starting from the touch position; Determining a current operation type of the detected current gesture operation based on a target area where the touch position is located in the floating control, and performing corresponding control on the floating control based on the current operation type and the current gesture operation, including: Different operation types correspond to different areas in the floating control; A content display method.

2. The operation type includes at least one of a first operation type and a second operation type. The first operation type is to move the floating control, and the second operation type is to switch the media content currently displayed on the floating control. The method according to claim 1.

3. The current operation type is the first operation type; Performing corresponding control on the floating control based on the current operation type and the current gesture operation includes: Moving the floating control to a corresponding display position on the target page based on at least one of the first operation type, the acting direction of the current gesture operation, and the acting distance and acting speed of the current gesture operation. The method according to claim 2.

4. The target page includes a predetermined page; The method further includes: when detecting that a background playback mode is triggered on the target page, displaying the first media content currently displayed on the floating control as the background of the target page and canceling the display of the floating control. The method according to claim 1.

5. Detecting that a background playback mode is triggered on the target page includes: In the target page, it includes determining that it is detected that the background playback mode has been triggered in response to receiving a predetermined gesture operation. The predetermined gesture operation is set to trigger the background playback mode. The method according to claim 4.

6. The operation type includes a first operation type, and the first operation type is to move the floating control. The current operation type is the first operation type. Performing corresponding control on the floating control based on the current operation type and the current gesture operation includes Moving the floating control to a corresponding display position on the target page based on the first operation type and the current gesture operation. Detecting that the background playback mode has been triggered in the target page includes When detecting that the user's touch on the screen has stopped, determining whether the current display position of the floating control is the target display position, and Determining that it is detected that the background playback mode has been triggered in response to the current display position of the floating control being the target display position. The method according to claim 4.

7. The target display position includes a position within a predetermined range on the target page, and the predetermined range includes the center point of the target page. The method according to claim 6.

8. The target page includes a message interaction page. Displaying the first media content currently displayed on the floating control as the background of the target page includes Replacing the background of the target page with the first media content currently displayed on the floating control so that the page content of the message interaction page is displayed on the upper layer of the first media content. The page content includes at least one of message content and related content of the message content. The method according to claim 4.

9. Display the first media content currently displayed in the floating control as the background of the target page, and after canceling the display of the floating control, switch to the invisible state playback mode in response to a first predetermined operation by the user on the target page, and display the first media content, in the invisible state playback mode, hide the page content that is displayed above the first media content in the background playback mode, The method according to claim 4.

10. After switching to the invisible state playback mode and displaying the first media content, further, switch the media content currently displayed on the target page in response to a second predetermined operation by the user on the target page, The method according to claim 9.

11. After switching to the invisible state playback mode and displaying the first media content, further, display a predetermined control on the target page, The predetermined control is controlling the media content displayed on the target page, performing an interaction on the media content displayed on the target page, and triggering the display of the floating control and switching to displaying the media content displayed on the target page on the floating control, installed to perform at least one of The method according to claim 9.

12. Displaying the first media content currently displayed in the floating control as the background of the target page and canceling the display of the floating control includes unbinding the canvas switching component from the floating control and binding the canvas switching component to the background view of the target page, and obtaining the related information of the first media content from a predetermined database, continuously displaying the first media content based on the related information in the background view based on the canvas switching component, and canceling the display of the floating control, The canvas switching component includes a plurality of canvases, a media player is arranged on the canvas, and the media player is installed to play the first media content currently displayed on the floating control. The related information includes at least one of a media identifier, playback progress, and playback state. The method according to any one of claims 4 to 11.

13. The current operation type is the second operation type. Performing corresponding control on the floating control based on the current operation type and the current gesture operation includes: Based on the second operation type and the acting direction of the current gesture operation, switching the second media content currently displayed on the floating control to a third media content, The third media content is the media content before or after the second media content in the media stream. The method according to claim 2.

14. A canvas switching component is bound to the floating control, the canvas switching component includes a plurality of canvases, a media player is arranged on the canvas, and the media player is installed to play the media content loaded on the corresponding canvas so as to realize displaying media content on the floating control. Based on the second operation type and the acting direction of the current gesture operation, switching the second media content currently displayed on the floating control to a third media content includes: Transmitting the current gesture operation to the canvas switching component based on the second operation type so that the canvas switching component can determine a second content identifier of the third media content to be switched based on the acting direction of the current gesture operation and a first content identifier of the second media content currently displayed on the floating control. broadcasting the second content identifier to a plurality of canvases by the canvas switching component so as to play the second media content through a media player corresponding to the canvas matching the second content identifier The method according to claim 13

15. including a floating control display module, a gesture operation detection module, and a floating control control module The floating control display module is configured to display a floating control on a target page and display a media stream on the floating control The gesture operation detection module is configured to determine a touch position in response to detecting that a user has touched the floating control, and detect a current gesture operation starting from the touch position The floating control control module is configured to determine a current operation type of the detected current gesture operation based on the target area where the touch position is located on the floating control, and perform corresponding control on the floating control based on the current operation type and the current gesture operation, where different operation types correspond to different areas on the floating control Content display device

16. including a module for executing the method according to any one of claims 2 to 14 The apparatus according to claim 15

17. including at least one processor and a storage device The storage device is configured to store at least one program When the at least one program is executed by the at least one processor, the at least one processor realizes the method according to any one of claims 1 to 14 Electronic device

18. A storage medium including computer-executable instructions, where when the computer-executable instructions are executed by a computer processor, the method according to any one of claims 1 to 14 is executed

Images