Image display, image processing methods, apparatus and equipment

Abstract

This application provides an image display and image processing method, apparatus, and device. The method includes: a terminal device acquiring an image search instruction, the image search instruction including first search conditions; and displaying multiple images corresponding to the first search conditions on a first interface according to the image search instruction. The first interface includes at least two display areas, each display area for displaying at least one image, and the dominant color of the images displayed in each display area is within the same color range. Through this process, images with the same or similar dominant color are displayed in the same display area, which can improve the image display effect.

Description

Technical Field

[0001] This application relates to the field of image technology, and in particular to an image display, image processing method, apparatus and device. Background Technology

[0002] With the development of terminal and image technologies, users are increasingly obtaining information through images. In various scenarios, terminal devices need to display multiple images. For example, in image search or recommendation scenarios, the terminal device needs to display multiple images from the search results or recommendations; in image library or topic library scenarios, the terminal device needs to display multiple images from the image library or topic library.

[0003] In related technologies, when displaying multiple images, terminal devices typically display them in a fixed order. For example, when displaying multiple images from a gallery or topic library, they are displayed in the order they were captured. Similarly, when displaying multiple images from search results or recommendations, they are displayed in descending order of search relevance or recommendation relevance.

[0004] However, the image display effect of the aforementioned related technologies is not good. Summary of the Invention

[0005] This application provides an image display, image processing method, apparatus, and device to improve image display effects.

[0006] Firstly, this application provides an image display method, the execution subject of which can be a terminal device, or a chip or processor in the terminal device. The following description uses a terminal device as the execution subject. The method includes: the terminal device acquiring an image search instruction, the image search instruction including a first search condition; and displaying multiple images corresponding to the first search condition in a first interface according to the image search instruction; wherein the first interface includes at least two display areas, each display area for displaying at least one image, and the dominant color of the images displayed in each display area is within the same color range. Another way to express "the dominant color of the images displayed in each display area is within the same color range" is "the dominant color of the images displayed in each display area is the same or similar."

[0007] In the above process, because the main color tone of the images displayed in each display area is within the same color range, the images in each display area are arranged neatly and aesthetically. This solves the problem of cluttered image display and improves the image display effect. Furthermore, it allows users to quickly and easily locate the image they need.

[0008] In one possible implementation, the hue ranges corresponding to the at least two display areas are arranged according to a preset hue order. This preset hue order can be a predefined hue order. Optionally, the preset hue order is a hue order indicated by a clockwise direction on the color wheel. That is, the hue ranges corresponding to the at least two display areas are arranged according to a hue order indicated by a clockwise direction on the color wheel. Optionally, the preset hue order is a hue order indicated by a counter-clockwise direction on the color wheel. That is, the hue ranges corresponding to the at least two display areas are arranged according to a hue order indicated by a counter-clockwise direction on the color wheel.

[0009] In the above method, since the color wheel is arranged according to the visual perception characteristics of different hues, in the first interface, the hue ranges corresponding to different display areas are arranged in the order of hues indicated by the clockwise / counterclockwise direction of the color wheel. This makes it so that when users view the images in the first interface, they will not feel that the hues jump too much, thereby further improving the display effect of the first interface on the images.

[0010] In one possible implementation, for any display area, when the number of images displayed in the display area is multiple, the dominant color tones of the images displayed in the display area are arranged according to a preset color tone order. Optionally, the preset color tone order is the color tone order indicated by a clockwise direction on the color wheel. That is, the dominant color tones of the images displayed in each display area are arranged according to the color tone order indicated by a clockwise direction on the color wheel. Alternatively, the preset color tone order can be the color tone order indicated by a counter-clockwise direction on the color wheel. That is, the dominant color tones of the images displayed in each display area are arranged according to the color tone order indicated by a counter-clockwise direction on the color wheel.

[0011] In the above method, since the color wheel is arranged according to the visual perception characteristics of different hues, the main hue of each image in each display area is arranged in the order of hues indicated by the clockwise / counterclockwise direction of the color wheel. This ensures that when the user views the images in each display area, they will not feel that the hues jump too much, thereby further improving the display effect of the first interface on the images.

[0012] In one possible implementation, each display area is a rectangular area, which is used to display N rows or N columns of images, where N is an integer greater than or equal to 1. In this way, each display area corresponds to N rows or N columns of images, which can further improve the image display effect.

[0013] In one possible implementation, the terminal device may display multiple images corresponding to the first search condition on a first interface in the following manner: according to the image search instruction, obtain an image set and image display information, wherein the images in the image set satisfy the first search condition, and the image display information includes: the display area corresponding to each image in the image set and the display position of each image in the display area; according to the image display information, display the multiple images on the first interface, wherein the multiple images are all or part of the images in the image set.

[0014] In one possible implementation, the terminal device sends a search request to the server, the search request including the first search condition; the terminal device receives address information of images in the image set and image display information from the server; and obtains the image set based on the address information.

[0015] In the above implementation, after the server retrieves the image set based on the search request, it generates image display information based on the image set and sends the image display information to the terminal device. The terminal device only needs to display the image based on the image display information to achieve the aforementioned display effect. This method reduces the computational requirements of the terminal device.

[0016] In one possible implementation, the terminal device sends a search request to the server, the search request including the first search condition; the terminal device receives address information of images in the image set from the server, and obtains the image set according to the address information, the images in the image set are arranged according to their relevance to the first search condition; the terminal device determines the image display information according to the dominant color tone of the images in the image set.

[0017] In the above implementation, after the server retrieves the image set based on the search request, it sends the image set to the terminal device. The terminal device then generates image display information based on the image set and displays the image based on that information to achieve the aforementioned display effect. This method increases the flexibility of the terminal device implementation.

[0018] In one possible implementation, when the terminal device determines image display information based on the dominant color tone of the images in the image set, the following method can be used: The images in the image set are grouped according to their arrangement order to obtain multiple groups of images; for each group of images, the images in that group are reordered based on their dominant color tone to obtain a dominant color tone sorting result; and the display information for that group of images is determined based on the dominant color tone sorting result, wherein the display information includes the display area corresponding to each image in the group and the display position of each image in the display area; and the image display information is generated based on the display information of the multiple groups of images.

[0019] In the above method, when determining image display information, the images in the image set are first grouped according to their arrangement order, resulting in multiple groups. Within each group, the images are reordered based on their dominant color tone. This optimizes the image display effect while largely preserving the original order. Thus, when presenting search results on the first interface, the general search relevance information is still retained, without reducing the efficiency of users locating the desired image in the search results.

[0020] In one possible implementation, for the first group of images, the dominant color sorting result of the first group of images can be obtained as follows: determine the position of the dominant color of each image in the first group of images in the color wheel; based on the position of the dominant color of each image in the first group of images in the color wheel, take the position of the first image in the first group of images in the color wheel as the starting point, and reorder the images in the first group of images in a clockwise or counterclockwise direction according to the color wheel to obtain the dominant color sorting result of the first group of images.

[0021] In the above method, by taking the position of the first image in the first group of images on the color wheel as the starting point, it is ensured that the image with the highest search relevance can be displayed in the first image position.

[0022] In one possible implementation, for the i-th group of images, where i is an integer greater than 1, the dominant color sorting result of the i-th group of images can be obtained as follows: determine the position of the dominant color of each image in the i-th group of images in the color wheel; based on the position of the dominant color of each image in the i-th group of images in the color wheel, taking the position of the last image in the (i-1)-th group of images in the color wheel as the starting point, reorder the images in the i-th group of images in a clockwise or counterclockwise direction according to the color wheel to obtain the dominant color sorting result of the i-th group of images.

[0023] In the above method, the position of the last image in the (i-1)th group on the color wheel is used as the starting point, ensuring a smooth transition of the main color tone between the i-th group and the (i-1)th group, preventing any abrupt color tone changes in the first interface. Thus, when the user scrolls up and down to browse multiple screens of images, the overall color tone range is arranged cyclically according to the color tone order indicated by the clockwise direction of the color wheel, further improving the image display effect of the first interface.

[0024] Secondly, this application provides an image display method, the execution subject of which can be a terminal device, or a chip or processor in the terminal device. The following description uses a terminal device as the execution subject. The method includes: the terminal device displaying images from an image library in a first display order on a first interface; obtaining an image rearrangement instruction; and, according to the image rearrangement instruction, displaying the images from the image library in a second display order on the first interface; wherein, when displaying the images from the image library in the second display order, the first interface includes at least two display areas, each display area being used to display at least one image, and the dominant color of the images displayed in each display area being within the same color range.

[0025] In the above process, because the main color tone of the images displayed in each display area is within the same color range, the images in each display area are arranged neatly and aesthetically. This solves the problem of cluttered image display and improves the image display effect. Furthermore, it allows users to quickly and easily locate the image they need.

[0026] In one possible implementation, the hue ranges corresponding to the at least two display areas are arranged according to a preset hue order. This preset hue order can be a predefined hue order. Optionally, the preset hue order is a hue order indicated by a clockwise direction on the color wheel. That is, the hue ranges corresponding to the at least two display areas are arranged according to a hue order indicated by a clockwise direction on the color wheel. Optionally, the preset hue order is a hue order indicated by a counter-clockwise direction on the color wheel. That is, the hue ranges corresponding to the at least two display areas are arranged according to a hue order indicated by a counter-clockwise direction on the color wheel.

[0027] In the above method, since the color wheel is arranged according to the visual perception characteristics of different hues, in the first interface, the hue ranges corresponding to different display areas are arranged in the order of hues indicated by the clockwise / counterclockwise direction of the color wheel. This makes it so that when users view the images in the first interface, they will not feel that the hues jump too much, thereby further improving the display effect of the first interface on the images.

[0028] In one possible implementation, for any display area, when the number of images displayed in the display area is multiple, the dominant color tones of the images displayed in the display area are arranged according to a preset color tone order. Optionally, the preset color tone order is the color tone order indicated by a clockwise direction on the color wheel. That is, the dominant color tones of the images displayed in each display area are arranged according to the color tone order indicated by a clockwise direction on the color wheel. Alternatively, the preset color tone order can be the color tone order indicated by a counter-clockwise direction on the color wheel. That is, the dominant color tones of the images displayed in each display area are arranged according to the color tone order indicated by a counter-clockwise direction on the color wheel.

[0029] In the above method, since the color wheel is arranged according to the visual perception characteristics of different hues, the main hue of each image in each display area is arranged in the order of hues indicated by the clockwise / counterclockwise direction of the color wheel. This ensures that when the user views the images in each display area, they will not feel that the hues jump too much, thereby further improving the display effect of the first interface on the images.

[0030] In one possible implementation, each display area is a rectangular area, which is used to display N rows or N columns of images, where N is an integer greater than or equal to 1. In this way, each display area corresponds to N rows or N columns of images, which can further improve the image display effect.

[0031] In one possible implementation, the first display order can be any of the following: the order of image capture time; the order of image reception time; the order of image selection time; the order of correlation between images and preset conditions; and the preset color tone order.

[0032] In one possible implementation, obtaining the image rearrangement instruction includes: detecting a first user operation in the first interface, wherein the first user operation is any one of the following operations: icon click operation, interface zoom operation, and image filtering operation; or, detecting a change in the number of images in the image library.

[0033] In one possible implementation, displaying images from the image library in a second display order on the first interface according to the image rearrangement instruction includes: acquiring images from the image library according to the image rearrangement instruction; determining image display information based on the dominant color tone of the images in the image library, the image display information including: the display area corresponding to each image in the image library on the first interface, and the display position of each image in the display area; and displaying the images from the image library on the first interface according to the image display information.

[0034] In one possible implementation, determining image display information based on the dominant color tone of the images in the image library includes: grouping the images in the image library according to their arrangement order to obtain multiple groups of images; for each group of images, reordering the images in that group based on their dominant color tone to obtain a dominant color tone sorting result; determining the display information for that group of images based on the dominant color tone sorting result, wherein the display information includes the display area corresponding to each image in the group and the display position of each image in the display area; and generating the image display information based on the display information of the multiple groups of images.

[0035] In the above method, when determining the image display information, the images in the image library are first grouped according to the arrangement order of the images in the image library to obtain multiple groups of images. Within each group of images, the images in the group are reordered according to the main color tone of the images in that group. Thus, the image display effect is optimized while largely retaining the original order.

[0036] In one possible implementation, for a first group of images, the images in the first group of images are reordered according to their dominant color to obtain a dominant color sorting result. This includes: determining the position of the dominant color of each image in the first group of images on the color wheel; and, based on the position of the dominant color of each image in the first group of images on the color wheel, reordering the images in the first group of images clockwise or counterclockwise according to the position of the first image in the first group of images on the color wheel, to obtain a dominant color sorting result for the first group of images.

[0037] In one possible implementation, for the i-th group of images, where i is an integer greater than 1, the images in the group are reordered according to their dominant color to obtain a dominant color sorting result. This includes: determining the position of the dominant color of each image in the i-th group on the color wheel; and, based on the position of the dominant color of each image in the i-th group on the color wheel, reordering the images in the i-th group in a clockwise or counterclockwise direction according to the position of the last image in the (i-1)-th group on the color wheel to obtain a dominant color sorting result.

[0038] In the above method, the position of the last image in the (i-1)th group on the color wheel is used as the starting point, ensuring a smooth transition of the main color tone between the i-th group and the (i-1)th group, preventing any abrupt color tone changes in the first interface. Thus, when the user scrolls up and down to browse multiple screens of images, the overall color tone range is arranged cyclically according to the color tone order indicated by the clockwise direction of the color wheel, further improving the image display effect of the first interface.

[0039] Thirdly, this application provides an image processing method, the execution subject of which can be a server, or a chip or processor within the server. The server can be a cloud server. The following description uses a server as the execution subject as an example.

[0040] The method includes: a server acquiring an image set; the server generating image display information based on the dominant color tone of the images in the image set, the image display information including: a display area corresponding to each image in the image set in a first interface and the display position of each image in the display area; the server sending address information of the images in the image set and the image display information to a terminal device, the image display information being used to instruct the terminal device to display multiple images in the image set in the first interface, the first interface including at least two display areas, each display area being used to display at least one image, and the dominant color tone of the images displayed in each display area being within the same color tone range. Alternatively, "the dominant color tone of the images displayed in each display area is within the same color tone range" can be expressed as "the dominant color tone of the images displayed in each display area is the same or similar".

[0041] In the above process, because the main color tone of the images displayed in each display area is within the same color range, the images in each display area are arranged neatly and aesthetically. This solves the problem of cluttered image display and improves the image display effect. Furthermore, it allows users to quickly and easily locate the image they need.

