Interface display method and device and electronic equipment

By setting the color of the background image according to the target color and color parameters of the associated image in the playback interface of the electronic device, the problem of inflexible background image setting in the prior art is solved, and the correlation between the background image and the associated image is realized, and the user experience is improved.

CN119536564APending Publication Date: 2025-02-28GUANGDONG OPPO MOBILE TELECOMMUNICATIONS CORP LTD
View PDF 0 Cites 0 Cited by

Patent Information

Application Number
CN202311092808.2
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2023-08-28
Publication Date
2025-02-28

AI Technical Summary

Technical Problem

In the prior art, when the electronic device plays a media object, the background image setting method of the playback interface is not flexible enough to have good correlation with the associated image.

Method used

By displaying the associated image and the background image in the playback interface of the electronic device, the color of the background image is determined according to the target color and color parameters in the associated image, flexible settings of the background image and correlation with the associated image are achieved.

Benefits of technology

It realizes flexible settings for the background image of the playback interface, making it relevant to the associated image and improving the user experience.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119536564A_ABST
    Figure CN119536564A_ABST
Patent Text Reader

Abstract

The embodiment of the invention discloses an interface display method and device and electronic equipment. The method comprises the following steps: displaying a playing interface of a target media object; wherein the playing interface at least comprises an associated image and a background image, the associated image is an image associated with the target media object, the background image is an image serving as a background in the playing interface, and the color of the background image is determined according to a target color in the associated image and a color parameter of the target color. Therefore, when the playing interface of the target media object is displayed and the associated image of the target media object is displayed in the playing interface, the color of the background image in the playing interface is displayed. According to the embodiment of the invention, the background image can be determined according to the target color in the associated image displayed in the playing interface and the color parameter of the target color, so that the background image in the playing interface can be flexibly set, and the set background image can have certain relevance with the associated image.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present application relates to the field of terminal technology, and more specifically, to an interface display method, device and electronic device. Background Art

[0002] When an electronic device plays a media object (eg, audio or video), a play interface corresponding to the played media object may be displayed so as to display related information through the play interface. However, the setting method of the background image of the related play interface is not flexible enough. Summary of the invention

[0003] In view of the above problems, the present application proposes an interface display method, device and electronic device to improve the above problems.

[0004] In a first aspect, the present application provides an interface display method, applied to an electronic device, the method comprising: displaying a playback interface of a target media object; wherein the playback interface comprises at least an associated image and a background image, wherein the associated image is an image associated with the target media object, and the background image is an image serving as a background in the playback interface, and the color of the background image is determined based on a target color in the associated image and a color parameter of the target color.

[0005] In a second aspect, the present application provides an interface display device that runs on an electronic device, the device comprising: an interface display unit for displaying a playback interface of a target media object; wherein the playback interface comprises at least an associated image and a background image, wherein the associated image is an image associated with the target media object, and the background image is an image that serves as a background in the playback interface, and the color of the background image is determined based on a target color in the associated image and a color parameter of the target color.

[0006] In a third aspect, the present application provides an electronic device comprising one or more processors and a memory; one or more programs are stored in the memory and configured to be executed by the one or more processors, and the one or more programs are configured to execute the above-mentioned method.

[0007] In a fourth aspect, the present application provides a computer-readable storage medium storing a program code executable by a processor, wherein the computer-readable storage medium includes the stored program code, wherein the above method is executed when the program code is run.

[0008] The present application provides an interface display method, device and electronic device, the electronic device can display the playback interface of the target media object, and the displayed playback interface includes at least an associated image and a background image, wherein the color of the background image is determined according to the target color in the associated image and the color parameters of the target color. Thus, through the above method, when the playback interface of the target media object is displayed, in the case where the associated image of the target media object is displayed in the playback interface, the color of the background image in the playback interface can be determined according to the target color in the associated image displayed together in the playback interface and the color parameters of the target color, thereby realizing the flexible setting of the background image in the playback interface, and also making the set background image have a certain correlation with the associated image. BRIEF DESCRIPTION OF THE DRAWINGS

[0009] In order to more clearly illustrate the technical solutions in the embodiments of the present application, the drawings required for use in the description of the embodiments will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present application. For those skilled in the art, other drawings can be obtained based on these drawings without creative work.

[0010] Figure 1 A flow chart of an interface display method proposed in an embodiment of the present application is shown;

[0011] Figure 2 A schematic diagram showing an interface for displaying candidate media objects in an embodiment of the present application is shown;

[0012] Figure 3 A schematic diagram of a playback interface in an embodiment of the present application is shown;

[0013] Figure 4 A schematic diagram showing another playback interface in an embodiment of the present application is shown;

[0014] Figure 5 A schematic diagram showing another playback interface in an embodiment of the present application is shown;

[0015] Figure 6 A schematic diagram showing a corresponding playback interface when the target media object is a video in an embodiment of the present application;

[0016] Figure 7 A flowchart of an interface display method proposed in another embodiment of the present application is shown;

[0017] Figure 8 A flowchart of an interface display method proposed in another embodiment of the present application is shown;

[0018] Fig. 9A schematic diagram of a dynamic element in an embodiment of the present application is shown;

[0019] Fig.10 A schematic diagram showing another playback interface in an embodiment of the present application is shown;

[0020] Fig.11 A schematic diagram showing dynamic changes of dynamic elements in an embodiment of the present application is shown;

[0021] Fig.12 A schematic diagram showing a method of obtaining a background image according to a cover image in an embodiment of the present application is shown;

[0022] Fig.13 A flowchart of an interface display method proposed in another embodiment of the present application is shown;

[0023] Fig.14 A schematic diagram showing another playback interface in an embodiment of the present application is shown;

[0024] Fig.15 A schematic diagram showing another playback interface in an embodiment of the present application is shown;

[0025] Fig.16 A structural block diagram of an interface display device proposed in an embodiment of the present application is shown;

[0026] Fig.17 A structural block diagram of an electronic device for executing an interface display method according to an embodiment of the present application is shown;

[0027] Fig.18 It is a storage unit of an embodiment of the present application for storing or carrying program codes for implementing the interface display method according to an embodiment of the present application. DETAILED DESCRIPTION

[0028] The following will be combined with the drawings in the embodiments of the present application to clearly and completely describe the technical solutions in the embodiments of the present application. Obviously, the described embodiments are only part of the embodiments of the present application, not all of the embodiments. Based on the embodiments in the present application, all other embodiments obtained by ordinary technicians in this field without creative work are within the scope of protection of this application.

[0029] When an electronic device plays a media object (e.g., audio or video), a corresponding playback interface may be displayed on the screen of the electronic device so as to display relevant information of the media object through the playback interface. For example, when the media object is audio, the displayed playback interface may display a cover image of the audio and relevant content of the audio. The relevant content may include the name of the audio or the audio content, etc.

[0030] Among them, a background image can be displayed in the playback interface. However, the inventor found in research that the setting method of the background image of the relevant playback interface is not flexible enough.

