Image processing method, device, computer equipment and storage medium
By obtaining the main color of the underlying image of the page and obtaining filter parameters based on the material color value information, the main color is updated to the target color and merging it with the page material elements, the problem of low page image generation efficiency is solved, and the contrast between the main color and the material elements is enhanced.
Patent Information
- Application Number
- CN202010313936.5
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2020-04-20
- Publication Date
- 2025-08-22
- Estimated Expiration
- 2040-04-20
AI Technical Summary
In the prior art, when directly applying the main color of the page material picture to the page, it may cause the contrast between the remaining elements in the page and the main color to be too small, and complex operations are required to enhance the contrast, resulting in low efficiency of page image generation.
By obtaining the main color of the underlying image of the page, determining the target brightness value, and obtaining the target filter parameters based on the material color value information, updating the main color to the target color, combining it with the page material elements, and generating the target page image.
Improves page image generation efficiency, enhances the contrast between the main color and the page material elements without adjusting the remaining elements.
Smart Images

Figure CN113538601B_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the field of Internet technology, and in particular to image processing methods, devices, computer equipment, and storage media. Background Art
[0002] With the development of multimedia technology and network equipment, image data on the Internet is growing rapidly, and users are using image information more and more frequently.
[0003] In the prior art, when operating a page, the primary color (i.e., the color with the highest pixel ratio) in the source image can be extracted and reapplied to the page, such as for background filling. However, directly applying the extracted primary color to the page may cause the contrast between the remaining elements on the page (such as controls, text, etc.) and the primary color to be too small, and thus a series of complex operations need to be performed on the remaining elements on the page to enhance the contrast between the background color and the remaining elements in the page image, which in turn leads to low efficiency in generating the page image. Summary of the Invention
[0004] The embodiments of the present application provide an image processing method, apparatus, computer device, and storage medium, which can improve the efficiency of generating page images.
[0005] An embodiment of the present application provides an image processing method, including:
[0006] Get the main color in the bottom image of the page, and determine the target brightness value of the main color based on the target color value information corresponding to the main color;
[0007] Obtain the material color value information corresponding to the page material element, and obtain the target filter parameters corresponding to the target brightness value based on the material color value information;
[0008] The main color in the page bottom layer image is updated to the target color according to the target filter parameter, and the page bottom layer image with the target color is merged with the page material element to obtain the target page image for display.
[0009] The above method of obtaining the main color of the underlying image of the page includes:
[0010] Obtaining an underlying image of the page, and classifying color value information corresponding to pixels contained in the underlying image of the page to obtain at least two color value categories;
[0011] Accumulate the color value information contained in each color value category to obtain the total color value corresponding to each color value category;
[0012] Count the number of color value information contained in each color value category respectively, and obtain the average color value corresponding to each color value category based on the number and the total color value;
[0013] Get the main color in the underlying image of the page based on the average color value.
[0014] The above-mentioned determination of the target brightness value of the main color according to the color value information corresponding to the main color includes:
[0015] Get the target color value information corresponding to the main color, and get the brightness coefficient corresponding to the target color value information;
[0016] Multiply the target color value information by the brightness coefficient to obtain the target brightness value corresponding to the main color.
[0017] The above-mentioned step of obtaining the target filter parameters corresponding to the target brightness value according to the material color value information includes:
[0018] Obtaining a brightness mapping relationship table corresponding to the material color value information; the brightness mapping relationship table includes brightness value ranges corresponding to at least two filter parameters, and the at least two filter parameters include a target filter parameter;
[0019] The target filter parameters corresponding to the primary color are determined according to the brightness value range to which the target brightness value belongs in the brightness mapping relationship table.
[0020] The brightness mapping relationship table corresponding to the obtained material color value information includes:
[0021] Obtaining a candidate brightness value corresponding to each color value information in a color value information set; the color value information set includes color value information contained in a color space;
[0022] Obtain the contrast between each candidate brightness value and the material color value information, and determine the filter parameters corresponding to each candidate brightness value based on the contrast and visualization parameters;
[0023] Generate a brightness mapping relationship table based on the filter parameters corresponding to each candidate brightness value.
[0024] The above-mentioned determination of the filter parameters corresponding to each candidate brightness value based on the contrast and visualization parameters includes:
[0025] If the contrast is less than the visualization parameter, the contrast less than the visualization parameter is determined as the target contrast, and the update filter parameter corresponding to the target contrast is determined according to the filter increment parameter;
[0026] The target contrast is updated according to the updated filter parameters. When the updated target contrast is greater than or equal to the visualization parameter, the updated filter parameters are determined as filter parameters of the candidate brightness value corresponding to the target contrast.
[0027] The brightness mapping relationship table is generated based on the filter parameters corresponding to each selected brightness value, including:
[0028] Grouping each candidate brightness value according to the filter parameters corresponding to each candidate brightness value to obtain at least two brightness groups; the candidate brightness values included in each brightness group have the same filter parameters;
[0029] Determine the brightness value range corresponding to each brightness group according to the maximum brightness value to be selected and the minimum brightness value to be selected in each brightness group;
[0030] A brightness mapping relationship table is generated according to the mapping relationship between the filter parameters corresponding to each brightness group and the brightness value range.
[0031] The above-mentioned updating of the main color in the underlying image of the page to the target color according to the target filter parameter, merging the underlying image of the page with the target color with the page material element to obtain the target page image for display includes:
[0032] generating an unadjusted page image according to the page material elements and the underlying page image having the primary color, and displaying the unadjusted page image in a first display area of the image preview interface;
[0033] Displaying the filter image corresponding to the target filter parameters in the second display area of the image preview interface;
[0034] According to the filter image, the main color in the unadjusted page image is updated to the target color to obtain the target page image, and the target page image is displayed in the third display area of the image preview interface.
[0035] Among them, the image preview interface includes a filter parameter input box;
[0036] The method further includes:
[0037] In response to a parameter adjustment trigger operation in the filter parameter input box, obtaining the filter adjustment parameters in the filter parameter input box, and updating and displaying the filter image in the second display area as the filter adjustment image according to the filter adjustment parameters;
[0038] The image is adjusted according to the filter, the target page image is adjusted in the third display area, and the adjusted target page image is displayed.
[0039] The above-mentioned updating of the main color in the underlying image of the page to the target color according to the target filter parameter, merging the underlying image of the page with the target color with the page material element to obtain the target page image for display includes:
[0040] Overlay the target filter parameters with the main color, and update the main color in the underlying image of the page to the target color;
[0041] According to the display position information of the page material element in the multimedia page, the page material element is superimposed with the page bottom layer image with the target color to obtain the target page image, and the target page image is displayed in the multimedia page.
[0042] The above-mentioned color superposition of the target filter parameter and the main color to update the main color in the underlying image of the page to the target color includes:
[0043] Obtaining initial parameters corresponding to the primary color, and determining a first transition parameter based on the target color value information, the initial parameters, and the target filter parameters;
[0044] Obtaining a filter image corresponding to the target filter parameter, and determining a second transition parameter according to color value information corresponding to the filter image and the target filter parameter;
[0045] A third transition parameter is determined according to the initial parameter and the target filter parameter, a parameter sum of the first transition parameter and the second transition parameter is determined, and a target color is determined according to a ratio of the parameter sum to the third transition parameter.
[0046] The page material elements include page controls and page text, and the target filter parameters include first filter parameters corresponding to the page controls and second filter parameters corresponding to the page text.
[0047] The above method updates the main color of the page underlying image to the target color according to the target filter parameters, merges the page underlying image with the target color with the page material element, and obtains the target page image for display, including:
[0048] Segmenting the underlying image of the page according to the display position information of the page controls and the page text in the multimedia page to obtain a first underlying image corresponding to the page controls and a second underlying image corresponding to the page text;
[0049] updating the main color in the first underlying image to a first updated sub-color according to the first filter parameter, and merging the first underlying image having the first updated sub-color with the page control to obtain a first page sub-image;
[0050] updating the main color in the second underlying image to a second updated sub-color according to the second filter parameter, and merging the second underlying image having the second updated sub-color with the page file to obtain a second page sub-image;
[0051] The first page sub-image and the second page sub-image are spliced together to obtain a target page image, and the target page image is displayed in the multimedia page.
[0052] In one aspect, an embodiment of the present application provides an image processing device, including:
[0053] A determination module is used to obtain the main color in the bottom image of the page and determine the target brightness value of the main color based on the target color value information corresponding to the main color;
[0054] An acquisition module is used to obtain the material color value information corresponding to the page material element, and obtain the target filter parameters corresponding to the target brightness value according to the material color value information;
[0055] The merging module is used to update the main color in the page bottom image to the target color according to the target filter parameters, merge the page bottom image with the target color with the page material element, and obtain the target page image for display.
[0056] The determination module includes:
[0057] A classification unit is used to obtain the bottom layer image of the page, classify the color value information corresponding to the pixels contained in the bottom layer image of the page, and obtain at least two color value categories;
[0058] An accumulation unit, configured to accumulate the color value information contained in each color value category to obtain a total color value corresponding to each color value category;
[0059] The averaging unit is used to count the number of color value information contained in each color value category, and obtain the average color value corresponding to each color value category based on the number and the total color value;
[0060] The main color acquisition unit is used to acquire the main color in the bottom layer image of the page according to the average color value.
[0061] The determination module includes:
[0062] A coefficient acquisition unit is used to obtain target color value information corresponding to the main color and obtain a brightness coefficient corresponding to the target color value information;
[0063] The calculation unit is used to perform a product operation on the target color value information and the brightness coefficient to obtain the target brightness value corresponding to the main color.
[0064] The acquisition module includes:
[0065] A relationship table acquisition unit is used to acquire a brightness mapping relationship table corresponding to the material color value information; the brightness mapping relationship table includes brightness value ranges corresponding to at least two filter parameters, and the at least two filter parameters include a target filter parameter;
[0066] The parameter determination unit is used to determine the target filter parameter corresponding to the main color according to the brightness value range to which the target brightness value belongs in the brightness mapping relationship table.
[0067] The relationship table acquisition unit includes:
[0068] The brightness value acquisition subunit is used to obtain the candidate brightness value corresponding to each color value information in the color value information set; the color value information set includes the color value information contained in the color space;
[0069] The contrast acquisition subunit is used to obtain the contrast between each candidate brightness value and the material color value information, and determine the filter parameters corresponding to each candidate brightness value according to the contrast and visualization parameters;
[0070] The relationship table generating subunit is used to generate a brightness mapping relationship table according to the filter parameters corresponding to each brightness value to be selected.
[0071] The contrast acquisition subunit includes:
[0072] a contrast comparison subunit, configured to determine the contrast less than the visualization parameter as a target contrast if the contrast is less than the visualization parameter, and determine an updated filter parameter corresponding to the target contrast according to the filter increment parameter;
[0073] The updating subunit is configured to update the target contrast according to the updated filter parameter, and when the updated target contrast is greater than or equal to the visualization parameter, determine the updated filter parameter as the filter parameter of the candidate brightness value corresponding to the target contrast.
[0074] The relationship table generation subunit includes:
[0075] a grouping subunit, configured to group each candidate brightness value according to the filter parameters corresponding to each candidate brightness value, to obtain at least two brightness groups; the candidate brightness values contained in each brightness group have the same filter parameters;
[0076] a brightness value range determination subunit, configured to determine the brightness value range corresponding to each brightness group according to the maximum brightness value to be selected and the minimum brightness value to be selected in each brightness group;
[0077] The mapping relationship generating subunit is used to generate a brightness mapping relationship table according to the mapping relationship between the filter parameters corresponding to each brightness group and the brightness value range.
[0078] The merge module includes:
[0079] A first display unit is configured to generate an unadjusted page image based on the page material elements and the underlying page image having the primary color, and to display the unadjusted page image in a first display area of the image preview interface;
[0080] A second display unit, configured to display a filter image corresponding to the target filter parameters in a second display area of the image preview interface;
[0081] The third display unit is used to update the main color in the unadjusted page image to the target color according to the filter image, obtain the target page image, and display the target page image in the third display area of the image preview interface.
[0082] Among them, the image preview interface includes a filter parameter input box;
[0083] The device also includes:
[0084] a response module, configured to respond to a parameter adjustment trigger operation in the filter parameter input box, obtain the filter adjustment parameters in the filter parameter input box, and update the filter image in the second display area to display the filter adjustment image according to the filter adjustment parameters;
[0085] The image adjustment module is used to adjust the image according to the filter, adjust the target page image in the third display area, and display the adjusted target page image.
[0086] The merge module includes:
[0087] A color overlay unit is used to overlay the target filter parameters with the main color, and update the main color in the underlying image of the page to the target color;
[0088] The element superposition unit is used to superimpose the page material element with the page bottom image with the target color according to the display position information of the page material element in the multimedia page to obtain the target page image, and display the target page image in the multimedia page.
[0089] The color overlay unit is specifically used for:
[0090] Obtaining initial parameters corresponding to the primary color, and determining a first transition parameter based on the target color value information, the initial parameters, and the target filter parameters;
[0091] Obtaining a filter image corresponding to the target filter parameter, and determining a second transition parameter according to color value information corresponding to the filter image and the target filter parameter;
[0092] A third transition parameter is determined according to the initial parameter and the target filter parameter, a parameter sum of the first transition parameter and the second transition parameter is determined, and a target color is determined according to a ratio of the parameter sum to the third transition parameter.
[0093] The page material elements include page controls and page text, and the target filter parameters include first filter parameters corresponding to the page controls and second filter parameters corresponding to the page text.
[0094] The merge module includes:
[0095] An image segmentation unit is used to segment the underlying image of the page according to the display position information of the page controls and the page text in the multimedia page, to obtain a first underlying image corresponding to the page controls and a second underlying image corresponding to the page text;
[0096] a first image merging unit, configured to update a main color in the first underlying image to a first updated sub-color according to a first filter parameter, and merge the first underlying image having the first updated sub-color with the page control to obtain a first page sub-image;
[0097] a second image merging unit, configured to update the main color in the second underlying image to a second updated sub-color according to a second filter parameter, and merge the second underlying image having the second updated sub-color with the page file to obtain a second page sub-image;
[0098] The splicing unit is used to splice the first page sub-image and the second page sub-image to obtain a target page image, and display the target page image in the multimedia page.
[0099] One aspect of an embodiment of the present application provides a computer device, including a memory and a processor, wherein the memory stores a computer program. When the computer program is executed by the processor, the processor executes the steps of the method in one aspect of the embodiment of the present application.
[0100] On one hand, an embodiment of the present application provides a computer-readable storage medium, which stores a computer program. The computer program includes program instructions. When the program instructions are executed by a processor, the steps of the method in one aspect of the embodiment of the present application are executed.
[0101] The embodiment of the present application can obtain the main color in the bottom image of the page, determine the target brightness value of the main color according to the target color value information corresponding to the main color, and then obtain the target filter parameters corresponding to the target brightness value according to the material color value information corresponding to the page material element, adjust the main color in the bottom image of the page to the target color according to the target filter parameters, merge the bottom image of the page with the target color with the page material element, and obtain the target page image for display. It can be seen that after the main color in the bottom image of the page is extracted, the brightness value of the main color can be converted, and the filter parameters corresponding to the brightness value and the main color can be superimposed to achieve the visualization standard in the page, that is, to enhance the contrast between the main color and the page material element. By directly obtaining the filter parameters corresponding to the main color and superimposing the filter parameters on the main color, there is no need to adjust the other elements in the page, which can improve the generation efficiency of the page image. BRIEF DESCRIPTION OF THE DRAWINGS
[0102] In order to more clearly illustrate the embodiments of the present application or the technical solutions in the prior art, the following briefly introduces the drawings required for use in the embodiments or the description of the prior art. Obviously, the drawings described below are only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without any creative work.
[0103] Figure 1 This is a network architecture diagram provided by an embodiment of the present application;
[0104] Figure 2 This is a schematic diagram of an image processing scenario provided by an embodiment of the present application;
[0105] Figure 3 This is a flowchart of an image processing method provided by an embodiment of the present application;
[0106] Figure 4 This is a schematic diagram of generating a brightness mapping relationship table provided in an embodiment of the present application;
[0107] Figure 5a and Figure 5b This is a schematic diagram of generating a target page image provided by an embodiment of the present application;
[0108] Figure 6 This is a schematic diagram of an interface of a target page image provided by an embodiment of the present application;
[0109] Figure 7 This is a schematic diagram of a target page image generation process provided by an embodiment of the present application;
[0110] Figure 8 is a structural diagram of an image processing device provided in an embodiment of the present application;
[0111] Figure 9 It is a structural diagram of a computer device provided in an embodiment of the present application. DETAILED DESCRIPTION
[0112] The following will be combined with the drawings in the embodiments of this application to clearly and completely describe the technical solutions in the embodiments of this application. Obviously, the embodiments described are only part of the embodiments of this application, not all of the embodiments. Based on the embodiments in this application, all other embodiments obtained by ordinary technicians in this field without making creative efforts are within the scope of protection of this application.
[0113] See Figure 1 , is a network architecture diagram provided by an embodiment of the present application. The network architecture may include a server 10d and multiple terminal devices (such as Figure 1As shown, it specifically includes terminal device 10a, terminal device 10b and terminal device 10c. Each terminal device may include a client, which can be used to generate page images for users (such as music playback main page image, e-book reading main page image and radio station main page image, etc.), and display the generated page images in the client; server 10d can be the background server of the client, server 10d can be used to store and obtain image data, and server 10d can transmit data with each terminal device. Taking terminal device 10a as an example, terminal device 10a can collect material image data (such as album cover, book cover, banner image, etc.), terminal device 10a can send the extracted material image data to server 10d, and server 10d can store the material image data. Of course, server 10d can also be used to store elements such as page controls and page text in multimedia pages, wherein multimedia pages include but are not limited to: music playback main page in music applications, e-book reading main page in reading applications, and radio station main page in radio applications. The terminal device 10a can use the material image data stored in the background server as the page bottom image in the multimedia page, which can also be understood as the page background image other than the page controls and page text in the multimedia page, and extract the main color from the page bottom image, compare the extracted main color with the page controls and page text in the multimedia page, filter the main color according to the comparison result, merge the filtered main color with the page controls and page text in the multimedia page, and obtain a page image for display. It can be understood that the image processing scheme proposed in the embodiment of the present application can be executed by the terminal device, or by the server, or by a computer program (including program code) in the computer device. For example, the image processing scheme is executed by an application software, the background server of the application software can store the page bottom image, and the client of the application software can extract the main color in the page bottom image, filter the extracted main color, and fill the page containing the page bottom image with the filtered main color to obtain a page image for display.
[0114] Among them, terminal device 10a, terminal device 10b and terminal device 10c may include mobile phones, tablet computers, laptop computers, PDAs, mobile internet devices (MIDs), wearable devices (such as smart watches, smart bracelets, etc.) or other terminal devices that can display images and support image processing.
[0115] See Figure 2 , is a schematic diagram of an image processing scenario provided by an embodiment of the present application, based on the above Figure 1The image processing process is described below by taking the terminal device 10a in the corresponding embodiment as an example. Figure 2 As shown, during page operation, the terminal device 10a can use the image 20a as the underlying image of the page and obtain the color value information corresponding to the pixels contained in the image 20a. The color value information can be an RGB color value (a color standard used to represent the colors of the three color channels of red, green, and blue); the terminal device 10a can traverse the pixels contained in the image 20a, and by accumulating the red, green, and blue components in the color value information of each pixel, obtain the average value corresponding to the three components, and obtain a new color, and use the above new color as the main color 20b of the image 20a. The process of the terminal device 10a traversing the pixels may include but is not limited to: the terminal device 10a can traverse all the pixels contained in the image 20a in sequence, or traverse the pixels contained in the image 20a in a jumpy manner, such as taking a value every four pixels, or traversing the pixels in the image 20a that fall within a threshold range.
[0116] After extracting the main color 20b in the image 20a, the terminal device 10a can calculate the relative brightness of the main color 20b (also known as the target brightness value) as 0.527055 based on the color value information corresponding to the main color 20b; the terminal device 10a can obtain the brightness mapping relationship table 20c based on the color value information of the controls and page text that already exist in the page. The brightness mapping relationship table 20c is used to represent the mapping relationship between relative brightness and transparency, that is, the brightness mapping relationship table 20c can include the brightness value range corresponding to each transparency, such as the brightness mapping relationship table In 20c, the transparency is divided into 0, 10%, 20%, 30%, 40%, etc. with a gradient of 10%. The minimum brightness value corresponding to the transparency of 0 is 0, the minimum brightness value corresponding to the transparency of 10% is 0.3000000270676697, the minimum brightness value corresponding to the transparency of 20% is 0.3785699356352903, the minimum brightness value corresponding to the transparency of 30% is 0.491792922839291, and the minimum brightness value corresponding to the transparency of 40% is 0.6633507846819638, etc. In other words, the brightness value range corresponding to transparency 0 is: [0, 0.3000000270676697), the brightness value range corresponding to transparency 10% is: [0.3000000270676697, 0.3785699356352903), the brightness value range corresponding to transparency 20% is: [0.3785699356352903, 0.491792922839291), the brightness value range corresponding to transparency 30% is: [0.491792922839291, 0.6633507846819638), etc. Here, the brightness value ranges corresponding to each transparency are all inclusive on the left and exclusive on the right. By querying the brightness mapping relationship table 20c, it can be obtained that the transparency corresponding to the main color 20b is: 30%; the terminal device 10a can adjust the main color 20b according to the transparency of 30%, that is, perform filter processing on the main color 20b to obtain the target color 20d.
[0117] The terminal device 10a can use the target color 20d as the entire background fill color of the page, and obtain the controls in the page (such as the "Share" control, the "Details" reading control, etc.) and page text (such as "A day's plan begins in the morning", etc.), and superimpose the underlying image of the page with the target color 20d, the controls and the page text according to the display positions of the controls and the page text in the page respectively to obtain a page image 20e, and display the page image 20e in the multimedia page of the terminal device 10a. The user can view the page image 20e in the multimedia page, and by triggering the controls in the page image 20e, trigger the terminal device 10a to switch the page image 20e displayed in the multimedia page, or jump to information. For example, the user can click the "Share" control in the page image 20e, and the terminal device 10a can respond to the user's click operation on the "Share" control and display a sharing interface for the content displayed by the page image 20e in the multimedia page, so that the user can share the content displayed by the page image 20e to other information publishing platforms.
[0118] See Figure 3 , is a flow chart of an image processing method provided by an embodiment of the present application. Figure 3 As shown, the image processing method may include the following steps:
[0119] Step S101 : obtaining the main color in the bottom layer image of the page, and determining the target brightness value of the main color according to the target color value information corresponding to the main color.
[0120] Specifically, the terminal device can obtain the underlying image of the page and extract the color value with the highest pixel ratio in a specified area of the underlying image of the page as the main color in the underlying image of the page, and then convert the target color value information corresponding to the main color into a relative brightness (i.e., a target brightness value). The underlying image of the page can be a material image extracted by the terminal device, and the underlying image of the page can include but is not limited to: an album cover image, a book cover image, a page banner image, a portrait image, and a landscape image; the color value information can refer to the color value of the pixel points contained in the underlying image of the page, and the color value information can be described by three independent attributes, such as using RGB color values to represent color value information, R is used to represent red, G is used to represent green, and B is used to represent blue, or using YUV (a color encoding method) values to represent color value information, Y is used to represent a brightness signal, and U and V are used to represent two chrominance signals, or using HSV (a method of representing points in an RGB color space in an inverted cone) values to represent color value information, H is used to represent hue, S is used to represent saturation, and V is used to represent value. For the convenience of description, RGB color values are used to represent color value information in the embodiments of the present application.
[0121] Methods for obtaining the primary color in the underlying image of the page may include, but are not limited to, clustering algorithms, octree extraction algorithms, minimum interpolation methods, and median segmentation methods. For example, a terminal device may obtain the underlying image of the page, classify the color value information corresponding to the pixels contained in the underlying image of the page to obtain at least two color value categories; accumulate the color value information contained in each color value category to obtain the total color value corresponding to each color value category; count the number of color value information contained in each color value category, and obtain the average color value corresponding to each color value category based on the number and the total color value; and obtain the primary color in the underlying image of the page based on the average color value. In other words, the terminal device can traverse the pixel points contained in the underlying image of the page, classify the RGB color values corresponding to the pixel points, and obtain at least two color value categories. For example, the same RGB color value can be divided into one color value category, or the RGB color values within each threshold range can be divided into one color value category, or a clustering algorithm is used to classify the RGB color values contained in the underlying image of the page, etc., which is not limited here; by counting the number of RGB color values contained in each color value category, that is, the frequency of the RGB color values contained in each color value category in the underlying image of the page, the R, G, and B values in each color value category are accumulated respectively, and the accumulated R, G, and B values are divided by the above-mentioned statistical number to obtain the mean of the three components of R, G, and B, and the mean of the three components of R, G, and B is used as the average value corresponding to the corresponding color value category; and then the main color in the underlying image of the page can be determined according to the average value corresponding to each color value category. For example, the average value corresponding to the color value category with the largest amount of color value information can be used as the main color in the underlying image of the page, or the terminal device can use the maximum average value among the average values corresponding to each color value category as the main color in the underlying image of the page.
[0122] The process of converting the color value information of the main color into the target brightness value by the terminal device may include: the terminal device may obtain the target color value information corresponding to the main color, obtain the brightness coefficient corresponding to the target color value information, and perform a product operation on the target color value information and the brightness coefficient to obtain the target brightness value corresponding to the main color. In other words, after obtaining the RGB color value corresponding to the main color, the terminal device may obtain the brightness coefficient corresponding to the RGB color value, such as the brightness coefficient corresponding to the R value is a1, the brightness coefficient corresponding to the G value is a2, and the brightness coefficient corresponding to the B value is a3, wherein a1, a2, and a3 may be pre-set parameters, and the results of multiplying a1 by the R value, a2 by the G value, and a3 by the B value are accumulated to obtain the target brightness value corresponding to the main color, which may also be called the target relative brightness, that is, the target brightness value L = a1*R+a2*G+a3*B. For example, the initial RGB color value corresponding to the main color is [0, 100, 200], a1 is 0.2126, a2 is 0.7152, and a3 is 0.0722. The terminal device can convert the initial RGB color value of the main color to obtain a converted RGB color value (i.e., including R value, G value, and B value). The conversion process of the initial RGB can be expressed as: dividing the initial R, G, and B components in the initial RGB color value by 255 respectively (the value range of the three components of R, G, and B in the RGB color space is 0~255, which can be understood as normalizing the three components of R, G, and B), and obtaining the unit value value corresponding to the three components, and passing value<=0.03928? value / 12.92: math.pow((value+0.055) / 1.055, 2.4) calculates the RGB color value after the initial RGB color value is converted. Here, math.pow(a, b) is used to solve a raised to the power of b. When the unit value is less than or equal to 0.03928, the value / 12.92 operation can be executed to obtain the converted value. When the unit value is greater than 0.03928, the math.pow((value+0.055) / 1.055, 2.4) operation can be executed to obtain the converted value. Therefore, when the initial RGB color value corresponding to the main color is [0, 100, 200], the converted R value is: 0, the converted G value is: (100 / 255+0.055) / 1.055 to the power of 2.4, and the converted B value is: (200 / 255+0.055) / 1.055 to the power of 2.4. Through the formula L=a1*R+a2*G+a3*B, the target brightness value L of the main color can be obtained as: 0.1328447368465958.
[0123] Step S102: obtaining material color value information corresponding to the page material element, and obtaining target filter parameters corresponding to the target brightness value according to the material color value information.
[0124] Specifically, the terminal device can obtain page material elements and obtain material color value information corresponding to the page material elements, and obtain target filter parameters corresponding to the target brightness value in the case of the material color value information. Among them, the page material elements can include elements such as page controls and page text in the multimedia page, and the material color value information can include color values (such as RGB color values) corresponding to the page controls and page text respectively. The RGB color values corresponding to the page controls and the color values corresponding to the page text can be the same or different; the target filter parameters can include color transparency, saturation, brightness, and other special color mixing modes. The terminal device can obtain the mapping relationship between the brightness value and the filter parameter in advance. For different material color value information, the mapping relationship between the brightness value and the filter parameter can be different. The mapping relationship between the brightness value and the filter parameter can be stored in the local database of the terminal device in the form of a mapping relationship table. Of course, the mapping relationship table can also be stored in a cloud database, cloud storage space, backend server, or other device with storage function. The terminal device can obtain it from a cloud database, cloud storage space, backend server, or other device with storage function when in use. No specific limitation is made here. After determining the material color value information corresponding to the page material element, the terminal device can obtain the brightness mapping relationship table corresponding to the material color value information. The brightness mapping relationship table includes at least two brightness value ranges corresponding to filter parameters. The target filter parameters corresponding to the main color can be determined based on the brightness value range to which the target brightness value belongs in the brightness mapping relationship table, that is, the filter parameters corresponding to the brightness value range to which the target brightness value belongs in the brightness mapping relationship table are used as the target filter parameters corresponding to the main color. For example, the local database of the terminal device stores brightness mapping relationship table 1, brightness mapping relationship table 2, brightness mapping relationship table 3 and brightness mapping relationship table 4, each brightness mapping relationship table includes at least two brightness value ranges corresponding to filter parameters, wherein brightness mapping relationship table 1 corresponds to white page material elements, brightness mapping relationship table 2 corresponds to black page material elements, brightness mapping relationship table 3 corresponds to green page material elements, and brightness mapping relationship table 4 corresponds to red page material elements; when the terminal device determines that the material color value information represents white, it can obtain brightness mapping relationship table 1 from the local database, and determine the filter parameters corresponding to the brightness value range of the target brightness value in the brightness mapping relationship table 1 as the target filter parameters corresponding to the main color.
[0125] Among them, the terminal device can obtain a brightness mapping relationship table between brightness values and filter parameters in advance, and can use the brightness mapping relationship table when operating the page, which can enhance the efficiency of generating page images. The specific generation process of the brightness mapping relationship table may include: the terminal device can obtain the candidate brightness value corresponding to each color value information in the color value information set, and the color value information set may include the color value information contained in the color space, and then obtain the contrast between each candidate brightness value and the material color value information, and determine the filter parameters corresponding to each candidate brightness value according to the contrast and visualization parameters. According to the filter parameters corresponding to each candidate brightness value, a brightness mapping relationship table can be generated. It is understandable that before generating the brightness mapping relationship table, the terminal device needs to set the initial parameters. The material color value information corresponding to the page material element can be set as the contrast color value parameter. For example, when the page material element is white, the contrast color value parameter can be #ffffff (RGB color value expressed in hexadecimal); set the color visualization standard, that is, the visualization parameter in the page display, such as the visualization parameter can be set to 3; set the filter increment parameter, that is, the incremental value of the filter parameter, such as the filter increment parameter can be set to 10%. The terminal device can traverse the color value information in the color space, where the color space can refer to the RGB color space, or the YUV color space, or the HSV color space, etc.; when the color space is the RGB color space, the color value information set can include the RGB color values contained in the RGB color space, and the three components R, G, and B in RGB each have 256 levels of brightness, represented by the numbers 0-255, and the color value information set can include 255*255*255 RGB color values; when the color space is the YUV color space, the color value information set can include the YUV color values contained in the YUV color space; when the color space is the HSV color space, the color value information set can include the HSV color values contained in the HSV color space.
[0126] The terminal device can calculate the candidate brightness value corresponding to each color value information in the color value information set. The calculation process of the candidate brightness value can be found in the description of the target brightness value calculation process in step S101 above and will not be repeated here. The material brightness value corresponding to the material color value information can be obtained, and the contrast between each candidate brightness value and the material brightness value can be calculated. Based on the relationship between the contrast and the visualization parameter, the filter parameter corresponding to each candidate brightness value can be determined. Furthermore, if the contrast is less than the visualization parameter, the contrast less than the visualization parameter is determined as the target contrast. The updated filter parameter corresponding to the target contrast is determined based on the filter increment parameter. The target contrast is updated based on the updated filter parameter. When the updated target contrast is greater than or equal to the visualization parameter, the updated filter parameter is determined as the filter parameter for the candidate brightness value corresponding to the target contrast. The updated filter parameter refers to the new filter parameter obtained by increasing the filter parameter corresponding to the target contrast based on the filter increment parameter. For example, if the filter parameter corresponding to the target contrast is 10%, and the filter increment parameter is 10%, the updated filter parameter can be 20%. In other words, when the contrast between the brightness value to be selected and the brightness value of the material is greater than or equal to the visualization parameter, it indicates that the color corresponding to the current brightness value to be selected meets the visualization conditions when displayed on the same page with the page material element (that is, the page image has clear and eye-catching visual characteristics), and the filter parameter corresponding to the current brightness value to be selected is 0; when the contrast between the brightness value to be selected and the brightness value of the material is less than the visualization parameter, it indicates that the current brightness value to be selected does not meet the visualization conditions when displayed on the same page with the page material element (that is, the page image has unclear and gray visual characteristics), and the filter parameter can be increased for the current brightness value to be selected according to the filter increment parameter to obtain the updated filter parameter. For example, when the filter increment parameter is 10%, the filter parameter can be updated. Taking 10% as the update filter parameter of the current candidate brightness value, the current candidate brightness value is updated according to the update filter parameter 10%, that is, the color value information corresponding to the candidate brightness value is superimposed according to the update filter parameter 10%, and the contrast between the updated candidate brightness value and the material brightness value is recalculated to obtain the updated target contrast. If the updated target contrast is still smaller than the visualization parameter, the update filter parameter corresponding to the current candidate brightness value can be further increased according to the filter increment parameter, such as increasing the update filter parameter to 20%, 30%... in sequence until the updated target contrast is greater than or equal to the visualization parameter, and the update filter parameter at this time is determined as the filter parameter corresponding to the current candidate brightness value.
[0127] After the terminal device obtains the filter parameters corresponding to each candidate brightness value, it can generate a brightness mapping relationship table corresponding to the material color value information based on the filter parameters corresponding to each candidate brightness value. Furthermore, the terminal device can group each candidate brightness value according to the filter parameters corresponding to each candidate brightness value to obtain at least two brightness groups, and the candidate brightness values contained in each brightness group have the same filter parameters. Then, based on the maximum candidate brightness value and the minimum candidate brightness value in each brightness group, the brightness value range corresponding to each brightness group can be determined, and based on the mapping relationship between the filter parameters corresponding to each brightness group and the brightness value range, a brightness mapping relationship table can be generated. In other words, the terminal device can record the candidate brightness value corresponding to each color value information and the filter parameters corresponding to the candidate brightness value, and then obtain the brightness value range corresponding to each filter parameter. Based on the mapping relationship between the filter parameters and the brightness value range, a brightness mapping relationship table can be generated.
[0128] Please also see Figure 4 , is a schematic diagram of generating a brightness mapping relationship table provided by an embodiment of the present application. This embodiment of the present application takes the RGB color space as an example to specifically describe the generation process of the brightness mapping relationship table, such as Figure 4 As shown, the process of generating the brightness mapping relationship table may include steps S1-S7.
[0129] S1, set parameters;
[0130] Specifically, the terminal device can set the numerical value entered by the user as the parameter required in the brightness mapping relationship table generation process according to the user's input operation on the parameter. The parameter can be the numerical value entered by the user according to actual needs. The above parameters may include: contrast color value information (i.e., material color value information), visualization parameters, and transparency increment parameters (which can be understood as the above filter increment parameters). When the user does not enter the corresponding numerical value, the terminal device can also use the default value as the parameter. It can be understood that the parameters involved in the brightness mapping relationship table generation process are all set with corresponding default values.
[0131] S2, traverse RGB colors;
[0132] Specifically, the terminal device can traverse the RGB color values (ie, color value information) contained in the RGB color space. The RGB color space can include 255*255*255 RGB color values, so the terminal device needs to traverse 255*255*255 RGB color values.
[0133] S3, calculate relative brightness;
[0134] Specifically, each time the terminal device traverses an RGB color value in the RGB color space, it needs to calculate the relative brightness corresponding to the RGB color value (i.e., the above-mentioned brightness value to be selected). The terminal device can convert the RGB color value, normalize the three components R, G, and B of the RGB color value, and obtain the unit values corresponding to the three components. By comparing the unit values corresponding to the three components with the threshold value (such as 0.03928), the converted values of the three components in the RGB color value can be calculated, and the brightness coefficients corresponding to the three components can be obtained. The three components can be multiplied by the corresponding brightness coefficients respectively, and the values after the multiplication are accumulated to obtain the relative brightness corresponding to each RGB value.
[0135] S4, calculating the contrast between the color value information of the material;
[0136] Specifically, the terminal device can calculate the contrast between the relative brightness corresponding to each RGB color value and the material color value information. The material relative brightness (also called material brightness value) corresponding to the material color value information can be calculated, and the ratio of the maximum value to the minimum value in each RGB color value and the material color value information can be used as the contrast between the two colors. It can be understood that the ratio between the maximum value and the minimum value is a fraction. In order to avoid the denominator being zero (the fraction is invalid at this time), a smaller value (such as 0.05, etc.) can be added to the numerator and denominator of the fraction. Compare the calculated contrast with the visualization parameter. When the contrast is greater than or equal to the visualization parameter, continue to step S6; when the contrast is less than the visualization parameter, continue to step S5.
[0137] S5, increase transparency, the gradient is the transparency increasing parameter;
[0138] Specifically, if the contrast is less than the visualization parameter, it indicates that the visualization condition is not met and the transparency needs to be increased. The transparency is increased according to the transparency increment parameter, the relative brightness of the target color after adding the transparency to the original RGB color value is calculated, and the contrast between the relative brightness of the target color and the material color value information is recalculated. If the recalculated contrast is greater than or equal to the visualization parameter, step S6 is continued; if the recalculated contrast is still less than the visualization parameter, the transparency is increased again according to the transparency increment parameter. For example, when the transparency increment parameter is 10%, the transparency can be increased in sequence to 10%, 20%, 30%... until the calculated contrast is greater than or equal to the visualization parameter.
[0139] S6, records the relative brightness of the color and the corresponding transparency;
[0140] Specifically, after determining the transparency corresponding to the RGB color value in the RGB color space, the relative brightness and corresponding transparency of the RGB color value can be recorded. Each time the transparency corresponding to an RGB color value is determined, the relative brightness and corresponding transparency of the RGB color value can be recorded. Of course, the terminal device can also record the relative brightness and corresponding transparency of each RGB color value after obtaining the transparency corresponding to all RGB color values contained in the RGB color space. For example, if the relative brightness of a certain RGB color value is: 0.1328447368465958, and the transparency corresponding to this RGB color value is 0, it can be recorded as: 0.1328447368465958-0.
[0141] S7, sort out and obtain the minimum relative brightness corresponding to each transparency.
[0142] Specifically, based on the recorded correspondence between relative brightness and transparency, the terminal device can obtain the minimum relative brightness corresponding to each transparency, that is, the brightness value range corresponding to each transparency. Based on the mapping relationship between the brightness value range and the transparency, a brightness mapping relationship table can be generated and stored. For example, when the transparency is 0%, the minimum brightness value corresponding to the transparency is 0, when the transparency is 10%, the minimum brightness value corresponding to the transparency is 0.3000000270676697, and when the transparency is 20%, the minimum brightness value corresponding to the transparency is 0.3785699356352903. This indicates that the brightness value range corresponding to the transparency of 0 is: [0, 0.3000000270676697), and the brightness value range corresponding to the transparency of 10% is: [0.3000000270676697, 0.3785699356352903).
[0143] It should be noted that when any of the material color value information, visualization parameters, and transparency increment parameters changes, a new brightness mapping relationship table can be regenerated according to the above steps S4 to S7, and the newly generated brightness mapping relationship table can be stored.
[0144] Step S103 : updating the main color in the page bottom layer image to the target color according to the target filter parameter, merging the page bottom layer image with the target color with the page material element to obtain a target page image for display.
[0145] Specifically, after obtaining the target filter parameters corresponding to the target brightness value, the terminal device can obtain the target color after adding the target filter parameters to the main color in the page underlying image, use the target color as the overall background color of the page underlying image, merge the page underlying image with the page material element, obtain the target page image, and display the target page image in the image preview interface. The user can preview the page image display effect after adding the target filter parameters in real time in the image preview interface. Among them, the image preview interface of the terminal device can include at least three display areas, namely a first display area, a second display area, and a third display area; the terminal device can generate an unadjusted page image based on the page material element and the page underlying image with the main color, display the unadjusted page image in the first display area of the image preview interface, and display the filter image corresponding to the target filter parameters in the second display area of the image preview interface; based on the filter image, the main color in the unadjusted page image is updated to the target color to obtain the target page image, and display the target page image in the third display area of the image preview interface. In other words, the terminal device can directly use the main color extracted from the underlying image of the page as the overall background color of the underlying image of the page, merge the underlying image of the page with the main color as the overall background color with the page material elements to generate an unadjusted page image, display the unadjusted page image in the first display area, display the filter image corresponding to the target filter parameters in the second display area, superimpose the unadjusted page image with the target filter image to obtain the target page image, and display the target page image in the third display area, that is, the image preview interface can simultaneously display the unadjusted page image with the theme color directly as the overall background color, the filter image corresponding to the target filter parameters, and the target page image with the filter effect added, so that users can intuitively preview the page image display effect after adding the filter effect.
[0146] Optionally, the image preview interface may further include a filter parameter input box. When a user is dissatisfied with the target page image displayed in the image preview interface, the user may modify the target filter parameters. The terminal device may respond to the user's parameter adjustment trigger operation in the filter parameter input box, obtain the filter adjustment parameters in the filter parameter input box, update the filter image in the second display area to display the filter adjustment image based on the filter adjustment parameters, adjust the target page image in the third display area based on the filter adjustment image, and display the adjusted target page image. In other words, the image preview interface may provide the user with a target filter parameter modification function. After the user modifies the target filter parameters, the terminal device may respond to the user's parameter adjustment operation, adjust the target filter parameters, and generate and display a new target page image based on the adjusted target filter parameters. Optionally, the terminal device may cache both the target page image and the adjusted target page image. The user may compare the target page image and the adjusted target page image in the image preview interface and select the filter parameters with the best preview effect as the target filter parameters for the main color.
[0147] Please also see Figure 5a and Figure 5b , is a schematic diagram of generating a target page image provided by an embodiment of the present application. Figure 5a As shown, the image preview interface of the terminal device may include a color value information display box 40a, and the values of the three R, G, and B components of the RGB color value corresponding to the main color may be displayed in the color value information display box 40a. For example, the values of the three R, G, and B components corresponding to the main color are 193, 222, and 63, respectively. The color value displayed in the color value information display box 40a may be that after the terminal device extracts the main color from the underlying image of the page, the RGB color value corresponding to the main color is automatically input into the color value information display box 40a and displayed. Alternatively, after the terminal device extracts the main color from the underlying image of the page, the user inputs the RGB color value corresponding to the main color into the color value information display box 40a. When the user performs an input operation of the RGB color value in the color value information display box 40a, the terminal device may respond to the user's RGB color value input operation and display the RGB color value input by the user in the color value information display box 40a. After obtaining the RGB color value of the main color, the terminal device can obtain the page material element (such as the text "pure color"), merge the page material element with the underlying image of the page with the main color into an unadjusted page image 40b. The display area of the unadjusted page image 40b in the image preview interface can be called the first display area.
[0148] The image preview interface may also include a brightness mapping table 40e for page material elements. This brightness mapping table 40e may include multiple relative brightness interval minimum values corresponding to respective transparencies, such as a minimum brightness value of 0 for a transparency of 0% and a minimum brightness value of 0.3000000270676697 for a transparency of 10%. The terminal device may calculate a target brightness value of the primary color based on the RGB color values corresponding to the primary color: 0.6393888988693083. The terminal device may select standard 1 by default for the primary color, i.e., determine from the brightness mapping table 40e that the target brightness value of 0.6393888988693083 corresponds to a transparency (i.e., a target filter parameter) of 30%. A filter image 40c corresponding to a transparency of 30% may then be displayed in the second display area of the image preview interface. The unadjusted page image 40b may then be superimposed on the filter image 40c to obtain a target page image 40d. The display area of the target page image 40d in the image preview interface may be referred to as the third display area. Optionally, the user can select Standard 2 for the main color, which is a customized filter parameter set by the user for the main color. If the user selects Standard 2, the terminal device can respond to the user's selection operation, use the transparency in Standard 2 as the target filter parameter for the main color, and add the transparency in Standard 2 to the unadjusted page image 40b to obtain a new target page image and display it.
[0149] Optional, such as Figure 5b As shown, the image preview interface may also include a filter parameter input box 40f. When the user is not satisfied with the generated target page image 40d, the user may click on the filter parameter input box 40f and enter a new transparency, such as 40%, in the filter parameter input box 40f. The terminal device may then respond to the user's parameter adjustment operation in the filter parameter input box 40f, use the transparency 40% entered by the user as the filter adjustment parameter after the main color is updated, and display a filter adjustment image 40g corresponding to the filter adjustment parameter in the image preview interface. The terminal device may superimpose the unadjusted page image 40b and the filter adjustment image 40g to obtain an adjusted target page image 40h, and display the adjusted target page image 40h in the image preview interface. The terminal device can cache both the target page image 40d corresponding to the target filter parameter 30% and the adjusted target page image 40h corresponding to the filter adjustment parameter 40%, and can simultaneously display the target page image 40d and the adjusted target page image 40h in the image preview interface, which is beneficial for the user to compare and view the page image display effects when different filter parameters are used in the image preview interface, and then the user can select the filter parameters corresponding to the target page image with the best display effect as the final target filter parameters of the main color.
[0150] Optionally, after determining the final target filter parameters of the main color, the terminal device can superimpose the target filter parameters on the main color, update the main color in the page bottom image to the target color, and superimpose the page material elements with the page bottom image having the target color according to the display position information of the page material elements in the multimedia page to obtain the target page image, and display the target page image in the multimedia page. The terminal device can superimpose the target filter parameters on the main color to obtain a new color. At this time, the new color can be called the target color corresponding to the main color. The target color can be used as the overall background color in the multimedia page, obtain the display position information of the page material elements in the multimedia page, and superimpose the page bottom image having the target color and the page material elements according to the display position information to obtain the target page image, and display the target page image in the multimedia page. The target page image can include: the main page image of the song playback interface, the recommended image of the e-book reading interface, the theme image of the radio display interface, etc. It should be understood that in the operation scenario of a multimedia page, or in the scenario of opening the client in the terminal device and entering the main page of the client, or in the scenario of switching the current page, etc., the terminal device can be triggered to extract the main color in the underlying image of the page, and update the extracted main color to generate the target page image.
[0151] Among them, the process of determining the target color may include: the terminal device can obtain the initial parameters corresponding to the main color, determine the first transition parameters according to the target color value information, the initial parameters and the target filter parameters, and then obtain the filter image corresponding to the target filter parameters, determine the second transition parameters according to the color value information corresponding to the filter image and the target filter parameters, and then determine the third transition parameters according to the initial parameters and the target filter parameters, determine the total parameter amount of the first transition parameter and the second transition parameter, and determine the target color according to the ratio of the total parameter amount to the third transition parameter, wherein the initial parameter may refer to the initial filter parameter of the main color before it is updated to the target color, and here it may also refer to the initial transparency of the main color before it is updated to the target color. Furthermore, the terminal device can obtain the initial transparency a1 corresponding to the main color and the target color value information corresponding to the main color: r1, g1 and b1 (i.e., the numerical values corresponding to the three components of R, G, and B in the RGB color value corresponding to the main color), and can also obtain the filter image corresponding to the target filter parameter a2 (the filter image contains only one color by default). The color value information corresponding to the filter image is: r2, g2 and b2 (i.e., the numerical values corresponding to the three components of R, G, and B in the RGB color value corresponding to the filter image); the terminal device can calculate the first transition parameter t1 by value1*a1*(1-a2), calculate the second transition parameter t2 by value2*a2, calculate the third transition parameter t3 by (a1+a2-a1*a2).toFixed(2), and calculate the new RGB value by (t1+t2) / t3. The new RGB value obtained by the calculation is the color value information corresponding to the target color. Among them, value1 is used to represent r1, g1 and b1 in the target color value information, value1 is used to represent r2, g2 and b2 in the color value information corresponding to the filter image, and .toFixed(n) is used to round the value to n decimal places.
[0152] For example, if the initial transparency of the primary color is a1 = 0, the target color value information corresponding to the primary color is: r1 = 2, g1 = 10, b1 = 15, the target filter parameter a2 = 0.2, and the color value information corresponding to the filter image is: r2 = 10, g2 = 20, b2 = 30, then the first transition parameter t1 can be calculated to be 0, the second transition parameter t2 can be taken as 2, 4, 6 respectively, and the third transition parameter t3 = 0.2, and the RGB value of the target color can be obtained as [10, 20, 30]. In other words, when the initial transparency of the primary color is a1 = 0, the RGB value corresponding to the target color is the RGB value of the filter image corresponding to the target filter parameter. The initial transparency of the main color is a1 = 0.2, the target color value information corresponding to the main color is: r1 = 10, g1 = 20, b1 = 30, the target filter parameter a2 = 0.3, and the color value information corresponding to the filter image is: r2 = 100, g2 = 20, b2 = 30. Then, the first transition parameters can be calculated to be 1.4, 2.8, 4.2, the second transition parameter t2 can be calculated to be 30, 6, 9, and the third transition parameter t3 = 0.44. The RGB value of the target color can be obtained as [71, 20, 30]. It can be understood that when calculating the RGB value of the target color, the final RGB value is the result of rounding down the actual calculated value (i.e., the largest integer less than or equal to the actual value).
[0153] Please also see Figure 6 , is a schematic diagram of an interface of a target page image provided by an embodiment of the present application. Figure 6As shown, the target page image 50b displayed in the multimedia interface of the terminal device 50a is a recommended image of an e-book. The target page image 50b includes a cover image of the recommended e-book, a sharing control, and a detailed reading control. When the user is not interested in the e-book displayed in the target page image 50b, the user can swipe left or right on the screen of the terminal device 50a to switch the target page image 50b displayed in the multimedia page. For example, if the user swipes left on the screen of the terminal device 50a, the terminal device 50a can respond to the user's swiping operation on the target page image 50b and switch the target page image 50b in the multimedia page to the target page image 50c. In the process of switching from target page image 50b to target page image 50c, terminal device 50a can obtain the original underlying image corresponding to page underlying image 50d, extract the main color in the original underlying image, obtain the target filter parameters corresponding to the target brightness value of the main color from the brightness mapping relationship table corresponding to black (the color of page controls and page text are both black), and superimpose the target filter parameters with the main color in the original underlying image to generate an updated main color. The updated main color is applied to the multimedia page, and the target color is used as the overall background color of the multimedia page to generate page underlying image 50d with the target color. The page underlying image 50d, page controls, and page text are merged to obtain target page image 50c. It is understandable that the terminal screen of terminal device 50a only displays the process of target page image 50b jumping to target page image 50c, or the process of target page image 50b sliding off the screen and the process of target page image 50c sliding onto the screen, but does not display the process of generating target page image 50c. The generation process of target page image 50c is completed in the background of terminal device 50a.
[0154] Optionally, the page material elements may include page controls and page text. When the color value information corresponding to the page controls is different from the color value information corresponding to the page text, that is, when the color of the page controls is different from the color of the page text, the target filter parameters corresponding to the main color in the page underlying image may include a first filter parameter corresponding to the page controls and a second filter parameter corresponding to the page text. In the process of generating the target page image, the terminal device may segment the page underlying image based on the display position information of the page controls and the page text in the multimedia page, obtain a first underlying image corresponding to the page controls and a second underlying image corresponding to the page text, and then update the main color in the first underlying image to a first updated sub-color based on the first filter parameter, merge the first underlying image with the first updated sub-color with the page controls to obtain a first page sub-image, update the main color in the second underlying image to a second updated sub-color based on the second filter parameter, merge the second underlying image with the second updated sub-color with the page file to obtain a second page sub-image, splice the first page sub-image and the second page sub-image to obtain the target page image, and display the target page image on the multimedia page. When the page material elements in a multimedia page have different color value information, the terminal device needs to segment the underlying image of the page according to the display position information of the page material elements with different color value information in the multimedia page to obtain multiple page sub-images. The color value information of the page material elements in the area where each page sub-image is located is different, so the target filter parameters corresponding to each page sub-image may be different. Different target colors can be generated, and the target colors are applied to the corresponding page sub-images. Then, the page sub-images with the target colors are spliced and superimposed with the page material elements to obtain the final target page image.
[0155] Please also see Figure 7 , is a schematic diagram of a target page image generation process provided by an embodiment of the present application. Figure 7 As shown, terminal device 60f can obtain image 60a and use image 60a as the underlying image of the multimedia page, and can extract main color 60b from image 60a. Terminal device 60f can also obtain page material elements in multimedia page 60e. Page material elements may include page text 60g and page control 60h. Because page text 60g and page control 60h have different colors (page text 60g is black, and page control 60h is white), the background colors of the display areas where page text 60g and page control 60h are located need to be different colors. Terminal device 60f can segment image 60a based on the display position information of page text 60g and page control 60h in multimedia page 60e to obtain sub-images 60c and 60d.
[0156] Since the color of the page text 60g is black, the terminal device 60f can obtain the brightness mapping relationship table 1 corresponding to black, and obtain the filter parameter 1 corresponding to the main color 60b from the brightness mapping relationship table 1 according to the target brightness value corresponding to the main color 60b. The terminal device 60f can also obtain the brightness mapping relationship table 2 corresponding to white, and obtain the filter parameter 2 corresponding to the main color 60b from the brightness mapping relationship table 2 according to the target brightness value corresponding to the main color 60b. Since the sub-image 60c includes the page text 60g in the display area of the multimedia page 60e, the main color is updated using the filter parameter 1 to obtain the new The target color is 1, and the sub-image 60c with the new target color 1 is merged with the page text 60g to obtain the page sub-image 60i; since the sub-image 60d includes the page control 60h in the display area of the multimedia page 60e, the main color is updated using the filter parameter 2 to obtain the new target color 2, and the sub-image 60d with the new target color 2 is merged with the page control 60h to obtain the page sub-image 60j; the terminal device 60f can splice the page sub-image 60i and the page sub-image 60j to obtain the target page image, and display the target page image in the multimedia page 60e.
[0157] In the embodiment of the present application, the main color in the underlying image of the page is obtained, and the target brightness value of the main color is determined according to the target color value information corresponding to the main color. Then, according to the material color value information corresponding to the page material element, the target filter parameter corresponding to the target brightness value is obtained. The main color in the underlying image of the page is adjusted to the target color according to the target filter parameter, and the underlying image of the page with the target color is merged with the page material element to obtain the target page image for display. It can be seen that after the main color in the underlying image of the page is extracted, the brightness value of the main color can be converted, and the filter parameter corresponding to the brightness value and the main color can be superimposed to achieve the visualization standard in the page, that is, to enhance the contrast between the main color and the page material element. By directly obtaining the filter parameter corresponding to the main color and superimposing the filter parameter on the main color, the efficiency of generating the page image can be improved without adjusting the other elements in the page. By performing a secondary adjustment on the extracted main color, the contrast between the main color and the page material image can be enhanced, which can effectively improve the visual display effect of the page image.
[0158] See Figure 8 , is a schematic diagram of the structure of an image processing device provided in an embodiment of the present application. The image processing device can be a computer program (including program code) running on a computer device, for example, the image processing device is an application software; the device can be used to execute the corresponding steps of the method provided in an embodiment of the present application. Figure 8As shown, the image processing device 1 may include: a determination module 10, an acquisition module 11, and a merging module 12;
[0159] The determination module 10 is used to obtain the main color in the bottom layer image of the page and determine the target brightness value of the main color according to the target color value information corresponding to the main color;
[0160] The acquisition module 11 is used to obtain the material color value information corresponding to the page material element, and obtain the target filter parameter corresponding to the target brightness value according to the material color value information;
[0161] The merging module 12 is used to update the main color in the page bottom layer image to the target color according to the target filter parameters, and merge the page bottom layer image with the target color with the page material element to obtain the target page image for display.
[0162] The specific functional implementation of the determination module 10, the acquisition module 11, and the merging module 12 can be found in the above Figure 3 Steps S101 to S103 in the corresponding embodiment will not be described in detail here.
[0163] Please also see Figure 8 , the determination module 10 may include: a classification unit 101, an accumulation unit 102, an averaging unit 103, a main color acquisition unit 104, a coefficient acquisition unit 105, and an operation unit 106;
[0164] The classification unit 101 is used to obtain the underlying image of the page and classify the color value information corresponding to the pixels contained in the underlying image of the page to obtain at least two color value categories;
[0165] An accumulation unit 102 is configured to accumulate the color value information contained in each color value category to obtain a total color value corresponding to each color value category;
[0166] An averaging unit 103 is used to count the number of color value information contained in each color value category, and obtain the average color value corresponding to each color value category according to the number and the total color value;
[0167] The main color acquisition unit 104 is used to acquire the main color in the bottom layer image of the page according to the average color value;
[0168] The coefficient acquisition unit 105 is used to acquire the target color value information corresponding to the main color and the brightness coefficient corresponding to the target color value information;
[0169] The operation unit 106 is configured to perform a product operation on the target color value information and the brightness coefficient to obtain a target brightness value corresponding to the main color.
[0170] The specific functional implementation of the classification unit 101, the accumulation unit 102, the averaging unit 103, the main color acquisition unit 104, the coefficient acquisition unit 105, and the operation unit 106 can be found in the above Figure 3 Step S101 in the corresponding embodiment will not be described in detail here.
[0171] Please also see Figure 8 , the acquisition module 11 may include: a relationship table acquisition unit 111, a parameter determination unit 112;
[0172] The relationship table acquisition unit 111 is used to acquire a brightness mapping relationship table corresponding to the material color value information; the brightness mapping relationship table includes brightness value ranges corresponding to at least two filter parameters, and the at least two filter parameters include a target filter parameter;
[0173] The parameter determination unit 112 is configured to determine a target filter parameter corresponding to the primary color according to a brightness value range to which the target brightness value belongs in the brightness mapping relationship table.
[0174] The specific functional implementation of the relationship table acquisition unit 111 and the parameter determination unit 112 can be found in the above Figure 3 Step S102 in the corresponding embodiment will not be described in detail here.
[0175] Please also see Figure 8 , the relationship table acquisition unit 111 may include: a brightness value acquisition subunit 1111, a contrast acquisition subunit 1112, and a relationship table generation subunit 1113;
[0176] The brightness value acquisition subunit 1111 is used to obtain the candidate brightness value corresponding to each color value information in the color value information set; the color value information set includes the color value information contained in the color space;
[0177] The contrast acquisition subunit 1112 is used to acquire the contrast between each candidate brightness value and the material color value information, and determine the filter parameters corresponding to each candidate brightness value according to the contrast and the visualization parameter;
[0178] The relationship table generating subunit 1113 is configured to generate a brightness mapping relationship table according to the filter parameters corresponding to each brightness value to be selected.
[0179] The specific functional implementation of the brightness value acquisition subunit 1111, the contrast acquisition subunit 1112, and the relationship table generation subunit 1113 can be found in the above Figure 3 Step S102 in the corresponding embodiment will not be described in detail here.
[0180] Please also see Figure 8, the contrast acquisition subunit 1112 may include: a contrast comparison subunit 11121, an updating subunit 11122;
[0181] The contrast comparison subunit 11121 is configured to determine the contrast smaller than the visualization parameter as the target contrast if the contrast is smaller than the visualization parameter, and determine the updated filter parameters corresponding to the target contrast according to the filter increment parameter;
[0182] The updating subunit 11122 is configured to update the target contrast according to the updated filter parameters. When the updated target contrast is greater than or equal to the visualization parameter, the updated filter parameters are determined as the filter parameters of the candidate brightness value corresponding to the target contrast.
[0183] The specific functional implementation of the contrast comparison subunit 11121 and the updating subunit 11122 can be found in the above Figure 3 Step S102 in the corresponding embodiment will not be described in detail here.
[0184] Please also see Figure 8 , the relationship table generating subunit 1113 may include: a grouping subunit 11131, a brightness value range determining subunit 11132, and a mapping relationship generating subunit 11133;
[0185] The grouping subunit 11131 is configured to group each candidate brightness value according to the filter parameters corresponding to each candidate brightness value to obtain at least two brightness groups; the candidate brightness values included in each brightness group have the same filter parameters;
[0186] The brightness value range determining subunit 11132 is configured to determine the brightness value range corresponding to each brightness group according to the maximum and minimum brightness values to be selected in each brightness group;
[0187] The mapping relationship generating subunit 11133 is configured to generate a brightness mapping relationship table according to the mapping relationship between the filter parameters corresponding to each brightness group and the brightness value range.
[0188] The specific functional implementation of the grouping subunit 11131, the brightness value range determination subunit 11132, and the mapping relationship generation subunit 11133 can be found in the above Figure 3 Step S102 in the corresponding embodiment will not be described in detail here.
[0189] Please also see Figure 8 , the merging module 12 may include: a first display unit 121, a second display unit 122, a third display unit 123, a color overlay unit 124, and an element overlay unit 125;
[0190] The first display unit 121 is configured to generate an unadjusted page image based on the page material elements and the underlying page image having the primary color, and display the unadjusted page image in the first display area of the image preview interface;
[0191] The second display unit 122 is used to display the filter image corresponding to the target filter parameters in the second display area of the image preview interface;
[0192] The third display unit 123 is configured to update the main color of the unadjusted page image to the target color according to the filter image, obtain the target page image, and display the target page image in the third display area of the image preview interface;
[0193] A color overlay unit 124 is configured to perform color overlay on the target filter parameter and the main color, thereby updating the main color in the underlying image of the page to the target color;
[0194] The element superimposing unit 125 is used to superimpose the page material element with the page bottom image with the target color according to the display position information of the page material element in the multimedia page to obtain the target page image, and display the target page image in the multimedia page.
[0195] The color overlay unit 124 may be specifically configured to:
[0196] Obtaining initial parameters corresponding to the primary color, and determining a first transition parameter based on the target color value information, the initial parameters, and the target filter parameters;
[0197] Obtaining a filter image corresponding to the target filter parameter, and determining a second transition parameter according to color value information corresponding to the filter image and the target filter parameter;
[0198] A third transition parameter is determined according to the initial parameter and the target filter parameter, a parameter sum of the first transition parameter and the second transition parameter is determined, and a target color is determined according to a ratio of the parameter sum to the third transition parameter.
[0199] When the page material elements include page controls and page text, and the target filter parameters include first filter parameters corresponding to the page controls and second filter parameters corresponding to the page text, the merging module 12 may include: an image segmentation unit 126, a first image merging unit 127, a second image merging unit 128, and a splicing unit 129;
[0200] The image segmentation unit 126 is configured to segment the underlying image of the page according to the display position information of the page controls and the page text in the multimedia page, to obtain a first underlying image corresponding to the page controls and a second underlying image corresponding to the page text;
[0201] A first image merging unit 127 is configured to update the main color in the first underlying image to a first updated sub-color according to the first filter parameter, and merge the first underlying image having the first updated sub-color with the page control to obtain a first page sub-image;
[0202] The second image merging unit 128 is configured to update the main color in the second underlying image to a second updated sub-color according to the second filter parameter, and merge the second underlying image having the second updated sub-color with the page file to obtain a second page sub-image;
[0203] The splicing unit 129 is configured to splice the first page sub-image and the second page sub-image to obtain a target page image, and display the target page image in the multimedia page.
[0204] The specific functional implementation of the first display unit 121, the second display unit 122, the third display unit 123, the color overlay unit 124, the element overlay unit 125, the image segmentation unit 126, the first image merging unit 127, the second image merging unit 128, and the splicing unit 129 can be referred to above. Figure 3 Step S103 in the corresponding embodiment will not be described in detail here.
[0205] Please also see Figure 8 , the image preview interface includes a filter parameter input box; the image processing device 1 may further include: a response module 13, an image adjustment module 14;
[0206] a response module 13, configured to respond to a parameter adjustment trigger operation in the filter parameter input box, obtain the filter adjustment parameters in the filter parameter input box, and update the filter image in the second display area to display the filter adjustment image according to the filter adjustment parameters;
[0207] The image adjustment module 14 is configured to adjust the image according to the filter, adjust the target page image in the third display area, and display the adjusted target page image.
[0208] The specific functional implementation of the response module 13 and the image adjustment module 14 can be found in the above Figure 3 Step S103 in the corresponding embodiment will not be described in detail here.
[0209] In the embodiment of the present application, the main color in the underlying image of the page is obtained, and the target brightness value of the main color is determined according to the target color value information corresponding to the main color. Then, according to the material color value information corresponding to the page material element, the target filter parameter corresponding to the target brightness value is obtained. The main color in the underlying image of the page is adjusted to the target color according to the target filter parameter, and the underlying image of the page with the target color is merged with the page material element to obtain the target page image for display. It can be seen that after the main color in the underlying image of the page is extracted, the brightness value of the main color can be converted, and the filter parameter corresponding to the brightness value and the main color can be superimposed to achieve the visualization standard in the page, that is, to enhance the contrast between the main color and the page material element. By directly obtaining the filter parameter corresponding to the main color and superimposing the filter parameter on the main color, the efficiency of generating the page image can be improved without adjusting the other elements in the page. By performing a secondary adjustment on the extracted main color, the contrast between the main color and the page material image can be enhanced, which can effectively improve the visual display effect of the page image.
[0210] See Figure 9 , is a schematic diagram of the structure of a computer device provided in an embodiment of the present application. Figure 9 As shown, the computer device 1000 may include: a processor 1001, a network interface 1004 and a memory 1005. In addition, the above-mentioned computer device 1000 may also include: a user interface 1003, and at least one communication bus 1002. The communication bus 1002 is used to realize the connection and communication between these components. The user interface 1003 may include a display screen (Display), a keyboard (Keyboard), and the user interface 1003 may optionally include a standard wired interface and a wireless interface. The network interface 1004 may optionally include a standard wired interface and a wireless interface (such as a WI-FI interface). The memory 1004 may be a high-speed RAM memory, or a non-volatile memory (non-volatile memory), such as at least one disk memory. The memory 1005 may optionally be at least one storage device located away from the aforementioned processor 1001. As Figure 9 As shown, the memory 1005 as a computer-readable storage medium may include an operating system, a network communication module, a user interface module, and a device control application.
[0211] In such Figure 9 In the computer device 1000 shown, the network interface 1004 can provide network communication functions; the user interface 1003 is mainly used to provide an interface for user input; and the processor 1001 can be used to call the device control application stored in the memory 1005 to achieve:
[0212] Get the main color in the bottom image of the page, and determine the target brightness value of the main color based on the target color value information corresponding to the main color;
[0213] Obtain the material color value information corresponding to the page material element, and obtain the target filter parameters corresponding to the target brightness value based on the material color value information;
[0214] The main color in the page bottom layer image is updated to the target color according to the target filter parameter, and the page bottom layer image with the target color is merged with the page material element to obtain the target page image for display.
[0215] It should be understood that the computer device 1000 described in the embodiment of the present application can execute the above Figure 3 The description of the image processing method in the corresponding embodiment can also be performed as described above. Figure 8 The description of the image processing device 1 in the corresponding embodiment will not be repeated here. In addition, the description of the beneficial effects of adopting the same method will not be repeated here either.
[0216] In addition, it should be noted that: the embodiment of the present application also provides a computer-readable storage medium, and the computer-readable storage medium stores a computer program executed by the image processing device 1 mentioned above, and the computer program includes program instructions. When the processor executes the program instructions, it can execute the above-mentioned Figure 3 Therefore, the description of the image processing method in the corresponding embodiment will not be repeated here. In addition, the description of the beneficial effects of adopting the same method will not be repeated. For technical details not disclosed in the computer-readable storage medium embodiment involved in this application, please refer to the description of the method embodiment of this application. As an example, the program instructions can be deployed on a computing device for execution, or on multiple computing devices located at one location, or on multiple computing devices distributed at multiple locations and interconnected by a communication network. Multiple computing devices distributed at multiple locations and interconnected by a communication network can constitute a blockchain system.
[0217] Those skilled in the art will appreciate that all or part of the processes in the above-described method embodiments can be implemented by instructing related hardware through a computer program. The computer program can be stored in a computer-readable storage medium. When executed, the program can include the processes in the above-described method embodiments. The storage medium can be a magnetic disk, an optical disk, a read-only memory (ROM), or a random access memory (RAM).
[0218] The above disclosure is only a preferred embodiment of the present application, and certainly cannot be used to limit the scope of rights of the present application. Therefore, equivalent changes made according to the claims of the present application are still within the scope covered by the present application.
Claims
1. An image processing method, characterized in that: include: Obtaining the main color in the bottom image of the page, and determining the target brightness value of the main color according to the target color value information corresponding to the main color; Obtaining material color value information corresponding to the page material element, and obtaining target filter parameters corresponding to the target brightness value according to the material color value information; updating the primary color in the page underlying image to a target color according to the target filter parameter, merging the page underlying image having the target color with the page material element to obtain a target page image for display; The updating of the primary color in the page underlying image to a target color according to the target filter parameter, and merging the page underlying image having the target color with the page material element to obtain a target page image for display includes: Obtaining initial parameters corresponding to the primary color, and determining a first transition parameter according to the target color value information, the initial parameters, and the target filter parameters; Acquire a filter image corresponding to the target filter parameter, and determine a second transition parameter according to color value information corresponding to the filter image and the target filter parameter; determining a third transition parameter according to the initial parameter and the target filter parameter, determining a parameter sum of the first transition parameter and the second transition parameter, and determining the target color according to a ratio of the parameter sum to the third transition parameter; According to the display position information of the page material element in the multimedia page, the page material element is superimposed with the page bottom layer image having the target color to obtain the target page image, and the target page image is displayed in the multimedia page.
2. The method according to claim 1, characterized in that The method of obtaining the main color of the bottom layer image of the page includes: Acquire the bottom layer image of the page, and classify color value information corresponding to pixels contained in the bottom layer image of the page to obtain at least two color value categories; Accumulating the color value information contained in each color value category to obtain the total color value corresponding to each color value category; Counting the number of color value information included in each color value category, and obtaining the average color value corresponding to each color value category according to the number and the total color value; According to the color value average, the main color in the bottom layer image of the page is obtained.
3. The method according to claim 1, characterized in that The determining the target brightness value of the main color according to the color value information corresponding to the main color includes: Obtain the target color value information corresponding to the main color, and obtain the brightness coefficient corresponding to the target color value information; The target color value information is multiplied by the brightness coefficient to obtain the target brightness value corresponding to the main color.
4. The method according to claim 1, wherein The acquiring, according to the material color value information, a target filter parameter corresponding to the target brightness value, comprises: Obtaining a brightness mapping relationship table corresponding to the material color value information; the brightness mapping relationship table includes brightness value ranges corresponding to at least two filter parameters, and the at least two filter parameters include the target filter parameter; The target filter parameter corresponding to the primary color is determined according to a brightness value range to which the target brightness value belongs in the brightness mapping relationship table.
5. The method according to claim 4, characterized in that The obtaining of the brightness mapping relationship table corresponding to the material color value information includes: Obtaining a candidate brightness value corresponding to each color value information in a color value information set; the color value information set includes color value information contained in a color space; Obtaining the contrast between each candidate brightness value and the material color value information, and determining the filter parameters corresponding to each candidate brightness value according to the contrast and the visualization parameter; The brightness mapping relationship table is generated according to the filter parameters corresponding to each of the candidate brightness values.
6. The method according to claim 5, characterized in that The step of determining the filter parameters corresponding to each of the selected brightness values according to the contrast and the visualization parameter includes: If the contrast is less than the visualization parameter, determining the contrast less than the visualization parameter as the target contrast, and determining the updated filter parameter corresponding to the target contrast according to the filter increment parameter; The target contrast is updated according to the updated filter parameter, and when the updated target contrast is greater than or equal to the visualization parameter, the updated filter parameter is determined as the filter parameter of the candidate brightness value corresponding to the target contrast.
7. The method according to claim 5, characterized in that The step of generating the brightness mapping relationship table according to the filter parameters corresponding to each of the selected brightness values includes: grouping each of the candidate brightness values according to the filter parameters corresponding to each of the candidate brightness values to obtain at least two brightness groups; the candidate brightness values included in each brightness group have the same filter parameters; Determining the brightness value range corresponding to each brightness group according to the maximum brightness value to be selected and the minimum brightness value to be selected in each brightness group; The brightness mapping relationship table is generated according to the mapping relationship between the filter parameters corresponding to each brightness group and the brightness value range.
8. The method according to claim 1, characterized in that The updating of the main color in the page underlying image to a target color according to the target filter parameter, merging the page underlying image having the target color with the page material element to obtain a target page image for display, includes: generating an unadjusted page image based on the page material element and the underlying page image having the primary color, and displaying the unadjusted page image in a first display area of an image preview interface; Displaying a filter image corresponding to the target filter parameters in a second display area of the image preview interface; According to the filter image, the main color in the unadjusted page image is updated to a target color to obtain a target page image, and the target page image is displayed in the third display area of the image preview interface.
9. The method according to claim 8, characterized in that The image preview interface includes a filter parameter input box; The method further comprises: In response to a parameter adjustment trigger operation in the filter parameter input box, obtaining the filter adjustment parameters in the filter parameter input box, and updating and displaying the filter image in the second display area as a filter adjustment image according to the filter adjustment parameters; The target page image is adjusted according to the filter adjustment image in the third display area, and the adjusted target page image is displayed.
10. The method according to claim 1, characterized in that The page material elements include page controls and page texts, and the target filter parameters include first filter parameters corresponding to the page controls and second filter parameters corresponding to the page texts; The updating of the main color in the page underlying image to a target color according to the target filter parameter, merging the page underlying image having the target color with the page material element to obtain a target page image for display, includes: Segmenting the underlying image of the page according to display position information of the page controls and the page text in the multimedia page to obtain a first underlying image corresponding to the page controls and a second underlying image corresponding to the page text; updating the main color in the first underlying image to a first updated sub-color according to the first filter parameter, and merging the first underlying image having the first updated sub-color with the page control to obtain a first page sub-image; updating the main color in the second underlying image to a second updated sub-color according to the second filter parameter, and merging the second underlying image having the second updated sub-color with the page file to obtain a second page sub-image; The first page sub-image and the second page sub-image are spliced together to obtain the target page image, and the target page image is displayed in the multimedia page.
11. An image processing device, characterized in that: include: A determination module is used to obtain a main color in the bottom layer image of the page, and determine a target brightness value of the main color according to target color value information corresponding to the main color; An acquisition module, configured to acquire material color value information corresponding to a page material element, and acquire a target filter parameter corresponding to the target brightness value according to the material color value information; a merging module, configured to update the primary color in the page underlying image to a target color according to the target filter parameters, and merge the page underlying image having the target color with the page material element to obtain a target page image for display; Wherein, the merging module includes: a color overlay unit, configured to obtain initial parameters corresponding to the primary color, and determine a first transition parameter according to the target color value information, the initial parameters, and the target filter parameters; The color overlay unit is further configured to obtain a filter image corresponding to the target filter parameter, and determine a second transition parameter according to color value information corresponding to the filter image and the target filter parameter; The color overlay unit is further configured to determine a third transition parameter based on the initial parameter and the target filter parameter, determine a total parameter amount of the first transition parameter and the second transition parameter, and determine the target color based on a ratio of the total parameter amount to the third transition parameter; The element superimposing unit is used to superimpose the page material element with the page bottom image having the target color according to the display position information of the page material element in the multimedia page to obtain the target page image, and display the target page image in the multimedia page.
12. A computer device, characterized in that: The method comprises a memory and a processor, wherein the memory stores a computer program, and when the computer program is executed by the processor, the processor executes the steps of the method according to any one of claims 1 to 10.
13. A computer-readable storage medium, characterized in that The computer-readable storage medium stores a computer program, wherein the computer program includes program instructions, and when the program instructions are executed by a processor, the steps of the method according to any one of claims 1 to 10 are performed.
Citation Information
Patent Citations
Color adjustment method and device for interface assembly, equipment and medium
CN109783178A