[0042] In one possible implementation, the hue ranges corresponding to the at least two display areas are arranged according to a preset hue order. This preset hue order can be a predefined hue order. Optionally, the preset hue order is a hue order indicated by a clockwise direction on the color wheel. That is, the hue ranges corresponding to the at least two display areas are arranged according to a hue order indicated by a clockwise direction on the color wheel. Optionally, the preset hue order is a hue order indicated by a counter-clockwise direction on the color wheel. That is, the hue ranges corresponding to the at least two display areas are arranged according to a hue order indicated by a counter-clockwise direction on the color wheel.

[0043] In the above method, since the color wheel is arranged according to the visual perception characteristics of different hues, in the first interface, the hue ranges corresponding to different display areas are arranged in the order of hues indicated by the clockwise / counterclockwise direction of the color wheel. This makes it so that when users view the images in the first interface, they will not feel that the hues jump too much, thereby further improving the display effect of the first interface on the images.

[0044] In one possible implementation, for any display area, when the number of images displayed in the display area is multiple, the dominant color tones of the images displayed in the display area are arranged according to a preset color tone order. Optionally, the preset color tone order is the color tone order indicated by a clockwise direction on the color wheel. That is, the dominant color tones of the images displayed in each display area are arranged according to the color tone order indicated by a clockwise direction on the color wheel. Alternatively, the preset color tone order can be the color tone order indicated by a counter-clockwise direction on the color wheel. That is, the dominant color tones of the images displayed in each display area are arranged according to the color tone order indicated by a counter-clockwise direction on the color wheel.

[0045] In the above method, since the color wheel is arranged according to the visual perception characteristics of different hues, the main hue of each image in each display area is arranged in the order of hues indicated by the clockwise / counterclockwise direction of the color wheel. This ensures that when the user views the images in each display area, they will not feel that the hues jump too much, thereby further improving the display effect of the first interface on the images.

[0046] In one possible implementation, each display area is a rectangular area, which is used to display N rows or N columns of images, where N is an integer greater than or equal to 1. In this way, each display area corresponds to N rows or N columns of images, which can further improve the image display effect.

[0047] In one possible implementation, generating image display information based on the dominant color tone of the images in the image set includes: grouping the images in the image set according to their arrangement order to obtain multiple groups of images; for each group of images, reordering the images in that group based on their dominant color tone to obtain a dominant color tone sorting result; determining the display information for that group of images based on the dominant color tone sorting result, wherein the display information includes the display area corresponding to each image in the group and the display position of each image in the display area; and generating the image display information based on the display information of the multiple groups of images.

[0048] In one possible implementation, for a first group of images, the images in the first group of images are reordered according to their dominant color to obtain a dominant color sorting result. This includes: determining the position of the dominant color of each image in the first group of images on the color wheel; and, based on the position of the dominant color of each image in the first group of images on the color wheel, reordering the images in the first group of images clockwise or counterclockwise according to the position of the first image in the first group of images on the color wheel, to obtain a dominant color sorting result for the first group of images.

[0049] In one possible implementation, for the i-th group of images, where i is an integer greater than 1, the images in the group are reordered according to their dominant color to obtain a dominant color sorting result. This includes: determining the position of the dominant color of each image in the i-th group on the color wheel; and, based on the position of the dominant color of each image in the i-th group on the color wheel, reordering the images in the i-th group in a clockwise or counterclockwise direction according to the position of the last image in the (i-1)-th group on the color wheel to obtain a dominant color sorting result.

[0050] In one possible implementation, obtaining the image set includes: receiving a search request, the search request including a first search condition; and obtaining the image set according to the first search condition, wherein the images in the image set satisfy the first search condition.

[0051] In one possible implementation, obtaining the image set includes: receiving a recommendation request, the recommendation request including a recommendation type, the recommendation type being any one of the following: recommending based on image popularity, recommending based on user preference features; and obtaining the image set according to the recommendation type.

[0052] Fourthly, this application provides an image display device, which can be the terminal device described in the first aspect, or a device installed in a terminal device. The image display device includes a processing module and a display module. The processing module is configured to acquire an image search instruction, the image search instruction including first search conditions; the display module is configured to display multiple images corresponding to the first search conditions in a first interface according to the image search instruction; wherein the first interface includes at least two display areas, each display area is used to display at least one image, and the main color tone of the images displayed in each display area is within the same color tone range.

[0053] In one possible implementation, the hue ranges corresponding to the at least two display areas are arranged in a preset hue order.

[0054] In one possible implementation, for any display area, when the number of images displayed in the display area is multiple, the main color tones of the images displayed in the display area are arranged according to a preset color tone order.

[0055] In one possible implementation, the preset hue order is the hue order indicated by the color wheel in a clockwise direction; or, the preset hue order is the hue order indicated by the color wheel in a counterclockwise direction.

[0056] In one possible implementation, each display area is a rectangular area, which is used to display N rows or N columns of images, where N is an integer greater than or equal to 1.

[0057] In one possible implementation, the processing module is further configured to: obtain an image set and image display information according to the image search instruction, wherein the images in the image set satisfy the first search condition, and the image display information includes: the display area corresponding to each image in the image set and the display position of each image in the display area; the display module is specifically configured to: display the plurality of images in the first interface according to the image display information, wherein the plurality of images are all or part of the images in the image set.

[0058] In one possible implementation, the processing module is specifically configured to: send a search request to the server, the search request including the first search condition; receive address information of images in the image set and image display information from the server; and obtain the image set based on the address information.

[0059] In one possible implementation, the processing module is specifically configured to: send a search request to a server, the search request including the first search condition; receive address information of images in the image set from the server, and obtain the image set based on the address information, wherein the images in the image set are arranged according to their relevance to the first search condition; and determine the image display information based on the dominant color tone of the images in the image set.

[0060] In one possible implementation, the processing module is specifically used to: group the images in the image set according to the order of the images in the image set to obtain multiple groups of images; for each group of images, reorder the images in the group of images according to the dominant color tone to obtain the dominant color tone sorting result of the group of images, and determine the display information of the group of images according to the dominant color tone sorting result, wherein the display information includes the display area corresponding to each image in the group of images and the display position of each image in the display area; and generate the image display information according to the display information of the multiple groups of images.

[0061] In one possible implementation, for the first group of images, the processing module is specifically used to: determine the position of the dominant color tone of each image in the first group of images in the color wheel; based on the position of the dominant color tone of each image in the first group of images in the color wheel, taking the position of the first image in the first group of images in the color wheel as the starting point, and reordering the images in the first group of images in a clockwise or counterclockwise direction according to the color wheel, to obtain the dominant color tone sorting result of the first group of images.

[0062] In one possible implementation, for the i-th group of images, where i is an integer greater than 1, the processing module is specifically used to: determine the position of the dominant color tone of each image in the i-th group of images in the color wheel; based on the position of the dominant color tone of each image in the i-th group of images in the color wheel, taking the position of the last image in the (i-1)-th group of images in the color wheel as the starting point, and reordering the images in the i-th group of images in a clockwise or counterclockwise direction according to the color wheel, to obtain the dominant color tone sorting result of the i-th group of images.

[0063] Fifthly, this application provides an image display device, which can be the terminal device described in the first aspect, or a device disposed in a terminal device. The image display device includes a processing module and a display module. The display module is used to display images from an image library in a first display order on a first interface; the processing module is used to acquire an image rearrangement instruction; the display module is further used to display images from the image library in a second display order on the first interface according to the image rearrangement instruction; wherein, when displaying images from the image library in the second display order, the first interface includes at least two display areas, each display area is used to display at least one image, and the dominant color of the images displayed in each display area is within the same color range.

[0064] In one possible implementation, the hue ranges corresponding to the at least two display areas are arranged in a preset hue order.

[0065] In one possible implementation, for any display area, when the number of images displayed in the display area is multiple, the main color tones of the images displayed in the display area are arranged according to a preset color tone order.

[0066] In one possible implementation, the preset hue order is the hue order indicated by a clockwise direction on the color wheel; or,

[0067] The preset hue order is the hue order indicated by the color wheel in a counter-clockwise direction.

[0068] In one possible implementation, each display area is a rectangular area, which is used to display N rows or N columns of images, where N is an integer greater than or equal to 1.

[0069] In one possible implementation, the first display order can be any of the following: the order of image capture time; the order of image reception time; the order of image selection time; the order of correlation between images and preset conditions; and the preset color tone order.

[0070] In one possible implementation, the acquisition module is specifically used to: detect a first user operation in the first interface, wherein the first user operation is any one of the following operations: icon click operation, interface zoom operation, and image filtering operation; or, detect a change in the number of images in the image library.

[0071] In one possible implementation, the processing module is further configured to: obtain images from the image library according to the image rearrangement instruction; determine image display information according to the dominant color tone of the images in the image library, the image display information including: the display area corresponding to each image in the image library on the first interface, and the display position of each image in the display area; the display module is specifically configured to display the images from the image library on the first interface according to the image display information.

[0072] In one possible implementation, the processing module is specifically used to: group the images in the image library according to the arrangement order of the images in the image library to obtain multiple groups of images; for each group of images, reorder the images in the group of images according to the dominant color tone of the images in the group of images to obtain the dominant color tone sorting result of the group of images, and determine the display information of the group of images according to the dominant color tone sorting result, the display information including the display area corresponding to each image in the group of images and the display position of each image in the display area; and generate the image display information according to the display information of the multiple groups of images.

[0073] In one possible implementation, for the first group of images, the processing module is specifically used to: determine the position of the dominant color tone of each image in the first group of images in the color wheel; based on the position of the dominant color tone of each image in the first group of images in the color wheel, taking the position of the first image in the first group of images in the color wheel as the starting point, and reordering the images in the first group of images in a clockwise or counterclockwise direction according to the color wheel, to obtain the dominant color tone sorting result of the first group of images.

[0074] In one possible implementation, for the i-th group of images, where i is an integer greater than 1, the processing module is specifically used to: determine the position of the dominant color tone of each image in the i-th group of images in the color wheel; based on the position of the dominant color tone of each image in the i-th group of images in the color wheel, taking the position of the last image in the (i-1)-th group of images in the color wheel as the starting point, and reordering the images in the i-th group of images in a clockwise or counterclockwise direction according to the color wheel, to obtain the dominant color tone sorting result of the i-th group of images.

[0075] Sixthly, this application provides an image processing apparatus, which can be a server or a device installed in a server. The image processing apparatus includes a processing module and a transceiver module. The processing module is used to acquire an image set and generate image display information based on the dominant color tone of the images in the image set. The image display information includes: a display area corresponding to each image in the image set in a first interface and the display position of each image in the display area. The transceiver module is used to send address information of the images in the image set and the image display information to a terminal device. The image display information instructs the terminal device to display multiple images in the image set in the first interface. The first interface includes at least two display areas, each display area is used to display at least one image, and the dominant color tone of the images displayed in each display area is within the same color tone range.

[0076] In one possible implementation, the hue ranges corresponding to the at least two display areas are arranged in a preset hue order.

[0077] In one possible implementation, for any display area, when the number of images displayed in the display area is multiple, the main color tones of the images displayed in the display area are arranged according to a preset color tone order.

[0078] In one possible implementation, the preset hue order is the hue order indicated by the color wheel in a clockwise direction; or, the preset hue order is the hue order indicated by the color wheel in a counterclockwise direction.

[0079] In one possible implementation, each display area is a rectangular area, which is used to display N rows or N columns of images, where N is an integer greater than or equal to 1.

[0080] In one possible implementation, the processing module is specifically used to: group the images in the image set according to the order of the images in the image set to obtain multiple groups of images; for each group of images, reorder the images in the group of images according to the dominant color tone to obtain the dominant color tone sorting result of the group of images, and determine the display information of the group of images according to the dominant color tone sorting result, wherein the display information includes the display area corresponding to each image in the group of images and the display position of each image in the display area; and generate the image display information according to the display information of the multiple groups of images.

[0081] In one possible implementation, for the first group of images, the processing module is specifically used to: determine the position of the dominant color tone of each image in the first group of images in the color wheel; based on the position of the dominant color tone of each image in the first group of images in the color wheel, taking the position of the first image in the first group of images in the color wheel as the starting point, and reordering the images in the first group of images in a clockwise or counterclockwise direction according to the color wheel, to obtain the dominant color tone sorting result of the first group of images.

[0082] In one possible implementation, for the i-th group of images, where i is an integer greater than 1, the processing module is specifically used to: determine the position of the dominant color tone of each image in the i-th group of images in the color wheel; based on the position of the dominant color tone of each image in the i-th group of images in the color wheel, taking the position of the last image in the (i-1)-th group of images in the color wheel as the starting point, and reordering the images in the i-th group of images in a clockwise or counterclockwise direction according to the color wheel, to obtain the dominant color tone sorting result of the i-th group of images.

[0083] In one possible implementation, the transceiver module is further configured to receive a search request, the search request including a first search condition; the processing module is specifically configured to obtain the image set according to the first search condition, wherein the images in the image set satisfy the first search condition.

[0084] In one possible implementation, the transceiver module is further configured to receive a recommendation request, the recommendation request including a recommendation type, which is any one of the following: recommendation based on image popularity, recommendation based on user preference features; the processing module is specifically configured to obtain the image set according to the recommendation type.

[0085] In a seventh aspect, this application provides a terminal device, comprising: a memory and a processor; the processor is configured to be coupled to the memory, read and execute instructions in the memory to implement the method described in any of the first aspects, or to implement the method described in any of the second aspects.

[0086] Eighthly, this application provides a server, including: a memory and a processor; the processor is configured to be coupled to the memory, read and execute instructions in the memory to implement the method described in any of the third aspects.

[0087] Ninthly, this application provides a computer-readable storage medium storing computer instructions that, when executed, implement the method described in any of the first aspects, or implement the method described in any of the second aspects, or implement the method described in any of the third aspects.

[0088] In a tenth aspect, this application provides a computer program product comprising a computer program that, when executed, implements the method described in any of the first aspects, or implements the method described in any of the second aspects, or implements the method described in any of the third aspects.

[0089] This application provides an image display and image processing method, apparatus, and device. The method includes: a terminal device acquiring an image search instruction, the image search instruction including a first search condition; and displaying multiple images corresponding to the first search condition on a first interface according to the image search instruction. The first interface includes at least two display areas, each display area for displaying at least one image, and the dominant color of the images displayed in each display area is within the same color range. Through this process, images with the same or similar dominant color are displayed in the same display area, thus solving the problem of cluttered image display and improving the image display effect. Furthermore, this allows users to quickly and easily locate the image they need. Attached Figure Description

[0090] Figure 1 This is a schematic diagram of an application scenario;

[0091] Figure 2 This is a schematic diagram for another application scenario;

[0092] Figure 3 This is a schematic diagram of yet another application scenario;

[0093] Figure 4 This is a schematic diagram of yet another application scenario;

[0094] Figure 5 A flowchart illustrating an image display method provided in an embodiment of this application;

[0095] Figure 6 A schematic diagram of the display area provided in an embodiment of this application;

[0096] Figure 7 Another schematic diagram of the display area provided in the embodiments of this application;