[0031] Therefore, the inventors have proposed an interface display method, device, and electronic device in the present application, wherein the electronic device can display the playback interface of the target media object, and the displayed playback interface includes at least an associated image and a background image, wherein the color of the background image is determined based on the target color in the associated image and the color parameters of the target color. Thus, through the above-mentioned method, when the playback interface of the target media object is displayed, in the case where the associated image of the target media object is displayed in the playback interface, the color of the background image in the playback interface can be determined based on the target color in the associated image displayed together in the playback interface and the color parameters of the target color, thereby achieving flexible setting of the background image in the playback interface, and also allowing the set background image to have a certain correlation with the associated image.

[0032] The embodiments of the present application will be described in detail below with reference to the accompanying drawings.

[0033] See also Figure 1 , an interface display method provided by an embodiment of the present application is applied to an electronic device, and the method includes:

[0034] S110: Displaying a playback interface of the target media object, wherein the playback interface includes at least an associated image and a background image, wherein the associated image is an image associated with the target media object, and the background image is an image used as a background in the playback interface, and the color of the background image is determined based on a target color in the associated image and a color parameter of the target color.

[0035] In the embodiment of the present application, a media object can be understood as an object that is played by an electronic device to display content. Optionally, the media object may include audio and video, etc. Among them, the audio may be audio of a song category, audio of a novel category, or audio of a crosstalk category. The video may be a video of a film and television category, a video of a game battle category, etc.

[0036] Optionally, when the electronic device starts an audio player program, the name of at least one audio may be displayed in the interface of the audio player program. In this case, the audio displayed in the interface of the audio player program may be a media object. For another example, when the electronic device starts a video player program, the name of at least one video may be displayed in the interface of the audio player program. In this case, the video displayed in the interface of the video player program may be a media object.

[0037] The target media object may be understood as a media object selected for playback. Optionally, the target media object may be determined from the candidate media objects by the user of the electronic device. Figure 2 As shown, in Figure 2 In the interface 10 shown, the candidate media objects displayed include music M1, music M2, music M3, music M4 and music M5. If the user clicks on music M3 through a clicking operation, the electronic device can use music M3 as the target media object.

[0038] Optionally, the target media object can also be automatically determined by the electronic device from the candidate media objects. In some cases, the electronic device can automatically trigger media playback in response to a specified event, and the electronic device can use the media object corresponding to the triggered event as the target media object. For example, if the content of an event established in the electronic device is: automatically play music at 10 o'clock, in this case, the electronic device can automatically play music at 10 o'clock, and the music to be played will be used as the target media object. For another example, when the electronic device is playing a media object, after completing the playback of the current media object, it can automatically play the next media object to be played. In this case, in response to completing the playback of the current media object, the next media object to be played can be used as the target media object.

[0039] In an embodiment of the present application, the playback interface can be understood as the interface displayed when playing a media object. In the playback interface corresponding to the target media object, content corresponding to the target media object can be displayed. For example, an associated image of the target media object can be displayed in the playback interface. In an embodiment of the present application, the associated image of the target media object can be understood as an image associated with the content of the target media object. In some cases, the associated image can express the theme or emotion to be expressed by the target media object. For example, when the target media object is audio, the associated image corresponding to the audio can be a cover image. For another example, when the target media object is a video, the associated image corresponding to the video can be a frame of image in the video, or, when the target media object is a video, the associated image corresponding to the video can be a promotional poster.

[0040] In the embodiment of the present application, there are multiple ways to obtain the associated image of the target media object.

[0041] As a method, the associated image of the target media object can be pre-generated. Optionally, the associated image of the target media object can be pre-generated by the device automatically according to the content of the target media object. Optionally, the associated image of the target media object can be pre-generated by the designer operating the device. Among them, the designer can design the associated image of the target media object in advance according to the content of the target media object, and then the associated image can be stored in correspondence with the target media object. When the target media object is determined, the pre-generated associated image can be read accordingly. For example, for each audio (a media object) included in the audio playback program, the designer will usually design a cover image (an associated image) corresponding to the audio, and then when a certain audio is determined as the target media object, the corresponding cover image can be obtained as the associated image.

[0042] As another way, the associated image of the target media object can be generated in real time. In this way, after determining the target media object, the electronic device can obtain the content of the target media object, and then generate the corresponding associated image in real time according to the content of the media object. Among them, the content obtained for generating the associated image can represent the theme or emotion to be expressed by the target media object. For example, if the target media object is audio, and the theme to be expressed by the content of the audio is love, then the image content of the associated image of the audio will also be related to love. Optionally, in the case where the target media object is audio, the electronic device can obtain the content of the audio (for example, lyrics) and then obtain the theme or emotion to be expressed by the audio by performing semantic analysis on the content. Optionally, in the case where the target media object is a video, the electronic device can determine the theme or emotion to be expressed by the video through the content of the image frames included in the video.

[0043] In the embodiment of the present application, the background image is an image used as the background in the playback interface.

[0044] As a method, the background image can be the background of the entire playback interface. The background image being the background of the entire playback interface can be understood as the background image filling all areas of the playback interface, or the size of the background image is the same as the size of the playback interface.