[0097] Figure 8 A schematic diagram of the hue range based on the color wheel provided for embodiments of this application;

[0098] Figure 9A A schematic diagram illustrating the display effect of a first interface provided in an embodiment of this application;

[0099] Figure 9B A schematic diagram illustrating another display effect of the first interface provided in an embodiment of this application;

[0100] Figure 9C A schematic diagram illustrating yet another display effect of the first interface provided in an embodiment of this application;

[0101] Figure 9D A schematic diagram illustrating yet another display effect of the first interface provided in an embodiment of this application;

[0102] Figure 9E A schematic diagram illustrating yet another display effect of the first interface provided in an embodiment of this application;

[0103] Figure 10 A schematic diagram of the interaction flow of an image display method provided in an embodiment of this application;

[0104] Figure 11 This is a schematic diagram of an image reordering process provided in an embodiment of this application;

[0105] Figure 12 This is a schematic diagram of another image reordering process provided in an embodiment of this application;

[0106] Figure 13 A schematic diagram of the interaction flow of another image display method provided in an embodiment of this application;

[0107] Figure 14 This is a schematic diagram illustrating the image display effect in an image search scenario according to an embodiment of this application;

[0108] Figure 15 This is a schematic diagram illustrating the image display effect in an image recommendation scenario according to an embodiment of this application;

[0109] Figure 16 A flowchart illustrating another image display method provided in an embodiment of this application;

[0110] Figure 17 This is a schematic diagram illustrating an image display effect in a gallery scene according to an embodiment of this application;

[0111] Figure 18 This is a schematic diagram illustrating another image display effect in a gallery scene according to an embodiment of this application;

[0112] Figure 19 This is a schematic diagram illustrating the image display effect in a jigsaw puzzle scenario according to an embodiment of this application;

[0113] Figure 20 This is a schematic diagram of the structure of an image display device provided in an embodiment of this application;

[0114] Figure 21 This is a schematic diagram of the structure of an image processing apparatus provided in an embodiment of this application;

[0115] Figure 22 This is a schematic diagram of the structure of an electronic device provided in an embodiment of this application;

[0116] Figure 23 This is a schematic diagram of the structure of a terminal device provided in an embodiment of this application. Detailed Implementation

[0117] The image display method provided in this application can be applied to any terminal device with image display capabilities, including but not limited to: mobile phones, smart screens, tablet computers, and laptop computers. The accompanying drawings in this application use a mobile phone as an example for illustration.

[0118] To facilitate understanding, the concepts or terms involved in the embodiments of this application will be explained first.

[0119] Image search is a specialized search engine system that provides users with retrieval services for relevant graphic and image information on the internet by searching for image text or visual features. It is a sub-category of search engines. One method involves entering keywords similar to the image name or content; this is called keyword image search. Another method allows users to upload images similar to the search results; this is called "image search by image." Image search can also be called image retrieval.

[0120] Image recommendation refers to a recommendation engine system that provides users with relevant image resources on the internet. It can recommend popular images based on image popularity and click-through rates, and also recommend images that users might be interested in based on their browsing history and preferences. In some scenarios, image recommendations can be initiated by the user, for example, when a user clicks on "Popular Recommendations" or "You May Like," triggering the system to recommend images. In other scenarios, image recommendations can be proactively offered to the user without user intervention; for example, the system can actively push recommended images to the user while they are browsing a webpage.

[0121] Dominant color tone: refers to the overall color tendency of an image; it represents the dominant color effect within an image. The dominant color tone indicates the color tone that constitutes the largest proportion of an image.

[0122] One possible representation is to use the percentages of the red (R), green (G), and blue (B) components to represent the dominant color tone of an image. For example, the dominant color tone of an image can be represented as [2, 52, 62], indicating that the percentage of the R component is 2%, the percentage of the G component is 52%, and the percentage of the B component is 62%. It should be noted that there are other ways to represent the dominant color tone of an image, and this embodiment does not limit this.

[0123] One possible implementation is to extract the dominant color tone of an image by performing color clustering on each pixel in the image and determining the cluster center of the largest cluster as the dominant color tone of the image. The clustering process can employ various clustering algorithms, such as K-Means or other clustering algorithms. Of course, other methods can also be used to extract the dominant color tone of an image in applications, and this embodiment does not limit this approach.

[0124] Color wheel: A color wheel, also known as a color circle, is formed by connecting multiple colors end-to-end in a predetermined order. In practical applications, various forms of color wheels can be used depending on the color space. In some scenarios, a color wheel can also be called a hue circle. Color wheels can include: 6-color wheels, 12-color wheels, 24-color wheels, 36-color wheels, 48-color wheels, 72-color wheels, etc. The more colors included in a color wheel, the richer and more nuanced the colors it represents. When a color wheel includes a sufficient number of colors, it can be considered to represent continuous colors; that is, each position in the color wheel can correspond to a color. It should be noted that the embodiments of this application do not limit the type of color wheel; the following accompanying drawings illustrate a 6-color wheel as an example.

[0125] In the accompanying drawings of this application, when illustrating the display effect of images on an example terminal device, fill methods are used to represent the main color tone of the image. Different fill methods represent different main colors. For example, if an image is filled with a left diagonal line, it indicates that the main color tone of the image is blue; if an image is filled with a right diagonal line, it indicates that the main color tone of the image is purple; and so on.

[0126] The embodiments of this application can be applied to scenarios where a terminal device displays multiple images. Several example application scenarios are described below.

[0127] Example Scenario 1: Image Search Scenario.

[0128] Figure 1 This is a schematic diagram illustrating one application scenario. See also... Figure 1The terminal device's interface 'a' provides an image search entry. Users can enter search keywords in interface 'a', for example, the keyword "balloon". When the user clicks the "Search" button, the terminal device displays the search results in interface 'b', that is, it displays multiple images related to "balloon". Each rectangle in interface 'b' represents one image.

[0129] It should be understood that, Figure 1 This example illustrates the process of a user entering keywords to perform an image search. In practical applications, other image search methods are also possible, and this embodiment does not limit these methods. For example, a user can input search criteria into the terminal device via voice commands. Another example is that a user can input the image to be searched into the terminal device, i.e., "image search".

[0130] Typically, the images displayed on interface b by the terminal device are sorted according to their search relevance. That is, the higher the relevance of an image to "balloon," the higher it appears on interface b. Conversely, the lower the relevance, the lower it appears. This results in a cluttered display on interface b, which can discourage users from continuing to browse or click, and also makes it difficult for them to quickly and easily locate the image they need.

[0131] Example Scenario 2: Image Recommendation Scenario.

[0132] Figure 2 This is a diagram illustrating another application scenario. See also... Figure 2 The terminal device's interface 'a' provides an image recommendation entry point. For example, a user can click "More" in "Popular Recommendations" to trigger the terminal device to recommend popular images based on their popularity. Similarly, a user can click "More" in "You May Like" to trigger the terminal device to recommend images that the user might be interested in based on their preferences. Taking popular recommendations as an example, when a user clicks "More" in "Popular Recommendations" on interface 'a', the terminal device redirects to interface 'b', where multiple recommended images are displayed. Figure 2 In interface b, each rectangle represents an image.

[0133] It should be understood that there are various ways for a terminal device to recommend images to a user, and this application embodiment does not limit this. Figure 2 The example shown is only one possible one.

[0134] and Figure 1Similar to the image search scenario, in the image recommendation scenario, the images displayed on interface b by the terminal device are sorted according to their relevance to the recommendation. For example, in "Hot Recommendations," images with higher popularity are displayed earlier on interface b. In "You May Like" recommendations, images with higher similarity to the user's preferences are displayed earlier on interface b. This results in a cluttered display of images on interface b, which can discourage users from continuing to browse or click further, and also makes it difficult for users to quickly and easily locate images of interest.

[0135] Example Scenario 3: Image Gallery / Theme Gallery Scenario.

[0136] Figure 3 This is an illustration of another application scenario. For example, see the image library. Figure 3 When a user clicks the "Gallery" icon on the main interface 'a' of the terminal device, the terminal device is redirected to interface 'b', where images from the gallery are displayed. Each rectangle in interface 'b' represents one image.

[0137] Typically, the images displayed in interface b are arranged in chronological order of capture / reception time. This results in a cluttered display of images, which can discourage users from continuing to browse or click further, and also makes it difficult for them to quickly and easily locate the images they need.

[0138] Example Scenario 4: Jigsaw Puzzle Scenario.

[0139] Figure 4 This is a diagram illustrating yet another application scenario. See also... Figure 4 When a user clicks the "Gallery" icon on the main interface 'a' of the terminal device, the terminal device is redirected to interface 'b', which displays images from the gallery. In interface 'b', each rectangle represents an image. See also... Figure 4 Users can select multiple images from the gallery to create a puzzle. For example, if a user selects nine images in interface c, and then clicks the "Create" button, the terminal device will generate a puzzle based on the nine selected images, as shown in the image below. Figure 4 As shown in interface d, users can click the "Save" button to save the generated puzzle.

[0140] Usually, such as Figure 4 As shown in interface d, the images in the jigsaw puzzle generated by the terminal device are arranged and displayed in the order that the user selects the images in interface c. This makes the images in the jigsaw puzzle relatively cluttered, resulting in a poor jigsaw puzzle effect.

[0141] It should be noted that, in addition to the example scenarios mentioned above, the image display method provided in this application can also be used in many other scenarios, which will not be described one by one in the embodiments of this application.

[0142] In summary, in the scenarios described above, when a terminal device displays multiple images, they are typically arranged in a fixed order, resulting in a cluttered display and poor image quality. This can further discourage users from continuing to browse or click, making it difficult for them to quickly locate the image they need.

[0143] To address the aforementioned technical problems, this application provides an image display method. When multiple images are displayed on a terminal device, images with the same or similar main color tones can be displayed in the same display area. This solves the problem of cluttered image display and improves the image display effect. Furthermore, it allows users to quickly and easily locate the image they need.

[0144] The image display method provided in this application will be described below with reference to several specific embodiments. The following embodiments can be combined with each other, and the same or similar concepts or processes will not be described again.

[0145] Figure 5 This is a flowchart illustrating an image display method provided in an embodiment of this application. The method of this embodiment can be applied to the image search scenario described above. The method of this embodiment can be executed by a terminal device. Figure 5 As shown, the method in this embodiment includes:

[0146] S501: Obtain an image search instruction, the image search instruction including a first search condition.

[0147] Combination Figure 1 In the illustrated application scenario, when the terminal device detects that the user clicks "Search," the terminal device receives an image search instruction. This instruction directs the terminal device to search for images that meet the first search criteria. It should be understood that the terminal device can receive the image search instruction in various ways. Furthermore, the corresponding first search criteria may differ depending on the method used to receive the instruction.

[0148] For example, in one embodiment, the first search criteria can be the user's search query. Figure 1 The keywords entered in interface a shown. In another embodiment, the first search condition can be a search image entered by the user, which can be an image stored in the terminal device or an image taken by the user through the terminal device. In yet another embodiment, the first search condition can also be a search condition entered by the user to the terminal device in the form of voice.

[0149] S502: According to the image search instruction, multiple images corresponding to the first search condition are displayed in the first interface; wherein, the first interface includes at least two display areas, each display area is used to display at least one image, and the main color of the images displayed in each display area is within the same color range.

[0150] The first interface is used to display search results to the user. For example, the first interface could be... Figure 1 Interface b in the first interface. Multiple images from the search results can be displayed in the first interface. For ease of description, this embodiment refers to the area in the first interface used to display one image as an image bit. The first interface can be divided into M*K image bits, so that M*K images can be displayed in each screen of the first interface. Here, M and K are both integers greater than 1. For example, Figure 1 The interface b can display M=5 rows of images, and each row can display K=3 images.

[0151] In this embodiment, the first interface includes at least two display areas, each of which can be used to display one or more images. That is, each display area can include one or more image bits. It should be noted that this embodiment does not limit the size and shape of each display area (i.e., the number of image bits included in each display area, and the positional relationship between the image bits included in each display area). For example, a display area can be a rectangular area or a non-rectangular area.

[0152] The following combination Figure 6 and Figure 7 The display area is illustrated with an example.

[0153] Figure 6 This is a schematic diagram of a display area provided in an embodiment of this application. Figure 6 As shown, a display area can include one image bit, for example Figure 6 The display area is 64. A display area can also include multiple image bits, for example, Figure 6 Display areas 61, 62, and 63 are shown in the image. See also... Figure 6 , Figure 6 The display areas 61, 62, and 64 shown are rectangular areas, while display area 63 is a non-rectangular area.

[0154] In one possible implementation, each display area in the first interface can be a rectangular area, which is used to display N rows of images. Here, N is an integer greater than or equal to 1. Figure 7 Another schematic diagram of the display area provided in an embodiment of this application. For example... Figure 7As shown, the area displaying each row of images in the first interface is considered as one display area. Thus, the first interface is divided into five display areas: display area 71, display area 72, display area 73, display area 74, and display area 75. This implementation is suitable for terminal devices that support vertical scrolling.

[0155] In another possible implementation, each display area in the first interface can be a rectangular area, which is used to display N columns of images. Here, N is an integer greater than or equal to 1. This implementation is suitable for terminal devices that support left-right swiping.

[0156] In this embodiment, the dominant color of the images displayed in each display area lies within the same color range. In other words, the dominant color of the images displayed in each display area is the same or similar. For example, multiple color ranges can be divided based on a color wheel. Figure 8 This is a schematic diagram of a color wheel-based hue range provided for an embodiment of this application. (See diagram below.) Figure 8 As shown, based on the color wheel, the color can be divided into: red, orange, yellow, green, cyan, blue, and purple tones. Each tonal range includes multiple similar shades. It should be noted that... Figure 8 This is intended as an illustration of tonal division, not a limitation. In practical applications, there can be multiple ways to divide tonal ranges, or rather, even more tonal ranges can be divided based on a color wheel.

[0157] The following is based on Figure 7 Taking the division of the display area as an example, several possible display effects of the first interface in this application embodiment will be illustrated.

[0158] Figure 9A This is a schematic diagram illustrating one display effect of the first interface provided in an embodiment of this application. For example... Figure 9A As shown, the dominant color of each image displayed in each display area falls within the same color range. For example, the dominant color of the images displayed in display area 71 falls within the blue range, the dominant color of the images displayed in display area 72 falls within the red range, the dominant color of the images displayed in display area 73 falls within the purple range, the dominant color of the images displayed in display area 74 falls within the green range, and the dominant color of the images displayed in display area 75 falls within the yellow range.

[0159] It is understandable that since the main color of the images displayed in each display area is within the same color range, the images in each display area are arranged neatly and aesthetically, thus improving the display effect of the images on the first interface.

[0160] In one possible implementation, the hue ranges corresponding to the at least two display areas are arranged according to a preset hue order. The preset hue order can be a predefined hue order.

[0161] Optionally, the preset hue order is the hue order indicated by the color wheel in a clockwise direction. That is, the hue ranges corresponding to the at least two display areas are arranged according to the hue order indicated by the color wheel in a clockwise direction.

[0162] Figure 9B This is a schematic diagram illustrating another display effect of the first interface provided in an embodiment of this application. For example... Figure 9B As shown, for example, suppose the five display areas in the first interface correspond to the following color ranges: blue, green, red, purple, and yellow. Arranged in the color wheel clockwise direction, the first display area (i.e., display area 71) displays an image whose main color is in the blue range, the second display area (i.e., display area 72) displays an image whose main color is in the purple range, the third display area (i.e., display area 73) displays an image whose main color is in the red range, the fourth display area (i.e., display area 74) displays an image whose main color is in the yellow range, and the fifth display area (i.e., display area 75) displays an image whose main color is in the green range.

[0163] Optionally, the preset hue order is the hue order indicated by the color wheel in a counter-clockwise direction. That is, the hue ranges corresponding to the at least two display areas are arranged according to the hue order indicated by the color wheel in a counter-clockwise direction.

[0164] Figure 9C This is a schematic diagram illustrating yet another display effect of the first interface provided in an embodiment of this application. For example... Figure 9C As shown, for example, suppose the five display areas in the first interface correspond to the following color ranges: blue, green, red, purple, and yellow, arranged in the color wheel counterclockwise direction. The first display area (i.e., display area 71) displays an image whose main color is in the blue range, the second display area (i.e., display area 72) displays an image whose main color is in the green range, the third display area (i.e., display area 73) displays an image whose main color is in the yellow range, the fourth display area (i.e., display area 74) displays an image whose main color is in the red range, and the fifth display area (i.e., display area 75) displays an image whose main color is in the purple range.

[0165] It should be understood that since the color wheel is arranged according to the visual perception characteristics of different hues, in the first interface, the hue ranges corresponding to different display areas are arranged in the order of hues indicated by the clockwise / counterclockwise direction of the color wheel. This ensures that when users view the images in the first interface, they will not feel that the hues jump too much, thereby further improving the display effect of the images on the first interface.

[0166] It should be noted that the above example illustrates the effect of displaying the first screen as a single screen. In some scenarios, when there are many images that meet the first search criteria, the terminal device cannot display all of them on a single screen. Therefore, it is necessary to display them across multiple screens, meaning the user needs to swipe up and down or left and right on the first screen to browse across multiple screens. In this scenario, each screen can be displayed as described above. Specifically, the multiple display areas within each screen can be arranged according to the hue order indicated by the color wheel in a clockwise / counterclockwise direction. In this way, the overall effect is achieved where the hue ranges corresponding to different display areas are arranged cyclically according to a preset hue order, thereby further improving the image display effect of the first screen.

[0167] In one possible implementation, for each display area in the first interface, when the number of images displayed in the display area is multiple, the main color of the images displayed in the display area is arranged according to a preset color order.

[0168] Optionally, the preset hue order is the hue order indicated by the color wheel in a clockwise direction. That is, the main hue of the image displayed in each display area is arranged according to the hue order indicated by the color wheel in a clockwise direction. Figure 9D This is a schematic diagram illustrating another display effect of the first interface provided in an embodiment of this application. For example, taking the first display area in the first interface as an example, this display area corresponds to a blue tone range, and this display area needs to display images A, B, and C. The positions of the main color tones of the above three images on the color wheel are as follows... Figure 9D As shown, following the color wheel's clockwise hue order, the three images are displayed in the first display area in the following order: Image A, Image C, and Image B.

[0169] Optionally, the preset color tone order is the color tone order indicated by the color wheel in a counter-clockwise direction. That is, the main color tone of the image displayed in each display area is arranged according to the color tone order indicated by the color wheel in a counter-clockwise direction. Figure 9E This is a schematic diagram illustrating another display effect of the first interface provided in an embodiment of this application. For example, taking the fifth display area in the first interface as an example, this display area corresponds to a purple tone range, and this display area needs to display images D, E, and F. The positions of the main colors of the above three images on the color wheel are as follows... Figure 9E As shown, following the color wheel's counter-clockwise hue order, the three images are displayed in the fifth display area in the following order: image F, image D, and image E.

[0170] Since the color wheel is arranged according to the visual perception characteristics of different hues, the main hues of each image in each display area are arranged in the order indicated by the clockwise / counterclockwise direction of the color wheel. This ensures that when users view the images in each display area, they will not feel excessive hue jumps, thereby further improving the display effect of the images on the first interface.

[0171] The image display method provided in this embodiment includes: a terminal device acquiring an image search instruction, the image search instruction including a first search condition; and displaying multiple images corresponding to the first search condition on a first interface according to the image search instruction. The first interface includes at least two display areas, each display area for displaying at least one image, and the dominant color of the images displayed in each display area is within the same color range. Through this process, images with the same or similar dominant color are displayed in the same display area, thus solving the problem of cluttered image display and improving the image display effect. Furthermore, this allows users to quickly and easily locate the image they need.

[0172] In the above Figure 5 Based on the illustrated embodiment, the following describes several possible implementation methods. Figure 5 The illustrated embodiments are described in more detail.

[0173] Figure 10 This is a schematic diagram illustrating the interactive flow of an image display method provided in an embodiment of this application. The method in this embodiment can be executed interactively by a terminal device and a server. Figure 10 As shown, the method in this embodiment includes:

[0174] S1001: The terminal device obtains an image search instruction, the image search instruction including a first search condition.

[0175] It should be understood that the specific implementation process of S1002 is different from... Figure 5 Similar to S501, it will not be elaborated here.

[0176] S1002: The terminal device sends a search request to the server, the search request including the first search condition.

[0177] In this embodiment, the server is equipped with an image search engine and an image database. After receiving an image search instruction, the terminal device sends the first search criteria in the search request to the server, so that the server's image search engine can perform image search processing on the image database according to the first search criteria.

[0178] In one possible implementation, the search request sent by the terminal device to the server may further include: display parameters of the terminal device's first interface. For example, the display parameters of the first interface may include: the number of images displayed on one screen of the first interface, and / or, the number of images displayed in each row or column of the first interface.

[0179] By including the display parameters of the first interface in the search request, the server can learn about the display layout of the images on the first interface of the terminal device. Then, in subsequent processes, the server can reorder the images in the image set based on the display layout, thereby improving the image display effect.

[0180] S1003: The server performs image search processing based on the search request to obtain an image set, and the images in the image set satisfy the first search condition.

[0181] Specifically, the server uses an image search engine to perform image search processing, retrieving images from the image database that meet the first search criteria. These images that meet the first search criteria constitute the aforementioned image set. It should be noted that this embodiment does not limit the specific search process of the image search engine; existing image search processing methods can be used for the search.

[0182] In some possible implementations, the server performs image search processing based on the search request, obtaining an image set and a corresponding first ranking result. This first ranking result is a sorting of the images in the image set according to their relevance to the first search condition, from highest to lowest. For example, assuming the image search engine obtains an image set containing 1000 images, the first image in the set has the highest relevance to the first search condition, the second image has the next highest relevance, and so on, with the 1000th image having the lowest relevance.

[0183] S1004: The server generates image display information based on the main color tone of the images in the image set. The image display information includes: the display area corresponding to each image in the image set in the first interface and the display position of each image in the display area.

[0184] In this embodiment, the server does not directly generate image display information based on the first sorting result corresponding to the image set. Instead, it generates image display information based on the dominant color tone of the images in the image set. The image display information includes the display area corresponding to each image in the first interface and the display position of each image within the display area. Since the server generates image display information based on the dominant color tone of the images, it ensures that when the terminal device displays multiple images in the image set according to the image display information, the dominant color tone of the images displayed in each display area is within the same color tone range.

[0185] In one possible implementation, the server can generate image display information in the following manner.

[0186] (1) According to the first sorting result corresponding to the image set, the images in the image set are grouped to obtain multiple groups of images.

[0187] For example, images of a predetermined number of adjacent images can be grouped together according to the first sorting result corresponding to the image set, resulting in multiple groups of images. The predetermined number can be a fixed value set in advance, or a dynamic value adaptively determined based on the actual application scenario.

[0188] Optionally, if the terminal device sends a search request to the server containing display parameters of the first interface, the preset quantity can be determined based on these parameters. In one example, assuming the first interface displays 3 images per row, the preset quantity can be a multiple of 3; for example, the preset quantity could be 6, 9, 12, 15, 18, 24, etc. In another example, the number of images displayed per screen in the first interface can be determined as the preset quantity. For example, assuming the first interface displays 15 images per screen, the preset quantity can be 15.

[0189] Optionally, in some cases, before the terminal device interacts with the server, the server may have already learned the display parameters of the first interface. In this case, the search request sent by the terminal device to the server does not need to include the display parameters of the first interface, and the server determines the value of the preset number based on the pre-known parameters of the first interface. Similar to the example above, it will not be elaborated here.

[0190] In both of the above methods, by determining the value of the preset quantity (i.e. the number of images in each group) based on the display parameters of the first interface, the grouping result is more reasonable. In the subsequent process, the image reordering is performed based on the reasonable grouping result, which can improve the image display effect.

[0191] Optionally, the server can statistically analyze the distribution of the dominant color tone in each image of the image set and determine the value of the preset quantity based on the distribution. For example, if the dominant color tone distribution of the images in the image set is relatively concentrated, the preset quantity can be set to a smaller value. If the dominant color tone distribution of the images in the image set is relatively dispersed, the preset quantity can be set to a larger value.

[0192] In the above method, by adaptively determining the value of the preset number (i.e. the number of images in each group), the rationality of the grouping results under different search scenarios is ensured. Therefore, in the subsequent process, the image reordering is performed based on the reasonable grouping results, which can improve the image display effect.

[0193] (2) For each group of images, the images in the group are reordered according to the main color tone of the images in the group to obtain the main color tone sorting result of the group of images. Based on the main color tone sorting result, the display information of the group of images is determined. The display information includes the display area corresponding to each image in the group of images and the display position of each image in the display area.

[0194] For the first group of images, the dominant color sorting result can be determined as follows: Determine the position of the dominant color of each image in the first group on the color wheel. Based on the position of the dominant color of each image in the first group on the color wheel, starting from the position of the first image in the first group on the color wheel, reorder the images in the first group in a clockwise or counterclockwise direction to obtain the dominant color sorting result of the first group of images.

[0195] For the i-th group of images (i is an integer greater than 1), the dominant color sorting result of the i-th group of images can be determined as follows: determine the position of the dominant color of each image in the i-th group of images in the color wheel; based on the position of the dominant color of each image in the i-th group of images in the color wheel, take the position of the last image in the (i-1)-th group of images in the color wheel as the starting point, and reorder the images in the i-th group of images in a clockwise or counterclockwise direction according to the color wheel to obtain the dominant color sorting result of the i-th group of images.

[0196] The following combination Figure 11 The above image reordering process is illustrated with an example. Figure 11 The color wheel is used as an example to illustrate the clockwise direction.

[0197] Figure 11 This is a schematic diagram illustrating an image reordering process provided in an embodiment of this application. Figure 11As shown, assume that each group of images contains 15 images. The first group of images, sorted according to the first ranking result (i.e., sorted from high to low according to their relevance to the first search condition), is as follows: Image 1, Image 2, Image 3, Image 4, Image 5, Image 6, Image 7, Image 8, Image 9, Image 10, Image 11, Image 12, Image 13, Image 14, Image 15. The second group of images, sorted according to the first ranking result, is as follows: Image 16, Image 17, Image 18, Image 19, Image 20, Image 21, Image 22, Image 23, Image 24, Image 25, Image 26, Image 27, Image 28, Image 29, Image 30.

[0198] For the first group of images, determine the positions of the dominant hues of images 1 to 15 on the color wheel, such as... Figure 11 As shown. Starting from the position of image 1 in the color wheel, the first group of images is reordered in a clockwise direction according to the color wheel, resulting in the following order of the main color tones of the first group of images: image 1, image 12, image 13, image 11, image 3, image 15, image 2, image 8, image 6, image 5, image 7, image 9, image 10, image 14, and image 4.

[0199] Furthermore, based on the sorting results of the dominant color tones of the images in the group and the display parameters of the first interface, the display information of the images in the group can be determined according to preset principles. The display information includes the display area corresponding to each image in the group on the first interface, and the display position of each image within that display area. That is, it determines which row and column of each image in the group will be displayed on the first interface. The preset principles may include: the dominant color tones of the images displayed in each row of the first interface are within the same color range, and the dominant color tones of the images displayed in each row are arranged in a clockwise direction according to the color wheel; the color ranges corresponding to different rows are arranged in a clockwise direction according to the color wheel. After the above process, the final display scheme for the first group of images can be found in [reference needed]. Figure 11 As shown.

[0200] For the second set of images, determine the positions of the dominant hues of images 16 to 30 on the color wheel, such as... Figure 11 As shown. Starting from the position of the dominant color tone of the last image in the first group (i.e., image 4) on the color wheel, the second group of images is reordered clockwise, resulting in the following dominant color tone sorting: Image 27, Image 29, Image 18, Image 16, Image 20, Image 28, Image 21, Image 17, Image 23, Image 19, Image 30, Image 26, Image 25, Image 22, and Image 24.

[0201] Furthermore, based on the sorting results of the dominant color tones of the images in this group and the display parameters of the first interface, the display information of this group of images can be determined according to preset principles. The display information includes the display area corresponding to each image in the first interface, and the display position of each image within that display area. That is, it determines which row and column of each image in the first interface will be displayed. The preset principles may include: the dominant color tones of the images displayed in each row of the first interface are within the same color range, and the dominant color tones of the images displayed in each row are arranged in a clockwise direction according to the color wheel; the color ranges corresponding to different rows are arranged in a clockwise direction according to the color wheel. After the above process, the final display scheme for the second group of images can be determined as follows: Figure 11 As shown.

[0202] Continue to see Figure 11 In the final image display scheme, within each group of images, the dominant color of each row of images falls within the same color range, and the dominant color of each row is arranged in a clockwise direction according to the color wheel. The color ranges corresponding to different rows are also arranged in a clockwise direction according to the color wheel. Furthermore, since the reordering of the i-th group of images (where i is an integer greater than 1) starts from the position of the last image in the (i-1)-th group on the color wheel, the transition of the dominant color between the i-th and (i-1)-th groups is smooth, preventing any abrupt color changes in the first interface. Thus, when the user scrolls up and down through multiple screens of images, the overall color range is arranged cyclically in a clockwise direction according to the color wheel, further improving the image display effect of the first interface.

[0203] It should be noted that, Figure 11 The reordering process of the first and second groups of images is illustrated using examples. It should be understood that the reordering process for the third and subsequent groups is similar to that for the second group, and will not be illustrated again.