[0045] Optionally, in an embodiment of the present application, the playback interface may be composed of multiple layers. The multiple layers may be stacked in sequence to form a playback interface. In this case, the content included in the playback interface may be distributed in multiple layers. Optionally, the playback interface may include an information layer and a background layer, wherein the information layer is stacked above the background layer. The associated image may be configured in the information layer, and the background image may be configured in the background layer. For example, Figure 3As shown, the playback interface 20 includes a related image 21 and a background image 22 (represented by Figure 3 The shaded area in the figure indicates Figure 3 In the illustrated manner, the associated image 21 is configured in the information layer 30, and the background image 22 is configured in the background layer 31. It should be noted that, in the information layer, except for the associated image, other areas can be transparent, so that when the information layer is superimposed on the background layer, the content in the background layer can be displayed on the screen.

[0046] Alternatively, as another method, the background image may also be the background of part of the content in the playback interface. If the background image is the background of part of the content in the playback interface, it can be understood that the background image occupies part of the playback interface, or it can be understood that the size of the background image is smaller than the size of the playback interface. Figure 4 As shown, the associated image 41 and the background image 42 in the play interface 40 are displayed in different areas, and there is no overlapping part between them. Figure 4 In the case shown, the background image 42 may be other content ( Figure 4 For example, Figure 5 As shown, the associated image 51 and the background image 52 in the play interface 50 overlap each other. Figure 5 In the case shown, the background image 42 may be the background of the associated image 41, and may not be used as other content in the playback interface 50 except for the associated image 51 ( Figure 5 The background is not shown).

[0047] It should be noted that Figure 4 and Figure 5 The dotted line in the figure may only be used to divide different display positions. When the play interface 40 and the play interface 50 are displayed, the dotted line may not be actually displayed.

[0048] After the associated image is acquired, the color of the background image can be determined according to the target color in the associated image and the color parameters of the target color. In the embodiment of the present application, there can be multiple ways to determine the target color.

[0049] As a method, the target color of the associated image can be understood as the color with the largest proportion in the associated image. Optionally, the target color can be the color with the largest proportion in the associated image. Optionally, the target color can be the second most common color in the associated image. In this method, the electronic device can obtain the color of each pixel in the associated image to count the number of pixels of the same color, and then obtain the target color based on the number of colors of the same pixel. For example, please refer to the following table:

[0050] ID color Number of pixels 1 Color C1 a 2 Color C2 b 3 Color C3 c 4 Color C4 d

[0051] As shown in the above table, by counting the color of each pixel in the associated image, it can be obtained that the colors included in the associated image are color C1, color C2, color C3 and color C4. Among them, the number of pixels of color C1 is a, the number of pixels of color C2 is b, the number of pixels of color C3 is c, and the number of pixels of color C4 is d. Among them, b>a>c>d, in this case, the color C2 with the largest number can be selected as the target color. Alternatively, the color C1 with the second largest number can also be selected as the target color.

[0052] As another way, the target color of the associated image can be the color of the target object in the associated image. The target object can be an object of interest to the user in the associated image, or it can be an object that occupies the largest area in the associated image. It should be noted that the number of colors included in the object in the associated image can be one or more. In this case, if the target object includes only one color, the only color included in the target object can be used as the color of the target object. If the target object includes multiple colors, the color with the largest number can be used as the color of the target object.

[0053] After obtaining the target color, the color parameters of the target color can be further obtained so as to determine the color of the background image by combining the target color and the corresponding color parameters. Among them, the color parameters can be understood as parameters used to define the color, and the properties or composition of the corresponding color can be determined by the color parameters. Optionally, the color parameters obtained can be different in different color modes. Optionally, the color mode can include HSL mode, RGB mode or CMYK mode. For example, when the color mode used by the electronic device is HSL mode, the color parameters obtained can be at least one of hue, saturation and brightness. In HSL mode, hue (H) refers to the external phase of the color, which is the different colors felt by the human eye under light of different wavelengths. Saturation (S) indicates the intensity or purity of the color. The higher the saturation, the brighter the color. Brightness (L) indicates the brightness of the color. The higher the brightness, the brighter the color.

[0054] The color of the background image can be understood as the color used to fill the background image. Optionally, when the background image is a solid color, the color of each pixel in the background image is the same, and the color of the background image can be understood as the color of each pixel in the background image. When the background image is not a solid color, the color of the background image can be understood as the color that accounts for the largest proportion in the background image.

[0055] Optionally, the target media object may also be a video. For example, Figure 6 As shown, in Figure 6 The playback interface shown may include video content 53, associated images 54, and background images 55 (represented by Figure 6 In the case where the target media object is a video, the associated image may be a cover image of the video, or may be any frame image obtained from multiple frames of images included in the video.

[0056] The present embodiment provides an interface display method, which can display the playback interface of the target media object when a target media object is selected, and the displayed playback interface includes at least an associated image and a background image, wherein the color of the background image is determined according to the target color in the associated image and the color parameters of the target color. Thus, through the above method, when the playback interface of the target media object is displayed, when the associated image of the target media object is displayed in the playback interface, the color of the background image in the playback interface can be determined according to the target color in the associated image displayed together in the playback interface and the color parameters of the target color, thereby realizing the flexible setting of the background image in the playback interface, and also making the set background image have a certain correlation with the associated image.

[0057] See also Figure 7 , an interface display method provided by an embodiment of the present application is applied to an electronic device, and the method includes:

[0058] S210: Acquire an associated image of a target media object.

[0059] S220: Acquire the target color of the associated image.

[0060] S230: Compare the color parameter of the target color with the corresponding parameter threshold to obtain a comparison result.

[0061] The correspondence between the parameter threshold and the color parameter can be understood as the parameter threshold being set according to the category of the color parameter. For example, if the color parameter includes saturation and brightness, the parameter threshold can include a saturation threshold and a brightness threshold. For another example, if the color parameter includes hue and saturation, the parameter threshold can include a hue threshold and a saturation threshold.

[0062] It should be noted that in the embodiment of the present application, the color of the determined background image may be related to the target color of the associated image. Optionally, the color of the background image may be obtained by adjusting the target color to a certain extent, so that the color of the obtained background image is related to the associated image to a certain extent, and the background image and the associated image are displayed together on the playback interface, which provides a better visual experience. Among them, the parameter threshold can be understood as a threshold for determining how to obtain the color of the background image based on the target color.

[0063] S240: Determine the color of the background image according to the comparison result and the target color.

[0064] After comparing the color parameter with the parameter threshold, the method of adjusting the target color can be determined according to the comparison result to obtain the desired color of the background image.

[0065] As a method, the color parameter includes saturation and brightness. In this method, the saturation of the target color of the associated image can be compared with the saturation threshold to obtain a first comparison result, and the brightness of the target color of the associated image can be compared with the brightness threshold to obtain a second comparison result. The color of the background image is determined based on the first comparison result, the second comparison result and the target color.

[0066] As a method, the saturation threshold includes a first saturation threshold, the brightness threshold includes a first brightness threshold and a second brightness threshold, and the second brightness threshold is less than the first brightness threshold. In this way, the method of determining the color of the background image may include:

[0067] If the saturation of the target color is greater than or equal to the first saturation threshold, and the brightness of the target color is greater than or equal to the first brightness threshold, the color of the background image is determined based on the first saturation threshold and the first brightness threshold. Wherein, the color of the background image is determined based on the first saturation threshold and the first brightness threshold, which can be understood as the saturation of the color of the determined background image is the first saturation threshold, and the brightness of the color of the background image is the first brightness threshold.

[0068] If the saturation of the target color is greater than or equal to the first saturation threshold, and the brightness of the target color is between the first brightness threshold and the second brightness threshold, the target color is used as the color of the background image. Wherein, the brightness of the target color is between the first brightness threshold and the second brightness threshold, which can be understood as the brightness of the target color is greater than or equal to the second brightness threshold, and less than the first brightness threshold.

[0069] If the saturation of the target color is greater than or equal to the first saturation threshold, and the brightness of the target color is less than the second brightness threshold, the color of the background image is determined based on the saturation of the target color and the second brightness threshold. Wherein, the color of the background image is determined based on the saturation of the target color and the second brightness threshold, which can be understood as the saturation of the color of the determined background image is consistent with the saturation of the target color, and the brightness of the color of the background image is the second brightness threshold.

[0070] As a method, the saturation threshold includes a first saturation threshold and a second saturation threshold, the brightness threshold includes a first brightness threshold and a third brightness threshold, and the first brightness threshold is less than the third brightness threshold. In this way, the method of determining the color of the background image may include:

[0071] If the saturation of the target color is greater than the second saturation threshold and less than the first saturation threshold, and the brightness of the target color is greater than or equal to the third brightness threshold, the color of the background image is determined based on the saturation of the target color and the third brightness threshold. Wherein, the color of the background image is determined based on the saturation of the target color and the third brightness threshold, which can be understood as the saturation of the color of the determined background image is consistent with the saturation of the target color, and the brightness of the color of the background image is the third brightness threshold.

[0072] If the saturation of the target color is greater than the second saturation threshold and less than the first saturation threshold, and the brightness of the target color is between the first brightness threshold and the third brightness threshold, the target color is used as the color of the background image. Wherein, the brightness of the target color is between the first brightness threshold and the third brightness threshold, which can be understood as the brightness of the target color is greater than the first brightness threshold and less than the third brightness threshold.

[0073] If the saturation of the target color is greater than the second saturation threshold and less than the first saturation threshold, and the brightness of the target color is less than or equal to the first brightness threshold, the color of the background image is determined based on the saturation of the target color and the first brightness threshold. Wherein, the color of the background image is determined based on the saturation of the target color and the first brightness threshold, which can be understood as the saturation of the color of the determined background image is consistent with the saturation of the target color, and the brightness of the background image is the first brightness threshold.

[0074] As a method, the saturation threshold includes a second saturation threshold, the brightness threshold includes a first brightness threshold and a third brightness threshold, and the first brightness threshold is less than the third brightness threshold. In this way, the method of determining the color of the background image may include:

[0075] If the saturation of the target color is less than or equal to the second saturation threshold, and the brightness of the target color is greater than or equal to the third brightness threshold, the color of the background image is determined based on the second saturation threshold and the third brightness threshold. Wherein, determining the color of the background image based on the second saturation threshold and the third brightness threshold can be understood as the saturation of the color of the determined background image is the second saturation threshold, and the brightness of the background image is the third brightness threshold.

[0076] If the saturation of the target color is less than or equal to the second saturation threshold, and the brightness of the target color is between the first brightness threshold and the third brightness threshold, the color of the background image is determined based on the second saturation threshold and the brightness of the target color. Wherein, the color of the background image is determined based on the second saturation threshold and the brightness of the target color, which can be understood as the saturation of the determined background image is the second saturation threshold, and the brightness of the background image is consistent with the brightness of the target color.

[0077] If the saturation of the target color is greater than the second saturation threshold and less than the first saturation threshold, and the brightness of the target color is less than or equal to the first brightness threshold, the color of the background image is determined based on the second saturation threshold and the first brightness threshold. Wherein, the color of the background image is determined based on the second saturation threshold and the first brightness threshold, which can be understood as that the saturation of the color of the determined background image is the second saturation threshold, and the brightness of the color of the background image is the first brightness threshold.

[0078] Optionally, in an embodiment of the present application, the hue of the determined background image color may be consistent with the hue of the target color.

[0079] Optionally, the first saturation threshold may be 60, and the second saturation threshold may be 40. Optionally, the first brightness threshold may be 35, the second brightness threshold may be 25, and the third brightness threshold may be 45.

[0080] S250: Displaying a playback interface of the target media object, wherein the playback interface at least includes an associated image and a background image.

[0081] It should be noted that, in the embodiment of the present application, the playback interface to be displayed can be pre-generated or generated in real time. Optionally, a corresponding playback interface can be generated in advance for each media object based on the method provided in the embodiment of the present application, and the generated playback interface is stored. In this case, after determining the target media object, the pre-generated playback interface corresponding to the target media object can be directly read for display. In the case where the playback interface is generated in real time, after determining the target media object, the playback interface can be generated in real time and displayed according to the method provided in the embodiment of the present application.

[0082] The interface display method provided in this embodiment realizes the flexible setting of the background image in the playback interface, and also enables the set background image to have a certain correlation with the associated image. In addition, in this embodiment, a first saturation threshold and a second saturation threshold are further set for saturation, and a first brightness threshold, a second brightness threshold and a third brightness threshold are set for brightness. After obtaining the saturation and brightness of the target color, the aforementioned multiple thresholds are further combined to determine the color of the background image, thereby making the method of determining the color of the background image more refined, and also conducive to enhancing the user's visual experience to a greater extent.

[0083] See also Figure 8 , an interface display method provided by an embodiment of the present application is applied to an electronic device, and the method includes:

[0084] S310: Display the playback interface of the target media object, wherein the playback interface includes at least dynamic elements, associated images and background images, wherein the associated images are images associated with the target media object, the background image is an image used as the background in the playback interface, the color of the background image is determined based on the target color in the associated image and the color parameters of the target color, and the dynamic elements are superimposed on the background image, and the dynamic elements are elements that can change dynamically when displayed.

[0085] In the embodiment of the present application, optionally, the dynamic element can be an object of a regular shape. Among them, a regular shape refers to a geometric figure with a fixed size and shape. These geometric figures can follow certain rules and laws, and regular shapes can include rectangles, circles, triangles, trapezoids, ellipses, squares, diamonds, etc. For example, the dynamic element can be a circular object, or the dynamic element can be a rectangular object. For example, Fig. 9 As shown, a circular dynamic element 60 may be stacked on the background image. Optionally, the dynamic element may also be an object of irregular shape. Correspondingly, the irregular shape refers to a geometric figure without a fixed size and shape.

[0086] When dynamic elements are displayed, the playback interface may include a rhythm layer in addition to the information layer and the background layer. The rhythm layer may be arranged between the information layer and the background layer, and the dynamic elements may be displayed in the rhythm layer. Fig.10 As shown, based on Fig.10 The playback interface on the left can be Fig.10 The information layer 30, the rhythm layer 32 and the background layer 31 shown on the right are composed.

[0087] Optionally, the dynamic change of the dynamic element may include at least one of the following change modes: dynamic change of the display position of the dynamic element, dynamic change of the size of the dynamic element, and dynamic change of the shape of the dynamic element.

[0088] For example, Fig.11 As shown, the display position of the dynamic element 60 can be determined by Fig.11 Move to the position shown in the left image Fig.11 The position shown in the image on the right. Fig.11 In the case of the position shown in the right image, a part of the dynamic element 60 will be blocked by the associated image.

[0089] Optionally, when displaying dynamic elements, the number of dynamic elements displayed can be fixed. Exemplarily, the number of dynamic elements can be 2, in which case, when displaying the playback interface, two dynamic elements will be fixedly displayed. Optionally, the number of dynamic elements can also be dynamically determined according to actual conditions. For example, the electronic device can determine the number of dynamic elements according to the size of the playback interface. It should be noted that the screen sizes of different electronic devices may be different, and in some cases, a single electronic device may have multiple screens of different sizes. When displaying the playback interface on the screen, the size of the displayed playback interface can be adapted to the size of the screen, so that the playback interface will have different sizes when displayed on screens of different sizes. In this case, the larger the playback interface, the more dynamic elements can be displayed.

[0090] When displaying dynamic elements, the color of the dynamic elements will affect the overall visual experience of the playback interface. As a way, in order to make the visual experience of the playback interface have a better immersive feeling when displaying dynamic elements, the contrasting color of the target color can be used as the color of the dynamic element. Among them, contrasting colors refer to two colors that can be clearly distinguished, and each color can include multiple contrasting colors. Optionally, two colors that are 120 degrees to 180 degrees apart on the 24-hue wheel are called contrasting colors. Among them, the 24-hue wheel is composed of the basic hues of the color system, yellow, orange, red, purple, blue, blue-green, green, and yellow-green, and each main hue is divided into 3 parts, forming 24 segmented hue wheels, arranged from No. 1 to No. 24.

[0091] It should be noted that in some cases, there will be contrasting colors of the target color in the associated image, and in some cases, there will be no contrasting colors of the target color in the associated image. Therefore, the electronic device can detect whether there are contrasting colors of the target color in the associated image, and determine the corresponding method to determine the color of the dynamic element based on the detection result.

[0092] Optionally, if there is a contrasting color of the target color among the colors included in the associated image, the contrasting color of the target color is used as the color of the dynamic element; if there is no contrasting color of the target color among the colors included in the associated image, the color obtained after adjusting the brightness of the reference color is used as the color of the dynamic element. The reference color may be a color among the colors included in the associated image, whose brightness difference with the target color satisfies a first difference condition, or the reference color may be the target color. Optionally, the first difference condition is: the color among the colors included in the associated image, whose brightness difference with the target color is the largest. After adjusting the brightness of the reference color, the difference between the brightness of the obtained color and the brightness of the target color is greater than or equal to a first specified value. Exemplarily, the first specified value may be 20.

[0093] Optionally, if the difference between the brightness of the contrasting color of the target color and the brightness of the target color satisfies a second difference condition, the contrasting color of the target color is used as the color of the dynamic element; if the difference between the brightness of the contrasting color of the target color and the brightness of the target color does not satisfy the second difference condition, the brightness of the contrasting color is adjusted, and the color obtained after adjusting the brightness is used as the color of the dynamic element, wherein the difference between the brightness of the color obtained after adjusting the brightness and the brightness of the target color satisfies the second difference condition. Optionally, the second difference condition may include: the difference between the brightness of the color obtained after adjusting the brightness and the brightness of the target color is a second specified value. Exemplarily, the second specified value may be 20.

[0094] It should be noted that by adjusting the brightness of the contrasting color of the target color or the reference color and using the color after brightness adjustment as the color of the dynamic element, the color of the dynamic element can be made softer, avoiding the strong stimulation brought by two different colors (the color of the background image and the color of the dynamic element) and reducing visual interference.

[0095] It should be noted that audio has a certain rhythm performance. Different audios have different corresponding rhythms. For example, the rhythm of some audios is relatively fast, while the rhythm of some audios is relatively slow. Among them, audio with a faster rhythm will make people feel excited, energetic and enthusiastic. Audio with a slower rhythm will make people feel peaceful, soft and soothing. In the case where the target media object includes audio, in order to have a better immersive experience during the playback of the audio, the electronic device determines the frequency of change of the dynamic element according to the rhythm of the audio. Among them, if the rhythm of the audio included in the target media object is relatively fast, the frequency of change of the dynamic element can be made relatively faster. Correspondingly, if the rhythm of the audio included in the target media object is relatively slow, the frequency of change of the dynamic element can be made relatively slow.

[0096] For example, the following Fig.12 A process of obtaining a background image based on an associated image is described below. Fig.12 In the example shown, the target media object is audio, and the associated image is the cover image of the audio. Fig.12 As shown, after determining the audio as the target media object, the color can be extracted from the cover image of the audio to obtain the primary color and the secondary color. The primary color can be understood as the target color in the embodiment of the present application, and the secondary color can be understood as the contrasting color of the primary color.

[0097] After obtaining the main color, the color of the background image can be determined based on the main color. Fig.12 In the method shown, the saturation of the main color ( Fig.12 denoted by S in the figure) and / or brightness ( Fig.12 The color of the background image 70 is obtained by adjusting the saturation of the primary color (denoted by L in FIG. 5 ). For example, when the saturation of the primary color is greater than or equal to 60, the color of the background image 70 can be further determined in combination with the brightness of the target color. For example, when the brightness is greater than or equal to 35, the saturation of the color of the background image 70 is determined to be 60 and the brightness is 35. When the brightness is greater than or equal to 25 and less than 35, the primary color is directly used as the color of the background image 50. When the brightness is less than 25, the saturation of the primary color is used as the saturation of the color of the background image 70, and the brightness of the color of the background image 70 is 25.

[0098] After obtaining the primary color, the obtained secondary color can be further combined to obtain the color of the dynamic element, thereby obtaining the overall display effect of the playback interface.

[0099] As a way, the dynamic element can also be configured to be transparent, so that when the dynamic element is superimposed on the background image, the visibility of the background image is better. Optionally, the transparency of the dynamic element can be gradually increased from the center of the dynamic element to the edge. Among them, the higher the transparency, the more transparent the representation. Optionally, the edge portion of the dynamic element can also be blurred.

[0100] The interface display method provided by this embodiment realizes the flexible setting of the background image in the playback interface, and also enables the set background image to have a certain correlation with the associated image. Moreover, in this embodiment, when dynamic elements are configured in the playback interface, the color of the dynamic element can be further determined in combination with the target color in the associated image, so that the dynamic element can have a better visual correlation with the associated image, which is conducive to improving the user experience. Furthermore, the frequency of the dynamic change of the dynamic element can also be dynamically changed according to the rhythm of the target playback audio, so that the user can have a better immersive experience.

[0101] See also Fig.13 The present application provides an interface display method, which is applied to an electronic device, and the method includes:

[0102] S410: Display the playback interface of the target media object, wherein the playback interface includes at least media object information, an associated image, a background image, and a mask image of specified transparency, wherein the associated image is an image associated with the target media object, the background image is an image used as the background in the playback interface, the color of the background image is determined based on the target color in the associated image and the color parameters of the target color, the mask image is superimposed on the background image, the media object information is superimposed on the mask image, and the media object information is information associated with the target media object.

[0103] The media object information may include at least part of the content included in the target media object and / or the introduction information of the target media object. For example, if the target media object is audio, the media object information may include text content (e.g., lyrics) corresponding to the audio. For another example, if the target media object is a video, the media object information may include subtitles corresponding to the video.

[0104] As a method, the playback interface may also include controls for controlling playback. For example, a sliding control and a media switching control may be included. The sliding control may be used to control the progress of media playback. The media switching control may be used to switch the currently playing media object.

[0105] For example, Fig.14 As shown, in Fig.14 In the playing interface shown, media object information is displayed in area 81 of the playing interface, and controls for controlling the playing are displayed in area 82. The dotted boxes corresponding to area 81 and area 82 are only used to identify the ranges where area 81 and area 82 are located. When the playing interface is displayed, the dotted boxes corresponding to area 81 and area 82 may not be displayed.

[0106] In the case where the playback interface also includes a mask image with a specified transparency, the layering of the playback interface can be as follows: Fig.15 As shown. Fig.15In the case shown, the playback interface may include an information layer 30, a mask layer 33, a rhythm layer 32, and a background layer 31. Among them, the background layer 31 is at the bottom layer, the rhythm layer 32 is stacked on the background layer 31, the mask layer 33 is stacked on the rhythm layer 32, and the information layer 30 is stacked on the mask layer 33. Because the mask image configured in the mask layer 33 is transparent, the content in the layer below the mask layer can still be displayed on the screen. Optionally, the color of the mask image can be a darker color (for example, black), so that it is convenient for users to identify the media object information in the information layer 30.

[0107] In the embodiment of the present application, the specified transparency is used to characterize that the corresponding image (e.g., mask image) is between completely transparent and completely opaque. Optionally, when completely transparent is understood as the transparency of the image is 100, and completely opaque is understood as the transparency of the image is 0, the specified transparency can be a value between 0 and 100 (excluding 0 and 100). There is no specific limitation on the specific value of the specified transparency. For example, the specified transparency can be 30%, 35%, or 40%.

[0108] The interface display method provided in this embodiment can flexibly set the background image in the playback interface through the above method, and the set background image can have a certain correlation with the associated image. In addition, in this embodiment, when the playback interface can display the media object information, a transparent mask image is added between the media object information and the background image, so that when the displayed background image can be displayed normally, it is also conducive to clearly displaying the media object information.

[0109] See also Fig.16 The present application provides an interface display device 500, which runs on an electronic device. The device 500 includes:

[0110] The interface display unit 510 is used to display the playback interface of the target media object.

[0111] Among them, the playback interface includes at least an associated image and a background image, wherein the associated image is an image associated with the target media object, and the background image is an image used as the background in the playback interface, and the color of the background image is determined according to the target color in the associated image and the color parameters of the target color.

[0112] As a method, the interface display unit 510 is specifically used to compare the saturation of the target color with the saturation threshold to obtain a first comparison result, and compare the brightness of the target color with the brightness threshold to obtain a second comparison result; determine the color of the background image based on the first comparison result, the second comparison result and the target color.

[0113] Optionally, the saturation threshold includes a first saturation threshold, the brightness threshold includes a first brightness threshold and a second brightness threshold, and the second brightness threshold is less than the first brightness threshold. The interface display unit 510 is specifically configured to determine the color of the background image based on the first saturation threshold and the first brightness threshold if the saturation of the target color is greater than or equal to the first saturation threshold, and the brightness of the target color is greater than or equal to the first brightness threshold; if the saturation of the target color is greater than or equal to the first saturation threshold, and the brightness of the target color is between the first brightness threshold and the second brightness threshold, use the target color as the color of the background image;

[0114] If the saturation of the target color is greater than or equal to the first saturation threshold, and the brightness of the target color is less than the second brightness threshold, the color of the background image is determined based on the saturation of the target color and the second brightness threshold.

[0115] Optionally, the saturation threshold includes a first saturation threshold and a second saturation threshold, the brightness threshold includes a first brightness threshold and a third brightness threshold, and the first brightness threshold is less than the third brightness threshold. The interface display unit 510 is specifically used to determine the color of the background image based on the saturation of the target color and the third brightness threshold if the saturation of the target color is greater than the second saturation threshold and less than the first saturation threshold, and the brightness of the target color is greater than or equal to the third brightness threshold; if the saturation of the target color is greater than the second saturation threshold and less than the first saturation threshold, and the brightness of the target color is between the first brightness threshold and the third brightness threshold, then the target color is used as the color of the background image; if the saturation of the target color is greater than the second saturation threshold and less than the first saturation threshold, and the brightness of the target color is less than or equal to the first brightness threshold, then the color of the background image is determined based on the saturation of the target color and the first brightness threshold.

[0116] Optionally, the saturation threshold includes a second saturation threshold, the brightness threshold includes a first brightness threshold and a third brightness threshold, and the first brightness threshold is less than the third brightness threshold. The interface display unit 510 is specifically used to determine the color of the background image based on the second saturation threshold and the third brightness threshold if the saturation of the target color is less than or equal to the second saturation threshold, and the brightness of the target color is greater than or equal to the third brightness threshold; if the saturation of the target color is less than or equal to the second saturation threshold, and the brightness of the target color is between the first brightness threshold and the third brightness threshold, then determine the color of the background image based on the second saturation threshold and the brightness of the target color; if the saturation of the target color is greater than the second saturation threshold and less than the saturation threshold, and the brightness of the target color is less than or equal to the first brightness threshold, then determine the color of the background image based on the second saturation threshold and the first brightness threshold.

[0117] As a method, the playback interface also includes dynamic elements, which are stacked on the background image. The dynamic elements are elements that can change dynamically when displayed.

[0118] Optionally, the interface display unit 510 is specifically used to use the contrasting color of the target color as the color of the dynamic element. Optionally, the interface display unit 510 is specifically used to use the contrasting color of the target color as the color of the dynamic element if the colors included in the associated image have the contrasting color of the target color; if the colors included in the associated image do not have the contrasting color of the target color, use the color obtained by adjusting the brightness of the reference color as the color of the dynamic element, where the reference color is a color included in the associated image, the brightness difference of which satisfies the first difference condition with the target color.

[0119] Optionally, the interface display unit 510 is specifically used to use the contrasting color of the target color as the color of the dynamic element if the difference between the brightness of the contrasting color of the target color and the brightness of the target color satisfies a second difference condition; if the difference between the brightness of the contrasting color of the target color and the brightness of the target color does not satisfy the second difference condition, adjust the brightness of the contrasting color and use the color obtained after the brightness adjustment as the color of the dynamic element, wherein the difference between the brightness of the color obtained after the brightness adjustment and the brightness of the target color satisfies the second difference condition.

[0120] Optionally, the interface display unit 510 is specifically configured to determine the frequency of changes in the dynamic element according to the rhythm of the audio.

[0121] The interface display device provided in this embodiment realizes flexible setting of the background image in the playback interface, and also enables the set background image to have a certain correlation with the associated image.

[0122] It should be noted that the device embodiments in the present application correspond to the aforementioned method embodiments, and the specific implementation principles of each unit in the device embodiments are similar to the principles in the aforementioned method embodiments. The specific contents in the device embodiments can be found in the method embodiments, and will not be repeated in the device embodiments.

[0123] The following will be combined Fig.17 An electronic device provided by the present application is described.

[0124] See also Fig.17Based on the above interface display method and device, the embodiment of the present application also provides an electronic device 1000 that can execute the above interface display method. The electronic device 1000 includes one or more (only one is shown in the figure) processors 105, a memory 104, an audio playback module 106 and an audio acquisition device 108 that are coupled to each other. Among them, the memory 104 stores a program that can execute the content of the above embodiment, and the processor 105 can execute the program stored in the memory 104.

[0125] Among them, the processor 105 may include one or more processing cores. The processor 105 uses various interfaces and lines to connect various parts of the entire electronic device 1000, and executes various functions and processes data of the electronic device 1000 by running or executing instructions, programs, code sets or instruction sets stored in the memory 104, and calling data stored in the memory 104. Optionally, the processor 105 can be implemented in at least one hardware form of digital signal processing (Digital Signal Processing, DSP), field programmable gate array (Field-Programmable Gate Array, FPGA), and programmable logic array (Programmable Logic Array, PLA). The processor 105 can integrate one or a combination of a central processing unit (Central Processing Unit, CPU), a graphics processing unit (Graphics Processing Unit, GPU) and a modem. Among them, the CPU mainly processes the operating system, user interface and application programs; the GPU is responsible for rendering and drawing display content; and the modem is used to process wireless communications. It can be understood that the above-mentioned modem may not be integrated into the processor 105, but may be implemented separately through a communication chip.

[0126] The memory 104 may include a random access memory (RAM) or a read-only memory (ROM). The memory 104 may be used to store instructions, programs, codes, code sets or instruction sets. The memory 104 may include a program storage area and a data storage area, wherein the program storage area may store instructions for implementing an operating system, instructions for implementing at least one function (such as a touch function, a sound playback function, an image playback function, etc.), instructions for implementing the following various method embodiments, etc.

[0127] Furthermore, in addition to the aforementioned components, the electronic device 1000 may further include a network module 110 and a sensor module 112 .

[0128] The network module 110 is used to realize information interaction between the electronic device 1000 and other devices. For example, a connection can be established with other audio playback devices or other electronic devices, and information interaction is performed based on the established connection. As a way, the network module 110 of the electronic device 1000 is a radio frequency module, which is used to receive and send electromagnetic waves, realize the mutual conversion of electromagnetic waves and electrical signals, and thus communicate with a communication network or other devices. The radio frequency module may include various existing circuit elements for performing these functions, such as antennas, radio frequency transceivers, digital signal processors, encryption / decryption chips, user identity modules (SIM) cards, memories, etc. For example, the radio frequency module can interact with external devices through electromagnetic waves sent or received.

[0129] The sensor module 112 may include at least one sensor. Specifically, the sensor module 112 may include but is not limited to: a pressure sensor, a motion sensor, an acceleration sensor, and other sensors.

[0130] Among them, the pressure sensor may be a sensor that detects the pressure generated by pressing on the electronic device 1000. That is, the pressure sensor detects the pressure generated by contact or pressing between the user and the electronic device 1000, for example, the pressure generated by contact or pressing between the user's ear and the electronic device 1000. Therefore, the pressure sensor can be used to determine whether contact or pressing occurs between the user and the electronic device 1000, and the magnitude of the pressure.

[0131] Among them, the acceleration sensor can detect the magnitude of acceleration in all directions (generally three axes), and can detect the magnitude and direction of gravity when stationary, and can be used for applications that recognize the posture of the electronic device 1000 (such as horizontal and vertical screen switching, related games, magnetometer posture calibration), vibration recognition related functions (such as pedometer, tapping), etc. In addition, the electronic device 1000 can also be equipped with other sensors such as gyroscopes, barometers, hygrometers, thermometers, etc., which will not be repeated here.

[0132] The audio collection device 108 is used to collect audio signals. Optionally, the audio collection device 108 includes a plurality of audio collection devices, which may be microphones.

[0133] Please refer to Fig.18 , which shows a structural block diagram of a computer-readable storage medium provided in an embodiment of the present application. The computer-readable medium 1100 stores program codes, which can be called by a processor to execute the method described in the above method embodiment.

[0134] The computer readable storage medium 1100 may be an electronic memory such as a flash memory, an EEPROM (electrically erasable programmable read-only memory), an EPROM, a hard disk, or a ROM. Optionally, the computer readable storage medium 1100 includes a non-transitory computer-readable storage medium. The computer readable storage medium 1100 has storage space for program code 1110 that executes any method step in the above method. These program codes can be read from or written to one or more computer program products. The program code 1110 can be compressed, for example, in an appropriate form.

[0135] In the description of this specification, the description with reference to the terms "one embodiment", "some embodiments", "example", "specific example", or "some examples" etc. means that the specific features, structures, materials or characteristics described in conjunction with the embodiment or example are included in at least one embodiment or example of the present application. In this specification, the schematic representations of the above terms do not necessarily refer to the same embodiment or example. Moreover, the specific features, structures, materials or characteristics described may be combined in any one or more embodiments or examples in a suitable manner. In addition, those skilled in the art may combine and combine the different embodiments or examples described in this specification and the features of the different embodiments or examples, without contradiction.

[0136] In addition, the terms "first" and "second" are used for descriptive purposes only and should not be understood as indicating or implying relative importance or implicitly indicating the number of the indicated technical features. Therefore, the features defined as "first" and "second" may explicitly or implicitly include at least one of the features. In the description of this application, the meaning of "plurality" is at least two, such as two, three, etc., unless otherwise clearly and specifically defined.

[0137] Any process or method description in a flowchart or otherwise described herein may be understood to represent a module, segment or portion of code that includes one or more executable instructions for implementing the steps of a specific logical function or process, and the scope of the preferred embodiments of the present application includes alternative implementations in which functions may not be performed in the order shown or discussed, including performing functions in a substantially simultaneous manner or in the reverse order depending on the functions involved, which should be understood by technicians in the technical field to which the embodiments of the present application belong.

[0138] The logic and / or steps represented in the flowchart or otherwise described herein, for example, can be considered as an ordered list of executable instructions for implementing logical functions, which can be embodied in any computer-readable medium for use by an instruction execution system, apparatus or device (such as a computer-based system, a system including a processor or other system that can fetch instructions from an instruction execution system, apparatus or device and execute instructions), or used in combination with these instruction execution systems, apparatuses or devices.

[0139] It should be understood that the various parts of the present application can be implemented by hardware, software, firmware or a combination thereof. In the above-mentioned embodiments, multiple steps or methods can be implemented by software or firmware stored in a memory and executed by a suitable instruction execution system. For example, if implemented by hardware, as in another embodiment, it can be implemented by any one of the following technologies known in the art or their combination: a discrete logic circuit having a logic gate circuit for implementing a logic function for a data signal, a dedicated integrated circuit having a suitable combination of logic gate circuits, a programmable gate array (PGA), a field programmable gate array (FPGA), etc.

[0140] In summary, the interface display method, device and electronic device provided by the present application can display the playback interface of the target media object when a target media object is selected, and the displayed playback interface includes at least an associated image and a background image, wherein the color of the background image is determined according to the target color in the associated image and the color parameters of the target color. Thus, through the above-mentioned method, when the playback interface of the target media object is displayed, in the case where the associated image of the target media object is displayed in the playback interface, the color of the background image in the playback interface can be determined according to the target color in the associated image displayed together in the playback interface and the color parameters of the target color, thereby realizing the flexible setting of the background image in the playback interface, and also making the set background image have a certain correlation with the associated image.

[0141] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present application, rather than to limit it. Although the present application has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that they can still modify the technical solutions described in the aforementioned embodiments, or make equivalent replacements for some of the technical feature diagrams therein. However, these modifications or replacements do not cause the essence of the corresponding technical solutions to deviate from the spirit and scope of the technical solutions of the embodiments of the present application.

Claims

1. An interface display method, characterized in that: Applied to electronic equipment, the method comprises: Display the playback interface of the target media object; Among them, the playback interface includes at least an associated image and a background image, wherein the associated image is an image associated with the target media object, and the background image is an image used as the background in the playback interface, and the color of the background image is determined based on the target color in the associated image and the color parameters of the target color.

2. The method according to claim 1, characterized in that The method further comprises: Comparing the color parameter with the corresponding parameter threshold to obtain a comparison result; The color of the background image is determined according to the comparison result and the target color.

3. The method according to claim 2, characterized in that The color parameter includes saturation and brightness, the parameter threshold includes a saturation threshold and a brightness threshold, and the color parameter is compared with the corresponding parameter threshold to obtain a comparison result, including: Comparing the saturation of the target color with the saturation threshold to obtain a first comparison result, and comparing the brightness of the target color with the brightness threshold to obtain a second comparison result; The step of determining the color of the background image according to the comparison result and the target color includes: The color of the background image is determined according to the first comparison result, the second comparison result and the target color.

4. The method according to claim 3, characterized in that The saturation threshold includes a first saturation threshold, the brightness threshold includes a first brightness threshold and a second brightness threshold, and the second brightness threshold is less than the first brightness threshold; and determining the color of the background image according to the first comparison result, the second comparison result and the target color includes: If the saturation of the target color is greater than or equal to a first saturation threshold, and the brightness of the target color is greater than or equal to a first brightness threshold, determining the color of the background image based on the first saturation threshold and the first brightness threshold; If the saturation of the target color is greater than or equal to a first saturation threshold, and the brightness of the target color is between the first brightness threshold and a second brightness threshold, the target color is used as the color of the background image; If the saturation of the target color is greater than or equal to the first saturation threshold, and the brightness of the target color is less than the second brightness threshold, the color of the background image is determined based on the saturation of the target color and the second brightness threshold.

5. The method according to claim 3, characterized in that: The saturation threshold includes a first saturation threshold and a second saturation threshold, the brightness threshold includes a first brightness threshold and a third brightness threshold, and the first brightness threshold is less than the third brightness threshold; determining the color of the background image according to the first comparison result, the second comparison result and the target color, includes: If the saturation of the target color is greater than the second saturation threshold and less than the first saturation threshold, and the brightness of the target color is greater than or equal to a third brightness threshold, then determining the color of the background image based on the saturation of the target color and the third brightness threshold; If the saturation of the target color is greater than the second saturation threshold and less than the first saturation threshold, and the brightness of the target color is between the first brightness threshold and the third brightness threshold, the target color is used as the color of the background image; If the saturation of the target color is greater than the second saturation threshold and less than the first saturation threshold, and the brightness of the target color is less than or equal to the first brightness threshold, the color of the background image is determined based on the saturation of the target color and the first brightness threshold.

6. The method according to claim 3, characterized in that The saturation threshold includes a second saturation threshold, the brightness threshold includes a first brightness threshold and a third brightness threshold, and the first brightness threshold is less than the third brightness threshold; and determining the color of the background image according to the first comparison result, the second comparison result and the target color includes: If the saturation of the target color is less than or equal to the second saturation threshold, and the brightness of the target color is greater than or equal to a third brightness threshold, determining the color of the background image based on the second saturation threshold and the third brightness threshold; If the saturation of the target color is less than or equal to the second saturation threshold, and the brightness of the target color is between the first brightness threshold and the third brightness threshold, then determining the color of the background image based on the second saturation threshold and the brightness of the target color; If the saturation of the target color is greater than the second saturation threshold and less than the first saturation threshold, and the brightness of the target color is less than or equal to the first brightness threshold, the color of the background image is determined based on the second saturation threshold and the first brightness threshold.

7. The method according to claim 1, characterized in that The color parameter includes at least one of hue, saturation and brightness.

8. The method according to any one of claims 1 to 7, characterized in that: The playback interface further includes a dynamic element, which is stacked on the background image. The dynamic element is an element that can be dynamically changed when displayed.

9. The method according to claim 8, characterized in that The method further comprises: A contrasting color of the target color is used as the color of the dynamic element.

10. The method according to claim 8, characterized in that The method further comprises: If a contrasting color of the target color exists in the colors included in the associated image, the contrasting color of the target color is used as the color of the dynamic element; If there is no contrasting color of the target color among the colors included in the associated image, the color obtained by adjusting the brightness of the reference color is used as the color of the dynamic element, wherein the reference color is the target color, or the reference color is a color included in the associated image whose brightness difference with the target color satisfies a first difference condition.

11. The method according to claim 10, characterized in that The method further comprises: If the brightness of the contrasting color of the target color and the brightness of the target color meet a second difference condition, the contrasting color of the target color is used as the color of the dynamic element; If the brightness of the contrasting color of the target color does not satisfy the second difference condition with the brightness of the target color, the brightness of the contrasting color is adjusted, and the color obtained after adjusting the brightness is used as the color of the dynamic element, wherein the brightness of the color obtained after adjusting the brightness and the difference between the brightness of the target color satisfy the second difference condition.

12. The method according to claim 8, characterized in that The target media object includes audio, and the method further includes: The frequency of the change of the dynamic element is determined according to the rhythm of the audio.

13. The method according to any one of claims 1 to 7, characterized in that: The playback interface also includes media object information and a mask image of a specified transparency, wherein the mask image is superimposed on the background image, and the media object information is superimposed on the mask image, and the media object information is information associated with the target media object.

14. The method according to any one of claims 1 to 7, characterized in that: The target color is the color that accounts for the largest proportion of the colors included in the associated image.

15. An interface display device, characterized in that: Running on an electronic device, the device comprises: An interface display unit, used to display the playback interface of the target media object; Among them, the playback interface includes at least an associated image and a background image, wherein the associated image is an image associated with the target media object, and the background image is an image used as the background in the playback interface, and the color of the background image is determined based on the target color in the associated image and the color parameters of the target color.

16. An electronic device, characterized in that: comprising one or more processors and memory; One or more programs are stored in the memory and configured to be executed by the one or more processors, and the one or more programs are configured to execute the method according to any one of claims 1 to 14.

17. A computer-readable storage medium storing a program code executable by a processor, characterized in that: The computer-readable storage medium includes stored program code, wherein when the program code is executed, the method according to any one of claims 1 to 14 is executed.