[0204] (3) Generate the image display information based on the display information of the multiple sets of images.

[0205] Specifically, the display information of multiple images is merged to generate the image display information.

[0206] In this embodiment, when determining image display information, the images in the image set are first grouped according to the first sorting result corresponding to the image set (i.e., the sorting result based on the relevance to the first search condition), resulting in multiple groups of images. Within each group, the images are re-sorted based on the dominant color tone of the images in that group. Thus, while largely retaining the original first sorting, the image display effect is optimized. In this way, when the first interface presents search results, it still retains the general search relevance information, without reducing the efficiency of the user locating the desired image in the search results.

[0207] The above describes the process of reordering each group of images based on the hue order indicated by the color wheel in a clockwise or counterclockwise direction. In practical applications, to preserve search relevance information to the greatest extent, each group of images can also be reordered based on the order in which the hues appear in the original first sorting result. The following section combines... Figure 12 Let's illustrate with examples.

[0208] Figure 12 This is a schematic diagram illustrating another image reordering process provided in an embodiment of this application. For example... Figure 11 As shown, assume that each group of images contains 15 images. The first group of images, sorted according to the first ranking result (i.e., sorted from high to low according to their relevance to the first search condition), is as follows: Image 1, Image 2, Image 3, Image 4, Image 5, Image 6, Image 7, Image 8, Image 9, Image 10, Image 11, Image 12, Image 13, Image 14, Image 15. The second group of images, sorted according to the first ranking result, is as follows: Image 16, Image 17, Image 18, Image 19, Image 20, Image 21, Image 22, Image 23, Image 24, Image 25, Image 26, Image 27, Image 28, Image 29, Image 30.

[0209] For the first group of images, determine the tonal range corresponding to the dominant color tone of each image in the group, as well as the order in which each tonal range appears. For example, see... Figure 12Assume the tonal ranges corresponding to the dominant colors of each image in the first group of images are as follows: Image 1 (blue tone range), Image 2 (red tone range), Image 3 (purple tone range), Image 4 (green tone range), Image 5 (yellow tone range), Image 6 (red tone range), Image 7 (yellow tone range), Image 8 (red tone range), Image 9 (yellow tone range), Image 10 (green tone range), Image 11 (purple tone range), Image 12 (blue tone range), Image 13 (blue tone range), Image 14 (green tone range), Image 15 (purple tone range). Then the order of these tonal ranges is: blue tone range, red tone range, purple tone range, green tone range, yellow tone range. Therefore, when reordering the first group of images, the tonal ranges corresponding to different rows in the first interface can be arranged in the above order. For example, see... Figure 12 The dominant color of the first row of images is in the blue range, the dominant color of the second row of images is in the red range, the dominant color of the third row of images is in the purple range, the dominant color of the fourth row of images is in the green range, and the dominant color of the fifth row of images is in the yellow range.

[0210] For the second set of images, the tonal range corresponding to the dominant color tone of each image in the set, and the order in which each tonal range appears, are calculated. For example, see... Figure 12 Assume the tonal ranges corresponding to the dominant colors of each image in the second group are as follows: Image 16 (purple tone range), Image 17 (red tone range), Image 18 (blue tone range), Image 19 (yellow tone range), Image 20 (purple tone range), Image 21 (red tone range), Image 22 (green tone range), Image 23 (red tone range), Image 24 (green tone range), Image 25 (green tone range), Image 26 (yellow tone range), Image 27 (blue tone range), Image 28 (purple tone range), Image 29 (blue tone range), and Image 30 (yellow tone range). Then the order of these tonal ranges is: purple tone range, red tone range, blue tone range, yellow tone range, and green tone range. Therefore, when reordering the second group of images, the tonal ranges corresponding to different rows in the first interface can be arranged in the above order. For example, see... Figure 12 The dominant color of the first row of images is in the purple range, the dominant color of the second row of images is in the red range, the dominant color of the third row of images is in the blue range, the dominant color of the fourth row of images is in the yellow range, and the dominant color of the fifth row of images is in the green range.

[0211] Figure 12In the example shown, within each group of images, the tonal ranges corresponding to different rows are arranged according to the order in which the tonal ranges appear in that group of images. This minimizes disruption to the first sorting result and optimizes the image display effect while preserving the original first sorting as much as possible.

[0212] It should be noted that in practical applications, the above... Figure 11 and Figure 12 The reordering process shown can also be used in combination. For example, for the first group of images, use... Figure 12 The reordering process shown applies to the second group and subsequent groups. Figure 11 The reordering process is shown below. Of course, there are other ways to combine them, which will not be listed here.

[0213] S1005: The server sends the address information of the images in the image set and the image display information to the terminal device.

[0214] The address information of an image can refer to the image's Uniform Resource Locator (URL) information.

[0215] In one example, the server can send the address information of the images in the image set and the image display information to the terminal device in the following form.

[0216] “image_list”:[

[0217] {"img_url":"http / / :...jpg","rank":0,"location_group":"0"},

[0218] {"img_url":"http / / :...jpg","rank":1,"location_group":"0"},

[0219] {"img_url":"http / / :...jpg","rank":2,"location_group":"0"},

[0220] {"img_url":"http / / :...jpg","rank":0,"location_group":"1"},

[0221] {"img_url":"http / / :...jpg","rank":1,"location_group":"1"},

[0222] {"img_url":"http / / :...jpg","rank":2,"location_group":"1"},

[0223] ...

[0224] {"img_url":"http / / :...jpg","rank":2,"location_group":"334"} ]

[0226] Here, `img_url` represents the URL information of the image. `location_group` represents the identifier of the display area corresponding to the image, and `rank` represents the display position of the image within that display area, i.e., the image bit identifier.

[0227] S1006: The terminal device obtains the image set based on the address information of the images in the image set.

[0228] The terminal device can download each image from the database based on the address information of each image, thereby obtaining an image set.

[0229] S1007: The terminal device displays multiple images on the first interface according to the image display information, wherein the multiple images are all or part of the images in the image set.

[0230] In this context, "multiple images" refers to the images displayed on a single screen of the terminal device. Taking a terminal device displaying 15 images per screen as an example, if the number of images in the image set is less than or equal to 15, the terminal device displays all images in the image set on the first screen. If the number of images in the image set is greater than 15, the terminal device displays a portion of the images in the image set on the first screen. Specifically, the terminal device can display the first 15 images (i.e., images with location_group of 0, 1, 2, 3, and 4) on the first screen of the first interface based on the image display information. When a user's swipe operation is detected on the first screen, subsequent images are displayed according to the user's swipe operation.

[0231] Figure 10 In the implementation shown, after the server retrieves the image set based on the search request, it reorders the images in the image set according to their dominant color tone. In another possible implementation, this reordering process can also be performed by the terminal device. The following section will discuss this further. Figure 13 Please provide a detailed explanation.

[0232] Figure 13 This is a schematic diagram illustrating the interactive flow of another image display method provided in an embodiment of this application. The method in this embodiment can be executed interactively by a terminal device and a server. Figure 13 As shown, the method in this embodiment includes:

[0233] S1301: The terminal device obtains an image search instruction, the image search instruction including a first search condition.

[0234] S1302: The terminal device sends a search request to the server, the search request including the first search condition.

[0235] S1303: The server performs image search processing based on the search request and obtains an image set, in which the images satisfy the first search condition.

[0236] S1304: The server sends the address information of the images in the image set to the terminal device.

[0237] In this embodiment, the specific implementation process of S1301 to S1304 is as follows: Figure 10 The illustrated embodiment is similar and will not be described in detail here. It should be noted that in this embodiment, the reordering process is performed by the terminal device. Therefore, after the server obtains the image set, it can directly send the address information of the images in the image set to the terminal device. Since the server does not need to perform grouping and reordering, the search request sent by the terminal device to the server does not need to include the display information of the first interface.

[0238] S1305: The terminal device obtains the image set based on the address information, and the images in the image set are arranged according to their relevance to the first search condition.

[0239] S1306: The terminal device determines the image display information based on the main color tone of the images in the image set. The image display information includes: the display area corresponding to each image in the image set and the display position of each image in the display area.

[0240] It should be understood that the process by which the terminal device determines the image display information is related to... Figure 10 The process of the server generating image display information in the illustrated embodiment is similar and can be found in [reference needed]. Figure 10 The specific description of S1004 is not repeated here.

[0241] S1307: The terminal device displays the plurality of images on the first interface according to the image display information, wherein the plurality of images are all or part of the images in the image set.

[0242] As an example, Figure 14 This is a schematic diagram illustrating the image display effect in an image search scenario according to an embodiment of this application. For example... Figure 14As shown, interface a of the terminal device provides an image search entry. Users can enter search keywords in interface a, for example, "balloon". When the user clicks the "Search" button, the terminal device displays the search results in interface b, that is, multiple images related to "balloon" are displayed in interface b. The images in interface b are arranged according to their dominant color tone. Specifically, each row is considered a display area. The dominant color tone of the images in each display area falls within the same color tone range (i.e., the dominant color tone of the images in each display area is the same or similar), and the dominant color tone of the images in each display area is arranged in a clockwise / counterclockwise direction according to the color wheel. The color tone ranges corresponding to different display areas are arranged cyclically in a clockwise / counterclockwise direction according to the color wheel. This makes the images in interface b rich in color tone and have harmonious color transitions, resulting in a better image display effect. Furthermore, it increases the user's willingness to continue browsing or click further, allowing the user to easily and quickly locate the image they need.

[0243] The above Figures 5 to 14 The illustrated embodiments describe the application of this application in an image search scenario. The above embodiments can also be applied to image recommendation scenarios, with similar implementation principles. Specifically, the terminal device sends a recommendation request to the server. This recommendation request carries a recommendation type, which can be any of the following: recommendation based on image popularity, or recommendation based on user preference features. Upon receiving the recommendation request, the server uses an image recommendation engine to retrieve an image set from the database. The images in the image set are the images to be recommended to the user. The images in the image set are arranged according to image popularity, or, alternatively, according to their similarity to user preference features.

[0244] The server generates image display information based on the dominant color tone of the images in the image set, and sends the address information and image display information of each image in the image set to the terminal device. The terminal device retrieves the image set based on the address information and displays multiple images on the first interface according to the image display information. Alternatively...

[0245] The server sends the address information of the images in the image set to the terminal device. The terminal device retrieves the image set based on the address information and determines the image display information based on the dominant color tone of each image in the image set. Then, the terminal device displays multiple images on the first interface according to the image display information.

[0246] This embodiment does not go into detail about the specific implementation method in the image recommendation scenario; please refer to the above. Figures 5 to 14 A detailed description of the illustrated embodiment. As an example, Figure 15 This is a schematic diagram illustrating the image display effect in an image recommendation scenario according to an embodiment of this application. Figure 15As shown, interface a of the terminal device provides an image recommendation entry. For example, a user can click "More" in "Hot Recommendations" to trigger recommendations of popular images based on image popularity. Similarly, a user can click "More" in "You May Like" to trigger recommendations of images the user might be interested in based on their preferences. Taking hot recommendations as an example, when a user clicks "More" in "Hot Recommendations" on interface a, the terminal device redirects to interface b, which displays multiple recommended images. The images in interface b are arranged according to their dominant color tone. Specifically, each row is considered a display area. The dominant color tone of the images in each display area falls within the same color tone range (i.e., the dominant color tone of the images in each display area is the same or similar), and the dominant color tone of the images in each display area is arranged in a clockwise / counterclockwise direction according to the color wheel. The color tone ranges corresponding to different display areas are arranged cyclically in a clockwise / counterclockwise direction according to the color wheel. This results in rich and harmonious color tones in the images on interface b, leading to a better image display effect on interface b. Furthermore, it can increase users' willingness to continue browsing or click further, making it convenient and quick for users to locate images they are interested in.

[0247] Figure 16 This is a flowchart illustrating another image display method provided in an embodiment of this application. The method of this embodiment can be applied to the aforementioned image library / theme library scenario. The method of this embodiment can be executed by a terminal device. Figure 16 As shown, the method in this embodiment includes:

[0248] S1601: Display images from the image library in the first display order on the first interface.

[0249] The image library mentioned above can be a stock photo library or a theme library. The first interface can be a display interface used to display images from the image library; for example, the first interface can be... Figure 3 Interface b in the middle.

[0250] In this embodiment, the first display order can be any of the following: the order of image capture time, the order of image reception time, the order of image selection time, the order of correlation between images and preset conditions, and the preset color tone order.

[0251] When the terminal device displays images from the image library in the first interface according to the order of image capture time, image reception time, image selection time, or the relevance between the images and preset conditions, the display effect can be seen in [reference needed]. Figure 3 Interface b in the middle.

[0252] When the terminal device displays images from the image library in a preset color tone order on the first interface, the first interface includes multiple display areas, each display area is used to display one or more images, and the main color tone of the images displayed in each display area is within the same color tone range. The display effect can be seen in [reference needed]. Figures 9A to 9E Or, see Figure 14 Interface b in the middle.

[0253] S1602: Obtain image rearrangement instructions.

[0254] In this embodiment, the image rearrangement instruction is used to instruct the images in the image library to be reordered and displayed.

[0255] In one possible implementation, when the terminal device detects a first user operation on the first interface, it obtains an image rearrangement instruction. The first user operation can be any of the following: an icon click, an interface zooming operation, or an image filtering operation.

[0256] In one possible implementation, the terminal device receives an image rearrangement instruction when it detects a change in the number of images in the image library. The change in the number of images in the image library can include either an increase or a decrease in the number of images.

[0257] S1603: According to the image rearrangement instruction, the images in the image library are displayed in the first interface in a second display order; wherein, when the images in the image library are displayed in the second display order, the first interface includes at least two display areas, each display area is used to display at least one image, and the main color of the images displayed in each display area is within the same color range.

[0258] In this embodiment, when the terminal device receives an image rearrangement instruction, it triggers a reordering of the images in the image library and displays the images in the image library in a second display order. The second display order refers to the display order determined based on the dominant color tone of the images. When displaying images in the image library in the second display order, the first interface includes at least two display areas, each display area for displaying at least one image, and the dominant color tone of the images displayed in each display area is within the same color tone range.

[0259] In one possible implementation, the hue ranges corresponding to the at least two display areas are arranged according to a preset hue order. Optionally, the preset hue order is a hue order indicated by a clockwise direction on the color wheel, or the preset hue order is a hue order indicated by a counterclockwise direction on the color wheel.

[0260] In one possible implementation, for any display area, when the number of images displayed in the display area is multiple, the main color tones of the images displayed in the display area are arranged according to a preset color tone order. Optionally, the preset color tone order is the color tone order indicated by a clockwise direction of the color wheel, or the preset color tone order is the color tone order indicated by a counterclockwise direction of the color wheel.

[0261] In one possible implementation, each display area is a rectangular area, which is used to display N rows or N columns of images, where N is an integer greater than or equal to 1.

[0262] It should be understood that, in this embodiment, the method of displaying images in the image library in the second display order is similar to the method of displaying images in search results by the terminal device in the above embodiment, and will not be described in detail here. The display effect can be found in [reference needed]. Figures 9A to 9E Or, see Figure 14 Interface b in the middle.

[0263] In one possible implementation, S1603 may include: acquiring images from an image library according to an image rearrangement instruction; determining image display information based on the dominant color tone of the images in the image library, the image display information including: the display area corresponding to each image in the image library in the first interface, and the display position of each image in the display area. The terminal device displays multiple images from the image library in the first interface according to the image display information, thereby achieving the display of images from the image library in the first interface in a second display order.

[0264] The process by which the terminal device determines the image display information based on the dominant color tone of the images in the image library can be found in the detailed description of the above embodiments, and will not be repeated here.

[0265] The following section will discuss specific application scenarios. Figure 16 The illustrated embodiment is provided as an example.

[0266] As an example, Figure 17 This is a schematic diagram illustrating an image display effect in a gallery scene according to an embodiment of this application. For example... Figure 17 As shown in 'a', when a user clicks the "Gallery" icon on the main interface of the terminal device, the terminal displays the first interface. In this first interface, images from the gallery are displayed in a first display order (the order in which the images were captured). At this time, the first interface looks like... Figure 17 As shown in b. The first interface provides an entry point for the rearrange function. When the user clicks the "Rearrange" icon on the first interface, it triggers the terminal device to reorder the images in the gallery, so that the terminal device displays the images in the gallery on the first interface according to the second display order (tone order). At this time, the first interface is as follows: Figure 17As shown in 'c', specifically, each row is considered a display area. The dominant color of the images in each display area falls within the same color range (i.e., the dominant color of the images in each display area is the same or similar). The dominant color of the images in each display area is arranged in a clockwise / counterclockwise direction according to the color wheel. The color ranges corresponding to different display areas are arranged cyclically in a clockwise / counterclockwise direction according to the color wheel. This results in rich image colors and harmonious color transitions in the interface, leading to better image display. Furthermore, it increases the user's willingness to continue browsing or click, allowing users to easily and quickly locate the images they need.

[0267] As another example, in Figure 17 Based on the illustrated embodiment, after the terminal device displays images in the image library according to a preset color tone order, if the terminal device detects a change in the number of images in the image library—for example, the terminal device newly captures / receives one or more images and saves them to the image library, or the terminal device deletes one or more images from the image library—it triggers a reordering process for the images in the image library. Then, based on the latest reordering result, the terminal device displays the images in the image library according to a second display order, ensuring timely interface updates.

[0268] As yet another example, Figure 18 This is a schematic diagram illustrating another image display effect in a gallery scene according to an embodiment of this application. For example... Figure 18 As shown in Figure 'a', the terminal device displays images from the gallery in a preset color tone order on the first interface. The first interface displays 3 images per row, and 15 images per screen. When the user zooms in or out on the first interface, the terminal device determines the display parameters of the zoomed-out first interface based on the user's zoom input. Then, the terminal device reorders the images in the gallery according to their dominant color tone and the display parameters of the zoomed-out first interface. Assuming the zoomed-out first interface displays 4 images per row and 28 images per screen, the display effect of the zoomed-out first interface is as follows: Figure 18 As shown in b in the figure, the scaled first interface still displays images according to the following principles: the main color tone of the images in each display area is within the same color tone range (i.e., the main color tone of the images in each display area is the same or similar), the main color tone of the images in each display area is arranged in the color tone order indicated by the clockwise / counterclockwise direction of the color wheel, and the color tone ranges corresponding to different display areas are arranged cyclically in the color tone order indicated by the clockwise / counterclockwise direction of the color wheel.

[0269] As yet another example, Figure 19 This is a schematic diagram illustrating the image display effect in a jigsaw puzzle scenario according to an embodiment of this application. Figure 19As shown in 'a', the terminal device displays images from the gallery in the first display order (the order in which the images were captured). Users can select multiple images from the gallery to create a collage. For example, if a user selects nine images from the gallery and clicks the "Create" button, the terminal device generates a collage based on the nine selected images, as shown in the image. Figure 19 As shown in b, the images in the puzzle are arranged according to the second display order (tone order). Each row in the puzzle is considered a display area. The dominant hue of the images in each display area falls within the same hue range (i.e., the dominant hues of the images in each display area are the same or similar). The dominant hues of the images in each display area are arranged in a hue order indicated by the color wheel in a clockwise / counterclockwise direction. The hue ranges corresponding to different display areas are arranged cyclically in a hue order indicated by the color wheel in a clockwise / counterclockwise direction. This results in rich image tones and harmonious tonal transitions in the puzzle, leading to a better display effect.

[0270] Figure 20 This is a schematic diagram illustrating the structure of an image display device provided in an embodiment of this application. The device can be in the form of software and / or hardware. The device can be a terminal device, or a device disposed within a terminal device. Figure 20 As shown, the image display device 2000 provided in this embodiment includes a processing module 2001 and a display module 2002.

[0271] The image display device provided in this embodiment is applied to image search scenarios, image recommendation scenarios, image library / topic library scenarios, and puzzle scenarios. The following description uses image search and image library scenarios as examples.

[0272] When the image display device 2000 is applied to an image search scenario, the processing module 2001 is used to obtain an image search instruction, the image search instruction including a first search condition; the display module 2002 is used to display multiple images corresponding to the first search condition in a first interface according to the image search instruction; wherein, the first interface includes at least two display areas, each display area is used to display at least one image, and the main color tone of the images displayed in each display area is within the same color tone range.

[0273] In one possible implementation, the hue ranges corresponding to the at least two display areas are arranged in a preset hue order.

[0274] In one possible implementation, for any display area, when the number of images displayed in the display area is multiple, the main color tones of the images displayed in the display area are arranged according to a preset color tone order.

[0275] In one possible implementation, the preset hue order is the hue order indicated by the color wheel in a clockwise direction; or, the preset hue order is the hue order indicated by the color wheel in a counterclockwise direction.

[0276] In one possible implementation, each display area is a rectangular area, which is used to display N rows or N columns of images, where N is an integer greater than or equal to 1.

[0277] In one possible implementation, the processing module 2001 is further configured to: obtain an image set and image display information according to the image search instruction, wherein the images in the image set satisfy the first search condition, and the image display information includes: the display area corresponding to each image in the image set and the display position of each image in the display area; the display module 2002 is specifically configured to display the plurality of images in the first interface according to the image display information, wherein the plurality of images are all or part of the images in the image set.

[0278] In one possible implementation, the processing module 2001 is specifically configured to: send a search request to a server, the search request including the first search condition; receive address information of images in the image set and image display information from the server; and obtain the image set based on the address information.

[0279] In one possible implementation, the processing module 2001 is specifically configured to: send a search request to a server, the search request including the first search condition; receive address information of images in the image set from the server, and obtain the image set according to the address information, wherein the images in the image set are arranged according to their relevance to the first search condition; and determine the image display information according to the dominant color tone of the images in the image set.

[0280] In one possible implementation, the processing module 2001 is specifically configured to: group the images in the image set according to the order of the images in the image set to obtain multiple groups of images; for each group of images, reorder the images in the group of images according to the dominant color tone of the images in the group to obtain the dominant color tone sorting result of the group of images, and determine the display information of the group of images according to the dominant color tone sorting result, wherein the display information includes the display area corresponding to each image in the group of images and the display position of each image in the display area; and generate the image display information according to the display information of the multiple groups of images.

[0281] In one possible implementation, for the first group of images, the processing module 2001 is specifically used to: determine the position of the dominant color tone of each image in the first group of images in the color wheel; based on the position of the dominant color tone of each image in the first group of images in the color wheel, taking the position of the first image in the first group of images in the color wheel as the starting point, and reordering the images in the first group of images in a clockwise or counterclockwise direction according to the color wheel, to obtain the dominant color tone sorting result of the first group of images.

[0282] In one possible implementation, for the i-th group of images, where i is an integer greater than 1, the processing module 2001 is specifically used to: determine the position of the dominant color tone of each image in the i-th group of images in the color wheel; based on the position of the dominant color tone of each image in the i-th group of images in the color wheel, taking the position of the last image in the (i-1)-th group of images in the color wheel as the starting point, and reordering the images in the i-th group of images in a clockwise or counterclockwise direction according to the color wheel, to obtain the dominant color tone sorting result of the i-th group of images.

[0283] When the image display device 2000 is applied to a gallery scene, the display module 2002 is used to display images in the gallery in a first display order on a first interface; the processing module 2001 is used to obtain an image rearrangement instruction; the display module 2002 is also used to display images in the gallery in a second display order on the first interface according to the image rearrangement instruction; wherein, when displaying images in the gallery in the second display order, the first interface includes at least two display areas, each display area is used to display at least one image, and the main color tone of the images displayed in each display area is within the same color tone range.

[0284] In one possible implementation, the hue ranges corresponding to the at least two display areas are arranged in a preset hue order.

[0285] In one possible implementation, for any display area, when the number of images displayed in the display area is multiple, the main color tones of the images displayed in the display area are arranged according to a preset color tone order.

[0286] In one possible implementation, the preset hue order is the hue order indicated by a clockwise direction on the color wheel; or,

[0287] The preset hue order is the hue order indicated by the color wheel in a counter-clockwise direction.

[0288] In one possible implementation, each display area is a rectangular area, which is used to display N rows or N columns of images, where N is an integer greater than or equal to 1.

[0289] In one possible implementation, the first display order can be any of the following: the order of image capture time; the order of image reception time; the order of image selection time; the order of correlation between images and preset conditions; and the preset color tone order.

[0290] In one possible implementation, the processing module 2001 is specifically used to: detect a first user operation in the first interface, wherein the first user operation is any one of the following operations: icon click operation, interface zoom operation, and image filtering operation; or, detect a change in the number of images in the image library.

[0291] In one possible implementation, the processing module 2001 is further configured to obtain images from the image library according to the image rearrangement instruction; determine image display information according to the main color tone of the images in the image library, the image display information including: the display area corresponding to each image in the image library on the first interface, and the display position of each image in the display area; the display module 2002 is specifically configured to display the images from the image library on the first interface according to the image display information.

[0292] In one possible implementation, the processing module 2001 is specifically configured to: group the images in the image library according to the arrangement order of the images in the image library to obtain multiple groups of images; for each group of images, reorder the images in the group of images according to the dominant color tone of the images in the group of images to obtain the dominant color tone sorting result of the group of images, and determine the display information of the group of images according to the dominant color tone sorting result, wherein the display information includes the display area corresponding to each image in the group of images and the display position of each image in the display area; and generate the image display information according to the display information of the multiple groups of images.

[0293] In one possible implementation, for the first group of images, the processing module 2001 is specifically used to: determine the position of the dominant color tone of each image in the first group of images in the color wheel; based on the position of the dominant color tone of each image in the first group of images in the color wheel, taking the position of the first image in the first group of images in the color wheel as the starting point, and reordering the images in the first group of images in a clockwise or counterclockwise direction according to the color wheel, to obtain the dominant color tone sorting result of the first group of images.

[0294] In one possible implementation, for the i-th group of images, where i is an integer greater than 1, the processing module 2001 is specifically used to: determine the position of the dominant color tone of each image in the i-th group of images in the color wheel; based on the position of the dominant color tone of each image in the i-th group of images in the color wheel, taking the position of the last image in the (i-1)-th group of images in the color wheel as the starting point, and reordering the images in the i-th group of images in a clockwise or counterclockwise direction according to the color wheel, to obtain the dominant color tone sorting result of the i-th group of images.

[0295] The image display device provided in this embodiment can be used to execute the image display method executed by the terminal device in any of the above method embodiments. Its implementation principle and technical effect are similar, and will not be described in detail here.

[0296] Figure 21 This is a schematic diagram of the structure of an image processing apparatus provided in an embodiment of this application. The apparatus can be in the form of software and / or hardware. The apparatus can be a server, or a device disposed within a server. Figure 21 As shown, the image processing device 2100 provided in this embodiment includes a processing module 2101 and a transceiver module 2102.

[0297] The processing module 2101 is used to acquire an image set and generate image display information based on the dominant color tone of the images in the image set. The image display information includes: the display area corresponding to each image in the image set in the first interface and the display position of each image in the display area. The transceiver module 2102 is used to send the address information of the images in the image set and the image display information to the terminal device. The image display information is used to instruct the terminal device to display multiple images in the image set in the first interface. The first interface includes at least two display areas, each display area is used to display at least one image, and the dominant color tone of the images displayed in each display area is within the same color tone range.

[0298] In one possible implementation, the hue ranges corresponding to the at least two display areas are arranged in a preset hue order.

[0299] In one possible implementation, for any display area, when the number of images displayed in the display area is multiple, the main color tones of the images displayed in the display area are arranged according to a preset color tone order.

[0300] In one possible implementation, the preset hue order is the hue order indicated by the color wheel in a clockwise direction; or, the preset hue order is the hue order indicated by the color wheel in a counterclockwise direction.

[0301] In one possible implementation, each display area is a rectangular area, which is used to display N rows or N columns of images, where N is an integer greater than or equal to 1.

[0302] In one possible implementation, the processing module 2101 is specifically configured to: group the images in the image set according to the order of the images in the image set to obtain multiple groups of images; for each group of images, reorder the images in the group of images according to the dominant color tone to obtain the dominant color tone sorting result of the group of images, and determine the display information of the group of images according to the dominant color tone sorting result, wherein the display information includes the display area corresponding to each image in the group of images and the display position of each image in the display area; and generate the image display information according to the display information of the multiple groups of images.

[0303] In one possible implementation, for the first group of images, the processing module 2101 is specifically used to: determine the position of the dominant color tone of each image in the first group of images in the color wheel; based on the position of the dominant color tone of each image in the first group of images in the color wheel, taking the position of the first image in the first group of images in the color wheel as the starting point, and reordering the images in the first group of images in a clockwise or counterclockwise direction according to the color wheel, to obtain the dominant color tone sorting result of the first group of images.

[0304] In one possible implementation, for the i-th group of images, where i is an integer greater than 1, the processing module 2101 is specifically used to: determine the position of the dominant color tone of each image in the i-th group of images in the color wheel; based on the position of the dominant color tone of each image in the i-th group of images in the color wheel, taking the position of the last image in the (i-1)-th group of images in the color wheel as the starting point, and reordering the images in the i-th group of images in a clockwise or counterclockwise direction according to the color wheel, to obtain the dominant color tone sorting result of the i-th group of images.

[0305] In one possible implementation, the transceiver module 2102 is further configured to receive a search request, the search request including a first search condition; the processing module 2101 is specifically configured to obtain the image set according to the first search condition, wherein the images in the image set satisfy the first search condition.

[0306] In one possible implementation, the transceiver module 2102 is further configured to receive a recommendation request, the recommendation request including a recommendation type, which is any one of the following: the processing module 2101 is specifically configured to make recommendations based on image popularity or based on user preference features; and to obtain the image set according to the recommendation type.

[0307] The image processing apparatus provided in this embodiment can be used to execute the image processing method executed by the server in the above method embodiment. Its implementation principle and technical effect are similar, and will not be described in detail here.

[0308] Figure 22 This is a schematic diagram of the structure of an electronic device provided in an embodiment of this application. The electronic device can be a terminal device or a server. Figure 22 As shown, the electronic device 2200 provided in this embodiment includes at least one processor 2201 and at least one memory 2202.

[0309] The memory 2202 can exist independently or be connected to the processor 2201. Optionally, the memory 2202 and the processor 2201 can be connected via a bus 2203. Optionally, the memory 2202 can also be integrated with the processor 2201, for example, integrated within a single chip. The memory 2202 stores computer instructions, and the processor 2201 can execute the computer instructions stored in the memory to implement the image display method executed by the terminal device in the above embodiments, or to implement the image processing method executed by the server in the above embodiments. The implementation principle and technical effects are similar and will not be elaborated here.

[0310] exist Figure 22 In the illustrated embodiments, the processor can be a Central Processing Unit (CPU), or other general-purpose processors, digital signal processors (DSPs), application-specific integrated circuits (ASICs), etc. The general-purpose processor can be a microprocessor or any conventional processor. The steps of the method disclosed in this application can be directly implemented by a hardware processor, or implemented by a combination of hardware and software modules within the processor. The memory can be a storage element located on the same chip as the processor, i.e., an on-chip storage element, or a separate storage element; this embodiment does not limit this.

[0311] Figure 23This is a schematic diagram of a terminal device provided in an embodiment of this application. The electronic device 100 may include a processor 110, an external memory interface 120, an internal memory 121, a universal serial bus (USB) interface 130, antenna 1, antenna 2, a mobile communication module 150, a wireless communication module 160, an audio module 170, a speaker 170A, a receiver 170B, a microphone 170C, a headphone jack 170D, a sensor module 180, buttons 190, a motor 191, an indicator 192, a camera 193, a display screen 194, etc. The sensor module 180 may include a pressure sensor 180A, a gyroscope sensor 180B, an accelerometer sensor 180E, a proximity sensor 180F, a touch sensor 180K, etc.

[0312] It is understood that the structures illustrated in the embodiments of this application do not constitute a specific limitation on the electronic device 100. In other embodiments of this application, the electronic device 100 may include more or fewer components than illustrated, or combine some components, or split some components, or have different component arrangements. The illustrated components may be implemented in hardware, software, or a combination of software and hardware.

[0313] Processor 110 may include one or more processing units, such as application processors (APs), modem processors, graphics processing units (GPUs), image signal processors (ISPs), controllers, video codecs, digital signal processors (DSPs), baseband processors, and / or neural network processing units (NPUs). These different processing units may be independent devices or integrated into one or more processors.

[0314] The controller can generate operation control signals based on the instruction opcode and timing signals to complete the control of instruction fetching and execution.

[0315] The processor 110 may also include a memory for storing instructions and data. In some embodiments, the memory in the processor 110 is a cache memory. This memory can store instructions or data that the processor 110 has just used or that are used repeatedly. If the processor 110 needs to use the instruction or data again, it can retrieve it directly from the memory. This avoids repeated accesses, reduces the waiting time of the processor 110, and thus improves the efficiency of the system.

[0316] The processor 110 adjusts the center point of the image to be displayed on the display screen 194 based on the user's pupil position offset and the user's visual acuity. It also determines the distortion correction parameters corresponding to the image to be displayed on the display screen 194 based on the user's pupil position offset and the user's visual acuity, and performs distortion correction on the image to be displayed on the display screen 194 according to these distortion correction parameters. Furthermore, it adjusts the image height of the image to be displayed on the display screen 194 based on the user's visual acuity. After the above image calibration processing, the virtual image seen by the user is unaffected by eye position offset or visual acuity. After both optical systems undergo the above calibration processing, the image seen by both eyes is identical, improving the user experience of the electronic device 100.

[0317] In some embodiments, the processor 110 may include one or more interfaces. Interfaces may include an inter-integrated circuit (I2C) interface, an inter-integrated circuit sound (I2S) interface, a pulse code modulation (PCM) interface, a universal asynchronous receiver / transmitter (UART) interface, a mobile industry processor interface (MIPI), a general-purpose input / output (GPIO) interface, a subscriber identity module (SIM) interface, and / or a universal serial bus (USB) interface, etc.

[0318] The I2C interface is a bidirectional synchronous serial bus, including a serial data line (SDA) and a serial clock line (SCL). In some embodiments, the processor 110 may include multiple I2C buses. The processor 110 can couple to the touch sensor 180K, charger, flash, camera 193, etc., through different I2C bus interfaces. For example, the processor 110 can couple to the touch sensor 180K through the I2C interface, enabling the processor 110 and the touch sensor 180K to communicate through the I2C bus interface, thereby realizing the touch function of the electronic device 100.

[0319] The I2S interface can be used for audio communication. In some embodiments, the processor 110 may include multiple I2S buses. The processor 110 can be coupled to the audio module 170 via the I2S bus to enable communication between the processor 110 and the audio module 170. In some embodiments, the audio module 170 can transmit audio signals to the wireless communication module 160 via the I2S interface to enable the function of answering phone calls through a Bluetooth headset.

[0320] The PCM interface can also be used for audio communication, sampling, quantizing, and encoding analog signals. In some embodiments, the audio module 170 and the wireless communication module 160 can be coupled via the PCM bus interface. In some embodiments, the audio module 170 can also transmit audio signals to the wireless communication module 160 via the PCM interface, enabling the function of answering phone calls through a Bluetooth headset. Both the I2S interface and the PCM interface can be used for audio communication.

[0321] The UART interface is a universal serial data bus used for asynchronous communication. This bus can be a bidirectional communication bus. It converts the data to be transmitted between serial and parallel communication. In some embodiments, the UART interface is typically used to connect the processor 110 and the wireless communication module 160. For example, the processor 110 communicates with the Bluetooth module in the wireless communication module 160 via the UART interface to implement Bluetooth functionality. In some embodiments, the audio module 170 can transmit audio signals to the wireless communication module 160 via the UART interface to enable music playback through Bluetooth headphones.

[0322] The MIPI interface can be used to connect the processor 110 to peripheral devices such as the display screen 194 and the camera 193. The MIPI interface includes a camera serial interface (CSI) and a display serial interface (DSI). In some embodiments, the processor 110 and the camera 193 communicate via the CSI interface to enable the electronic device 100 to capture images. The processor 110 and the display screen 194 communicate via the DSI interface to enable the electronic device 100 to display images.

[0323] The GPIO interface can be configured via software. It can be configured as a control signal or a data signal. In some embodiments, the GPIO interface can be used to connect the processor 110 to a camera 193, a display screen 194, a wireless communication module 160, an audio module 170, a sensor module 180, etc. The GPIO interface can also be configured as an I2C interface, an I2S interface, a UART interface, a MIPI interface, etc.

[0324] USB port 130 is a USB standard compliant interface, specifically a Mini USB port, Micro USB port, USB Type-C port, etc. USB port 130 can be used to connect a charger to charge electronic device 100, and can also be used for data transfer between electronic device 100 and peripheral devices. It can also be used to connect headphones for audio playback. This interface can also be used to connect other electronic devices, such as AR devices.

[0325] It is understood that the interface connection relationships between the modules illustrated in the embodiments of this application are merely illustrative and do not constitute a structural limitation on the electronic device 100. In other embodiments of this application, the electronic device 100 may also employ different interface connection methods or combinations of multiple interface connection methods as described in the above embodiments.

[0326] The wireless communication function of electronic device 100 can be realized through antenna 1, antenna 2, mobile communication module 150, wireless communication module 160, modem processor and baseband processor, etc.

[0327] Antenna 1 and antenna 2 are used to transmit and receive electromagnetic wave signals. Each antenna in electronic device 100 can be used to cover one or more communication frequency bands. Different antennas can also be multiplexed to improve antenna utilization. For example, antenna 1 can be multiplexed as a diversity antenna for a wireless local area network. In some other embodiments, the antennas can be used in conjunction with tuning switches.

[0328] The mobile communication module 150 can provide solutions for wireless communication, including 2G / 3G / 4G / 5G, applied to the electronic device 100. The mobile communication module 150 may include at least one filter, switch, power amplifier, low noise amplifier (LNA), etc. The mobile communication module 150 can receive electromagnetic waves via antenna 1, and perform filtering, amplification, and other processing on the received electromagnetic waves before transmitting them to a modem processor for demodulation. The mobile communication module 150 can also amplify the signal modulated by the modem processor and convert it into electromagnetic waves for radiation via antenna 1. In some embodiments, at least some functional modules of the mobile communication module 150 may be housed in the processor 110. In some embodiments, at least some functional modules of the mobile communication module 150 and at least some modules of the processor 110 may be housed in the same device.

[0329] The modem processor may include a modulator and a demodulator. The modulator modulates the low-frequency baseband signal to be transmitted into a mid-to-high frequency signal. The demodulator demodulates the received electromagnetic wave signal into a low-frequency baseband signal. The demodulator then transmits the demodulated low-frequency baseband signal to the baseband processor for processing. After processing by the baseband processor, the low-frequency baseband signal is transmitted to the application processor. The application processor outputs sound signals through an audio device (not limited to speaker 170A, receiver 170B, etc.) or displays images or videos through the display screen 194. In some embodiments, the modem processor may be a separate device. In other embodiments, the modem processor may be independent of the processor 110 and may be housed in the same device as the mobile communication module 150 or other functional modules.

[0330] The wireless communication module 160 can provide solutions for wireless communication applications on the electronic device 100, including wireless local area networks (WLANs) (such as wireless fidelity (Wi-Fi) networks), Bluetooth (BT), global navigation satellite system (GNSS), frequency modulation (FM), near field communication (NFC), and infrared (IR) technologies. The wireless communication module 160 can be one or more devices integrating at least one communication processing module. The wireless communication module 160 receives electromagnetic waves via antenna 2, performs frequency modulation and filtering of the electromagnetic wave signals, and sends the processed signal to processor 110. The wireless communication module 160 can also receive signals to be transmitted from processor 110, perform frequency modulation and amplification, and convert them into electromagnetic waves for radiation via antenna 2.

[0331] In some embodiments, antenna 1 of electronic device 100 is coupled to mobile communication module 150, and antenna 2 is coupled to wireless communication module 160, enabling electronic device 100 to communicate with networks and other devices via wireless communication technology. The wireless communication technology may include Global System for Mobile Communications (GSM), General Packet Radio Service (GPRS), Code Division Multiple Access (CDMA), Wideband Code Division Multiple Access (WCDMA), Time Division Code Division Multiple Access (TD-SCDMA), Long Term Evolution (LTE), BT, GNSS, WLAN, NFC, FM, and / or IR technologies, etc. The GNSS may include the Global Positioning System (GPS), the Global Navigation Satellite System (GLONASS), the BeiDou Navigation Satellite System (BDS), the Quasi-Zenith Satellite System (QZSS), and / or satellite-based augmentation systems (SBAS).

[0332] Electronic device 100 implements display functions through a GPU, a display screen 194, and an application processor. The GPU is a microprocessor for image processing, connected to the display screen 194 and the application processor. The GPU is used to perform mathematical and geometric calculations and for graphics rendering. Processor 110 may include one or more GPUs, which execute program instructions to generate or modify display information.

[0333] Display screen 194 is used to display images, videos, etc. Display screen 194 includes a display panel. The display panel may be a liquid crystal display (LCD), an organic light-emitting diode (OLED), an active-matrix organic light-emitting diode (AMOLED), a flexible light-emitting diode (FLED), a miniature LED, a microLED, a quantum dot light-emitting diode (QLED), etc. In some embodiments, electronic device 100 may include one or N displays 194, where N is a positive integer greater than 1.

[0334] Electronic device 100 can perform shooting functions through ISP, camera 193, video codec, GPU, display 194 and application processor.

[0335] The ISP (Image Signal Processor) is used to process data fed back from the camera 193. For example, when taking a picture, the shutter is opened, and light is transmitted through the lens to the camera's photosensitive element. The light signal is converted into an electrical signal, and the camera's photosensitive element transmits the electrical signal to the ISP for processing, transforming it into an image visible to the naked eye. The ISP can also perform algorithmic optimization of image noise, brightness, and skin tone. The ISP can also optimize parameters such as exposure and color temperature of the shooting scene. In some embodiments, the ISP can be set in the camera 193.

[0336] Camera 193 is used to capture still images or videos. An object is projected onto a photosensitive element by generating an optical image through the lens. The photosensitive element can be a charge-coupled device (CCD) or a complementary metal-oxide-semiconductor (CMOS) phototransistor. The photosensitive element converts the light signal into an electrical signal, which is then passed to an ISP for conversion into a digital image signal. The ISP outputs the digital image signal to a DSP for processing. The DSP converts the digital image signal into image signals in standard RGB, YUV, or other formats. In some embodiments, the electronic device 100 may include one or N cameras 193, where N is a positive integer greater than 1.

[0337] Digital signal processors (DSPs) are used to process digital signals. Besides digital image signals, they can also process other digital signals. For example, when electronic device 100 selects a frequency, the DSP can perform Fourier transforms on the frequency energy.

[0338] Video codecs are used to compress or decompress digital video. Electronic device 100 may support one or more video codecs. Thus, electronic device 100 can play or record videos in various encoding formats, such as Moving Picture Experts Group (MPEG) 1, MPEG2, MPEG3, MPEG4, etc.

[0339] An NPU (Neural Processing Unit) is a computational processor for neural networks (NNs). By borrowing the structure of biological neural networks, such as the transmission patterns between neurons in the human brain, it can rapidly process input information and continuously learn on its own. NPUs enable intelligent cognitive applications in electronic devices, such as image recognition, facial recognition, speech recognition, and text understanding.

[0340] The external storage interface 120 can be used to connect an external memory card, such as a Micro SD card, to expand the storage capacity of the electronic device 100. The external memory card communicates with the processor 110 through the external storage interface 120 to perform data storage functions. For example, music, video, and other files can be saved on the external memory card.

[0341] Internal memory 121 can be used to store computer executable program code, which includes instructions. Internal memory 121 may include a program storage area and a data storage area. The program storage area may store the operating system, at least one application program required for a function (such as sound playback, image playback, etc.), etc. The data storage area may store data created during the use of electronic device 100 (such as audio data, phonebook, etc.). Furthermore, internal memory 121 may include high-speed random access memory, and may also include non-volatile memory, such as at least one disk storage device, flash memory device, universal flash storage (UFS), etc. Processor 110 executes various functional applications and data processing of electronic device 100 by running instructions stored in internal memory 121 and / or instructions stored in memory located in the processor.

[0342] Electronic device 100 can implement audio functions, such as music playback and recording, through audio module 170, speaker 170A, receiver 170B, microphone 170C, headphone jack 170D, and application processor.

[0343] The audio module 170 is used to convert digital audio information into analog audio signals for output, and also to convert analog audio input into digital audio signals. The audio module 170 can also be used for encoding and decoding audio signals. In some embodiments, the audio module 170 may be located in the processor 110, or some functional modules of the audio module 170 may be located in the processor 110.

[0344] The speaker 170A, also known as a "loudspeaker," is used to convert audio electrical signals into sound signals. The electronic device 100 can listen to music or make hands-free calls through the speaker 170A.

[0345] The receiver 170B, also known as the "earpiece," is used to convert audio electrical signals into sound signals. When the electronic device 100 answers a telephone call or voice message, the receiver 170B can be brought close to the ear to listen to the voice.

[0346] Microphone 170C, also known as a "microphone" or "voice transducer," is used to convert sound signals into electrical signals. When making a phone call or sending a voice message, the user can speak by bringing their mouth close to microphone 170C, inputting the sound signal into microphone 170C. Electronic device 100 may have at least one microphone 170C. In some embodiments, electronic device 100 may have two microphones 170C, which, in addition to collecting sound signals, can also perform noise reduction. In other embodiments, electronic device 100 may also have three, four, or more microphones 170C, which can collect sound signals, reduce noise, identify the sound source, and perform directional recording, etc.

[0347] The 170D headphone jack is used to connect wired headphones. The 170D headphone jack can be a USB 130 interface or a 3.5mm Open Mobile Terminal Platform (OMTP) standard interface, a CTIA (Cellular Telecommunications Industry Association of the USA) standard interface.

[0348] Pressure sensor 180A is used to sense pressure signals and convert them into electrical signals. In some embodiments, pressure sensor 180A can be disposed on display screen 194. There are many types of pressure sensors 180A, such as resistive pressure sensors, inductive pressure sensors, and capacitive pressure sensors. A capacitive pressure sensor may include at least two parallel plates with conductive material. When force is applied to pressure sensor 180A, the capacitance between the electrodes changes. Electronic device 100 determines the pressure intensity based on the change in capacitance. When a touch operation is applied to display screen 194, electronic device 100 detects the intensity of the touch operation based on pressure sensor 180A. Electronic device 100 can also calculate the touch position based on the detection signal from pressure sensor 180A. In some embodiments, touch operations applied to the same touch position but with different touch operation intensities can correspond to different operation commands. For example, when a touch operation with an intensity less than a first pressure threshold is applied to the SMS application icon, a command to view an SMS is executed. When a touch operation with an intensity greater than or equal to the first pressure threshold is applied to the SMS application icon, a command to create a new SMS is executed.

[0349] The gyroscope sensor 180B can be used to determine the motion attitude of the electronic device 100. In some embodiments, the gyroscope sensor 180B can determine the angular velocity of the electronic device 100 about three axes (i.e., the x, y, and z axes). The gyroscope sensor 180B can be used for image stabilization. For example, when the shutter is pressed, the gyroscope sensor 180B detects the angle of the shake of the electronic device 100, calculates the distance that the lens module needs to compensate based on the angle, and allows the lens to counteract the shake of the electronic device 100 by moving in the opposite direction, thus achieving image stabilization. The gyroscope sensor 180B can also be used in navigation and motion-sensing game scenarios.

[0350] The 180E accelerometer can detect the magnitude of acceleration of electronic device 100 in various directions (typically three axes). When electronic device 100 is stationary, it can detect the magnitude and direction of gravity. It can also be used to identify the posture of electronic devices and applied to applications such as screen orientation switching and pedometers.

[0351] A distance sensor 180F is used to measure distance. Electronic device 100 can measure distance via infrared or laser. In some embodiments, during a shooting scene, electronic device 100 can utilize the distance sensor 180F to measure distance for rapid focusing.

[0352] Touch sensor 180K, also known as a "touch device," can be located on display screen 194. The touch sensor 180K and display screen 194 together form a touchscreen, also known as a "touchscreen." Touch sensor 180K detects touch operations applied to or near it. The touch sensor can transmit the detected touch operation to the application processor to determine the type of touch event. Visual output related to the touch operation can be provided through display screen 194. In other embodiments, touch sensor 180K may also be located on the surface of electronic device 100, in a different position than display screen 194.

[0353] Buttons 190 include a power button, volume buttons, etc. Buttons 190 can be mechanical buttons or touch-sensitive buttons. Electronic device 100 can receive button input and generate key signal inputs related to user settings and function control of electronic device 100.

[0354] Motor 191 can generate vibration alerts. Motor 191 can be used for incoming call vibration alerts or for touch vibration feedback. For example, different vibration feedback effects can correspond to touch operations performed on different applications (such as taking photos, playing audio, etc.). Motor 191 can also correspond to different vibration feedback effects for touch operations performed on different areas of the display screen 194. Different application scenarios (such as time reminders, receiving messages, alarm clocks, games, etc.) can also correspond to different vibration feedback effects. The touch vibration feedback effect can also be customized.

[0355] Indicator 192 can be an indicator light, used to indicate charging status, power changes, or to indicate messages, missed calls, notifications, etc.

[0356] The above description is merely a specific embodiment of the present application, but the scope of protection of the present application is not limited thereto. Any changes or substitutions that can be easily conceived by a person skilled in the art within the technical scope disclosed in this application should be included in the scope of protection of this application. Therefore, the scope of protection of this application should be based on the scope of protection of the claims.

Claims

1. An image display method, characterized in that, include: Obtain an image search instruction, the image search instruction including a first search condition; According to the image search instruction, an image set and image display information are obtained. The images in the image set satisfy the first search condition. The image display information includes: the display area corresponding to each image in the image set and the display position of each image in the display area. Based on the image display information, multiple images corresponding to the first search condition are displayed on the first interface; The first interface includes at least two display areas, each display area is used to display at least one image, and the main color of the images displayed in each display area is within the same color range; The step of obtaining the image set and image display information according to the image search instruction includes: Send a search request to the server, the search request including the first search criteria; The server receives the address information of the images in the image set, and obtains the image set based on the address information. The images in the image set are arranged according to their relevance to the first search condition. According to the order in which the images are arranged in the image set, the images in the image set are grouped to obtain multiple groups of images; For each group of images, the images in the group are reordered according to their dominant color tone to obtain the dominant color tone sorting result. Based on the dominant color tone sorting result, the display information of the group of images is determined. The display information includes the display area corresponding to each image in the group of images and the display position of each image in the display area. Based on the display information of the multiple sets of images, the image display information is generated; Wherein, for the i-th group of images, i is an integer greater than 1, the step of re-sorting the images in the group of images according to their dominant color tone to obtain the dominant color tone sorting result of the group of images includes: Determine the position of the dominant hue of each image in the i-th group on the color wheel; Based on the position of the dominant color tone of each image in the i-th group of images on the color wheel, and taking the position of the last image in the (i-1)-th group of images on the color wheel as the starting point, the images in the i-th group of images are reordered in a clockwise or counterclockwise direction according to the color wheel to obtain the dominant color tone sorting result of the i-th group of images.

2. The method according to claim 1, characterized in that, The color ranges corresponding to the at least two display areas are arranged in a preset color order.

3. The method according to claim 1 or 2, characterized in that, For any display area, when the number of images displayed in the display area is multiple, the main color tones of the images displayed in the display area are arranged according to a preset color tone order.

4. The method according to claim 3, characterized in that, The preset hue order is the hue order indicated by the color wheel in a clockwise direction; or, The preset hue order is the hue order indicated by the color wheel in a counter-clockwise direction.

5. The method according to any one of claims 1-2 and 4, characterized in that, Each display area is a rectangular area, which is used to display N rows or N columns of images, where N is an integer greater than or equal to 1.

6. The method according to any one of claims 1-2 and 4, further comprising: The plurality of images are all or a portion of the images in the image set.

7. The method according to claim 6, characterized in that, According to the image search command, obtain the image set and image display information, including: Send a search request to the server, the search request including the first search criteria; Receive the address information of the images in the image set and the image display information from the server; Based on the address information, obtain the image set.

8. The method according to claim 1, characterized in that, For the first set of images; Based on the dominant color tone of the images in this group, the images are reordered to obtain the dominant color tone sorting result, including: Determine the position of the dominant hue of each image in the first group of images on the color wheel; Based on the position of the dominant color tone of each image in the first group of images on the color wheel, starting from the position of the first image in the first group of images on the color wheel, the images in the first group of images are reordered in a clockwise or counterclockwise direction to obtain the dominant color tone sorting result of the first group of images.

9. An image display method, characterized in that, include: The images in the image library are displayed in the first display order on the first interface; Get the image rearrangement instruction; According to the image rearrangement instruction, obtain the image from the image library; Based on the dominant color tone of the images in the image library, image display information is determined. The image display information includes: the display area corresponding to each image in the image library on the first interface, and the display position of each image in the display area. Based on the image display information, the images in the image library are displayed in the first interface in a second display order; When the images in the image library are displayed in the second display order, the first interface includes at least two display areas, each display area is used to display at least one image, and the main color of the images displayed in each display area is within the same color range; Determining image display information based on the dominant color tone of images in the image library includes: According to the arrangement order of the images in the image library, the images in the image library are grouped to obtain multiple groups of images; For each group of images, the images in the group are reordered according to their dominant color tone to obtain the dominant color tone sorting result. Based on the dominant color tone sorting result, the display information of the group of images is determined. The display information includes the display area corresponding to each image in the group of images and the display position of each image in the display area. Based on the display information of the multiple sets of images, the image display information is generated; Wherein, for the i-th group of images, i is an integer greater than 1, the step of re-sorting the images in the group of images according to their dominant color tone to obtain the dominant color tone sorting result of the group of images includes: Determine the position of the dominant hue of each image in the i-th group on the color wheel; Based on the position of the dominant color tone of each image in the i-th group of images on the color wheel, and taking the position of the last image in the (i-1)-th group of images on the color wheel as the starting point, the images in the i-th group of images are reordered in a clockwise or counterclockwise direction according to the color wheel to obtain the dominant color tone sorting result of the i-th group of images.

10. The method according to claim 9, characterized in that, The color ranges corresponding to the at least two display areas are arranged in a preset color order.

11. The method according to claim 9 or 10, characterized in that, For any display area, when the number of images displayed in the display area is multiple, the main color tones of the images displayed in the display area are arranged according to a preset color tone order.

12. The method according to claim 11, characterized in that, The preset hue order is the hue order indicated by the color wheel in a clockwise direction; or, The preset hue order is the hue order indicated by the color wheel in a counter-clockwise direction.

13. The method according to any one of claims 9-10 and 12, characterized in that, Each display area is a rectangular area, which is used to display N rows or N columns of images, where N is an integer greater than or equal to 1.

14. The method according to any one of claims 9-10 and 12, characterized in that, The first display order can be any of the following: The chronological order in which the images were captured; The chronological order of image reception; The order in which images were selected; The order of relevance between images and preset conditions; as well as Preset color tone order.

15. The method according to any one of claims 9-10 and 12, characterized in that, The image rearrangement instruction includes: A first user operation is detected on the first interface. The first user operation is any one of the following operations: icon click operation, interface zoom operation, and image filtering operation. or, A change in the number of images in the image library was detected.

16. The method according to claim 9, characterized in that, For the first set of images; Based on the dominant color tone of the images in this group, the images are reordered to obtain the dominant color tone sorting result, including: Determine the position of the dominant hue of each image in the first group of images on the color wheel; Based on the position of the dominant color tone of each image in the first group of images on the color wheel, starting from the position of the first image in the first group of images on the color wheel, the images in the first group of images are reordered in a clockwise or counterclockwise direction to obtain the dominant color tone sorting result of the first group of images.

17. An image processing method, characterized in that, include: Perform image search processing based on the search request to obtain an image set; The images in the image set satisfy the first search condition; Based on the dominant color tone of the images in the image set, image display information is generated. The image display information includes: the display area corresponding to each image in the image set in the first interface and the display position of each image in the display area. The address information of the images in the image set and the image display information are sent to the terminal device. The image display information is used to instruct the terminal device to display multiple images in the image set in the first interface. The first interface includes at least two display areas, each of which is used to display at least one image. The main color of the images displayed in each display area is within the same color range. The step of generating image display information based on the dominant color tone of the images in the image set includes: According to the order in which the images are arranged in the image set, the images in the image set are grouped to obtain multiple groups of images; For each group of images, the images in the group are reordered according to their dominant color tone to obtain the dominant color tone sorting result. Based on the dominant color tone sorting result, the display information of the group of images is determined. The display information includes the display area corresponding to each image in the group of images and the display position of each image in the display area. Based on the display information of the multiple sets of images, the image display information is generated; Wherein, for the i-th group of images, i is an integer greater than 1, the step of re-sorting the images in the group of images according to their dominant color tone to obtain the dominant color tone sorting result of the group of images includes: Determine the position of the dominant hue of each image in the i-th group on the color wheel; Based on the position of the dominant color tone of each image in the i-th group of images on the color wheel, and taking the position of the last image in the (i-1)-th group of images on the color wheel as the starting point, the images in the i-th group of images are reordered in a clockwise or counterclockwise direction according to the color wheel to obtain the dominant color tone sorting result of the i-th group of images.

18. The method according to claim 17, characterized in that, The color ranges corresponding to the at least two display areas are arranged in a preset color order.

19. The method according to claim 17 or 18, characterized in that, For any display area, when the number of images displayed in the display area is multiple, the main color tones of the images displayed in the display area are arranged according to a preset color tone order.

20. The method according to claim 19, characterized in that, The preset hue order is the hue order indicated by the color wheel in a clockwise direction; or, The preset hue order is the hue order indicated by the color wheel in a counter-clockwise direction.

21. A terminal device, characterized in that, include: memory and processor; The processor is configured to be coupled to the memory, read and execute instructions in the memory to implement the method of any one of claims 1 to 8, or to implement the method of any one of claims 9 to 16.

22. A server, characterized in that, include: memory and processor; The processor is configured to be coupled to the memory, read and execute instructions in the memory to implement the method of any one of claims 17 to 20.

23. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores computer instructions that, when executed, implement the method according to any one of claims 1 to 8, or the method according to any one of claims 9 to 16, or the method according to any one of claims 17 to 20.

24. A computer program product, characterized in that, The computer program product includes a computer program that, when executed, implements the method according to any one of claims 1 to 8, or the method according to any one of claims 9 to 16, or the method according to any one of claims 17 to 20.

Images