WO2017152762A1 - Procédé et appareil de réglage de couleur d'interface, et procédé et appareil de réglage de couleur de page web - Google Patents

Procédé et appareil de réglage de couleur d'interface, et procédé et appareil de réglage de couleur de page web Download PDF

Info

Publication number
WO2017152762A1
WO2017152762A1 PCT/CN2017/074617 CN2017074617W WO2017152762A1 WO 2017152762 A1 WO2017152762 A1 WO 2017152762A1 CN 2017074617 W CN2017074617 W CN 2017074617W WO 2017152762 A1 WO2017152762 A1 WO 2017152762A1
Authority
WO
WIPO (PCT)
Prior art keywords
color
ambient light
light intensity
interface
foreground
Prior art date
Application number
PCT/CN2017/074617
Other languages
English (en)
Chinese (zh)
Inventor
吴栋磊
许颖
Original Assignee
阿里巴巴集团控股有限公司
吴栋磊
许颖
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 阿里巴巴集团控股有限公司, 吴栋磊, 许颖 filed Critical 阿里巴巴集团控股有限公司
Publication of WO2017152762A1 publication Critical patent/WO2017152762A1/fr

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/14—Digital output to display device ; Cooperation and interconnection of the display device with other functional units
    • G06F3/1407—General aspects irrespective of display type, e.g. determination of decimal point position, display with fixed or driving decimal point, suppression of non-significant zeros
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/14—Digital output to display device ; Cooperation and interconnection of the display device with other functional units

Definitions

  • the present application relates to an interface display technology, and in particular, to an interface color adjustment method and apparatus.
  • the application relates to a webpage color adjustment method and device, another interface color adjustment method and device, and an electronic device.
  • light intensities also called ambient light intensity
  • outdoor daytime ambient light is relatively strong
  • the ambient light in the room is relatively weak.
  • the light intensity may gradually increase or gradually decrease.
  • the change of the light intensity will affect the display effect of the display interface of the electronic device.
  • the display content of the screen may be dim, making it difficult for the user to recognize and easily cause visual fatigue; and in the case of relatively weak light.
  • Under the display interface may bring a strong stimulation to the user, thereby affecting the user experience.
  • some electronic devices can automatically adjust the brightness of the screen by detecting the ambient light intensity. For example, when the ambient light intensity is strong, the brightness of the display is increased accordingly; when the ambient light intensity is When it is weak, the brightness of the display is reduced accordingly.
  • the method of automatically adjusting the brightness of the screen can improve the browsing experience of the user in different environments to a certain extent. However, due to the diversity of the color of the interface display, the method of adjusting the brightness may not effectively improve the browsing experience of the user.
  • An interface color adjustment method and device proposes a new idea of automatically adjusting the interface display color according to the ambient light intensity, so as to solve the problem that the brightness adjustment mode cannot effectively improve the browsing experience of the user in different environments.
  • the embodiment of the present application further provides a webpage color adjustment method and device, another interface color adjustment method and device, and an electronic device.
  • the application provides an interface color adjustment method, including:
  • the display color of the interface is adjusted according to the ambient light intensity.
  • the obtaining the ambient light intensity is implemented as follows:
  • the ambient light intensity is obtained by monitoring an ambient light intensity change event.
  • the method includes:
  • the adjusting the display color of the interface according to the ambient light intensity comprises: adjusting a foreground color and/or a background color of each display element in the interface according to the ambient light intensity.
  • the interface includes a webpage; and adjusting the foreground color and/or the background color of each display element in the interface is implemented as follows:
  • the foreground color and/or the background color of the visible node is adjusted according to the ambient light intensity.
  • adjusting the foreground color and/or the background color of the display element or the visible node according to the ambient light intensity including:
  • the method is implemented on a device employing an RGB color mode
  • Adjust the foreground and/or background color of the display element or visual node based on ambient light intensity including:
  • the color value of the background color is set in a manner proportional to the ambient light intensity.
  • the setting process includes:
  • the adjusted R, G, and B component values are calculated in inversely proportional to the ambient light intensity
  • the RGB color values are synthesized according to the calculated R, G, and B component values, and the foreground color is set by the synthesized RGB color values.
  • the setting process includes:
  • the adjusted R, G, and B component values are calculated in a manner proportional to the ambient light intensity
  • the RGB color values are synthesized based on the calculated R, G, and B component values, and the background color is set using the synthesized RGB color values.
  • the adjusting the display color of the interface according to the ambient light intensity comprises:
  • the color values of the pixel points in the foreground area and/or the pixel points in the background area are adjusted according to the ambient light intensity.
  • the determining the foreground area and the background area of the interface image stored in the display cache including:
  • the foreground and background regions of the interface image are determined using edge detection techniques and/or pattern recognition techniques based on the color values of the pixels stored in the display cache.
  • the adjusting according to the ambient light intensity, the color values of the pixel points in the foreground area and/or the pixel points in the background area, including:
  • a color value of the pixel is set with a foreground color specified by the color scheme; and/or, for a pixel in the background region, the background color specified by the color scheme is used to set the color The color value of the pixel.
  • the method is implemented on a device employing an RGB color mode
  • Adjusting, according to the ambient light intensity, color values of pixel points in the foreground area and/or pixel points in the background area including:
  • the RGB values of the pixel points are set in a manner inversely proportional to the ambient light intensity
  • the RGB values of the pixel points are set in proportion to the ambient light intensity based on the original RGB values of the pixel points.
  • an interface color adjustment device including:
  • An ambient light intensity acquisition unit for acquiring ambient light intensity
  • An interface color adjustment unit is configured to adjust a display color of the interface according to the ambient light intensity.
  • the ambient light intensity acquiring unit is configured to acquire the ambient light intensity by calling an interface for acquiring ambient light intensity; or acquiring the ambient light intensity by monitoring an ambient light intensity change event.
  • the device further includes:
  • a change amount calculation unit configured to calculate a change amount of the ambient light intensity according to the historical data of the ambient light intensity and the ambient light intensity acquired this time after the ambient light intensity acquisition unit acquires the ambient light intensity
  • the change amount determining unit is configured to determine whether the change amount output by the change amount calculation unit is greater than a preset threshold, and when the value is greater than, trigger the interface color adjustment unit to work.
  • the interface color adjustment unit is specifically configured to adjust a foreground color and/or a background color of each display element in the interface according to the ambient light intensity;
  • the interface color adjustment unit includes:
  • a loop control subunit configured to trigger an adjustment execution subunit for each display element in the interface
  • a display element adjustment subunit is configured to adjust a background color and/or a foreground color of a display element currently processed by the loop control subunit.
  • the interface color adjustment unit includes:
  • a visual judgment subunit configured to determine whether a node currently processed by the traversal subunit is a visible node
  • the visual node adjustment subunit is configured to adjust a foreground color and/or a background color of the visual node when the output of the visual determination subunit is YES.
  • the display element adjustment subunit or the visual node adjustment subunit includes the following subunits:
  • a color scheme selection subunit configured to extract a color scheme corresponding to the ambient light intensity from a preset color scheme
  • a color setting sub-unit configured to select a corresponding color of the display element or the visual node according to the foreground color and the background color specified in the color scheme selected by the sub-unit according to the color scheme.
  • the device is deployed on a device adopting an RGB color mode
  • the display element adjustment subunit or the visual node adjustment subunit includes:
  • a foreground setting subunit for setting a color value of the foreground color in inverse proportion to an ambient light intensity based on an original RGB value of the foreground color
  • the background color setting subunit is configured to set the color value of the background color in a manner proportional to the ambient light intensity based on the original RGB value of the background color.
  • the foreground color setting subunit includes:
  • a foreground component value obtaining subunit configured to acquire original R, G, and B component values of the foreground color
  • a foreground component value calculation subunit configured to calculate, according to the original R, G, and B component values, inversely proportional to the ambient light intensity, the adjusted R, G, and B component values;
  • the foreground color value synthesis subunit is configured to synthesize RGB color values according to the calculated R, G, and B component values, and set the foreground color by using the synthesized RGB color values.
  • the background color setting subunit includes:
  • a background component value obtaining subunit configured to acquire original R, G, and B component values of the background color
  • a background component value calculation sub-unit configured to calculate, according to the original R, G, and B component values, a value of each of the adjusted R, G, and B components in a manner proportional to the ambient light intensity
  • the background color value synthesis subunit is configured to synthesize RGB color values according to the calculated R, G, and B component values, and set the background color by using the synthesized RGB color values.
  • the interface color adjustment unit includes:
  • a foreground background dividing subunit for determining a foreground area and a background area of the interface image stored in the display cache
  • a pixel color value adjusting subunit configured to adjust a color value of a pixel point in the foreground area and/or a pixel point in the background area according to the ambient light intensity.
  • the foreground background partitioning sub-unit is specifically configured to determine a foreground area and a background area of the interface image by using edge detection technology and/or pattern recognition technology according to color values of pixel points stored in the display buffer.
  • the pixel color value adjustment subunit includes:
  • a color scheme selection subunit configured to extract a color scheme corresponding to the ambient light intensity from a preset color scheme
  • a color value adjustment sub-unit for setting a color value of the pixel point with a foreground color specified by the color scheme for a pixel point in the foreground region; and/or, for the pixel point in the background region, using the color
  • the background color specified by the scheme sets the color value of the pixel.
  • the device is deployed on a device adopting an RGB color mode
  • the pixel color value adjustment subunit includes:
  • a foreground pixel adjustment subunit configured to set, according to an original RGB value of the pixel point, an RGB value of the pixel point in inverse proportion to an ambient light intensity; and /or,
  • the background pixel adjustment subunit is configured to set the RGB value of the pixel point in a manner proportional to the ambient light intensity for the pixel point in the background area based on the original RGB value of the pixel point.
  • the application further provides a webpage color adjustment method, including:
  • the method is implemented on a device employing an RGB color mode
  • Adjusting the foreground color and/or the background color of the visible node according to the ambient light intensity including:
  • a color value of the foreground color in an inversely proportional manner to ambient light intensity based on an original RGB value of a foreground color of the visible node; and/or an original color of the background color of the visible node Based on the RGB values, the color values of the background colors are set in a manner proportional to the ambient light intensity.
  • the application further provides a webpage color adjustment device, including:
  • An ambient light intensity acquisition unit for acquiring ambient light intensity
  • a webpage color adjustment unit configured to traverse a DOM Tree of a webpage displayed in the interface, and perform an operation for the node therein: when the node is a visible node, according to the ambient light intensity, the visual The foreground and/or background color of the node is adjusted.
  • the present application also provides another interface color adjustment method, including:
  • the color values of the pixel points in the foreground area and/or the pixel points in the background area are adjusted according to the ambient light intensity.
  • the method is implemented on a device employing an RGB color mode
  • Adjusting, according to the ambient light intensity, color values of pixel points in the foreground area and/or pixel points in the background area including:
  • the RGB values of the pixel points are set in inverse proportion to the ambient light intensity; and/or,
  • the RGB values of the pixel points are set in proportion to the ambient light intensity based on the original RGB values of the pixel points.
  • the present application further provides another interface color adjustment device, including:
  • An ambient light intensity acquisition unit for acquiring ambient light intensity
  • a foreground background dividing unit configured to determine a foreground area and a background area of the interface image stored in the display cache
  • a pixel color value adjusting unit configured to adjust a color value of a pixel point in the foreground area and/or a pixel point in the background area according to the ambient light intensity.
  • the application further provides an electronic device, including:
  • a memory for storing an interface color adjustment program, when the program is read and executed by the processor, performing an operation of: acquiring an ambient light intensity, and adjusting a display color of the interface according to the ambient light intensity.
  • the interface color adjustment method provided by the present application adjusts the display color of the interface according to the ambient light intensity by acquiring the ambient light intensity.
  • the above method provided by the present application proposes a new idea of automatically adjusting the interface display color according to the ambient light intensity, and adjusting the interface display color under different ambient light intensities, so that the interface display color can be adapted to the intensity of the ambient light. It helps the user to correctly identify the content displayed on the interface and protect the user's vision, thereby effectively improving the user's screen browsing experience.
  • the change of the ambient light intensity can be detected in a relatively real-time manner, thereby enabling a fine and continuous color adjustment capability, even in a scene where the ambient light intensity does not change significantly. It can also be adjusted; and the adjustment process does not require user participation, avoiding interrupting the user's browsing process and ensuring a good browsing experience for the user.
  • FIG. 2 is a flowchart of processing for adjusting a foreground color according to an RGB component according to an embodiment of the present application
  • FIG. 3 is a flowchart of processing for adjusting a background color according to an RGB component according to an embodiment of the present application
  • FIG. 4 is a flowchart of a process for changing a color configuration of an underlying drawing system and adjusting an interface display color according to an embodiment of the present application
  • FIG. 5 is a schematic diagram of an embodiment of an interface color adjustment device of the present application.
  • FIG. 6 is a flowchart of an embodiment of a webpage color adjustment method of the present application.
  • FIG. 7 is a schematic diagram of an embodiment of a webpage color adjustment device of the present application.
  • FIG. 8 is a flow chart of another embodiment of an interface color adjustment method of the present application.
  • FIG. 9 is a schematic diagram of another embodiment of an interface color adjustment device of the present application.
  • FIG. 10 is a schematic diagram of an embodiment of an electronic device of the present application.
  • an interface color adjustment method and device a webpage color adjustment method and device, another interface color adjustment method and device, and an electronic device are provided respectively. Detailed description will be made one by one in the following embodiments.
  • the technical solution provided by the present application does not adopt a conventional method for adjusting the brightness of the screen, but provides a method for automatically adjusting the color of the interface according to the ambient light intensity, that is, obtaining the ambient light intensity and triggering according to the acquired ambient light intensity. Adjust the color of the interface display. By adjusting the color of the interface display for different ambient light intensities, the interface display color can be adapted to the ambient light intensity, which helps the user to correctly recognize the content displayed by the interface and protect the user's vision, thereby effectively improving the user's screen.
  • Browse experience is not adopt a conventional method for adjusting the brightness of the screen, but provides a method for automatically adjusting the color of the interface according to the ambient light intensity, that is, obtaining the ambient light intensity and triggering according to the acquired ambient light intensity. Adjust the color of the interface display. By adjusting the color of the interface display for different ambient light intensities, the interface display color can be adapted to the ambient light intensity, which helps the user to correctly recognize the content displayed by the interface and protect the user's vision,
  • the change of the ambient light intensity can be detected in a relatively real-time manner, thereby enabling automatic and continuous color adjustment capability, even in a scene where the ambient light intensity does not change significantly.
  • the adjustment can also be performed; and the adjustment process does not require user participation, and avoids interrupting the user's browsing process, which can further enhance the user experience.
  • FIG. 1 is a flowchart of an embodiment of an interface color adjustment method of the present application. The method includes the following steps:
  • Step 101 Acquire ambient light intensity.
  • Ambient light also called ambient light
  • an ambient light sensor also called a light sensor
  • a host device an apparatus for implementing the interface color adjustment method provided in this embodiment
  • the ambient light sensor can sense The light conditions around the device and the detected ambient light intensity, usually in lux.
  • ambient light intensity in the specific implementation, by directly reading the ambient light sensor
  • the output is used to obtain the information, and the ambient light intensity can also be monitored through an interface provided by the host device.
  • the host device For the latter, one of the following two methods can be used:
  • the system provides an API (application programming interface) for obtaining the ambient light intensity: the ambient light device api, this step can obtain the current ambient light intensity by calling the API.
  • the API can be called periodically by starting a timer, that is, periodically obtaining the ambient light intensity, so that the change of the ambient light intensity can be detected in a relatively real-time manner, and the fine and continuous color adjustment capability can be automatically realized, even if Adjustment can also be made in a scene where the change in ambient light intensity is not significant.
  • the system provides an event monitoring mechanism for ambient light.
  • the ambient light intensity change event is triggered.
  • the step may monitor the ambient light intensity change event and perform a processing function corresponding to the event.
  • the value of the ambient light intensity is obtained by the parameter passed by the event, thereby obtaining the current ambient light intensity.
  • Step 102 Adjust a display color of the interface according to the ambient light intensity.
  • This step can adjust the display color of the interface according to the ambient light intensity obtained in step 101.
  • the change amount of the ambient light intensity may be calculated according to the historical data of the previously acquired ambient light intensity and the ambient light intensity acquired this time, and when calculating When the obtained change amount is greater than the preset threshold, the display color of the interface is adjusted according to the ambient light intensity acquired in step 101.
  • the amount of change in ambient light intensity can be calculated in different ways.
  • the difference between the two may be calculated according to the ambient light intensity acquired in step 101 and the ambient light intensity acquired last time to obtain the amount of change in ambient light intensity; the ambient light intensity obtained according to step 101, and the last time
  • the amount of change in ambient light intensity is calculated by adjusting the ambient light intensity at the interface color.
  • the adjustment of the interface color is triggered, and the flexible control of the adjustment process can be realized.
  • the preset threshold is set to 0, the display color of the interface is adjusted as long as the ambient light intensity changes, so that a relatively smooth color tone can be achieved.
  • the preset threshold is set to a value greater than 0, the display color of the interface is adjusted when the amount of change reaches the requirement, and the occupation of the processor resources can be reduced.
  • the utilization of the processor resources and the browsing experience of the user can be taken into consideration, and an appropriate preset threshold is set.
  • the preset threshold may be a preset fixed value, or may be divided into different intervals according to the range of the ambient light intensity, and a corresponding threshold is set for each interval, which is better in this manner. Realize the adjustment of the interface display color under different illumination intensities.
  • step 101 The timing of triggering this step is described above.
  • step 101 The specific implementation manner of the display color of the ambient light intensity adjustment interface acquired in step 101 according to step 101 will be described below.
  • An interface displayed by the electronic device on the display may generally include one or more display elements having color attributes, including: text boxes, buttons, menu bars, etc., the color attributes Usually included: foreground color and background color.
  • the color of the text box is filled with the background color
  • the color of the content displayed above the background color is the foreground color.
  • This step may be performed by a UI module (user interface module) that is responsible for interface drawing in the system or application, and uses a display element operation interface to adjust the foreground color and/or the background color of each display element in the interface according to the ambient light intensity.
  • the color value of the foreground color and/or the background color may be calculated according to the ambient light intensity, and the corresponding color value of the display element may be set with the calculated color value (eg, an interface function such as setTextcolor(), setBackgroundColor() is called), Set the update of the memory through the graphics system, which can be displayed on the interface, so as to adjust the color of the interface display.
  • the web engine responsible for rendering may be based on the current ambient light intensity.
  • the foreground color and/or background color of the visible node in the DOM Tree of the web page is set to adjust the color of the page.
  • the DOM (Document Object Model) Tree is a tree structure obtained by parsing a webpage code (for example, an HTML code), and the page elements in the webpage may correspond to nodes in the DOM Tree, different nodes. There may be a parent-child relationship, a brother relationship, and all nodes together form a DOM Tree.
  • the DOM Tree is usually generated in the memory.
  • the DOM Tree can be traversed, and the following operations are performed for each DOM node: the node is determined according to the visual attribute of the node. Whether it is a visual node, and if so, acquiring a foreground color and/or a background color corresponding to the node, and adjusting the corresponding color according to the ambient light intensity. For example, the color values of the foreground color and/or the background color may be calculated based on the ambient light intensity, and the corresponding color values of the node may be set using the calculated color values.
  • the network engine updates the color of the Dom node, it will trigger an update of the corresponding data in the video memory, thereby displaying the webpage after adjusting the color on the screen.
  • the display element in the interface or the visible node in the DOM tree is color-adjusted, only the foreground color or the background color can be adjusted, and the foreground color and the background color can be adjusted.
  • the amount of change in the ambient light intensity may be calculated. When the amount of change is less than or equal to the preset threshold, only the foreground color may be adjusted. When the amount of change in the ambient light intensity is greater than the preset threshold, the foreground color may be The background color is adjusted so that the interface display color is better adapted to changes in ambient light intensity.
  • the embodiment provides two adjustment modes: adjusting by using a preset color scheme; or adjusting by calculating the color values of the foreground color and the background color. The two methods are described separately below.
  • each color scheme can specify a specific foreground and background color, and set an ambient light intensity or an ambient light intensity range corresponding to each color scheme.
  • the color scheme corresponding to the ambient light intensity acquired in step 101 may be extracted from the preset color scheme, and then according to the Select the foreground and background colors specified in the color scheme to set the corresponding color of the display element or visual node. For example, with the one specified in the selected color scheme The foreground color sets the foreground color of the visible node, and sets the background color of the visible node with the background color specified in the selected color scheme.
  • the adjustment is made by means of a preset color scheme, which has the advantage that the adjustment process is relatively simple.
  • the corresponding color value of the display element or the visible node can be calculated according to the ambient light intensity acquired in step 101, and corresponding settings can be made.
  • the adjustment process can be made smoother and softer without giving the user a more abrupt visual experience.
  • the RGB color mode means that any color light can be mixed by different ratios of R (red), G (green), and B (blue), and the device adopts the RGB color mode, usually for the three primary colors.
  • the components are separately encoded and the encoded values are combined into RGB color values.
  • the RGB color mode when the three primary color components are all 0, it corresponds to black; when the three primary color components are all the maximum (in the case of the 8-bit encoding, for example, 255), it corresponds to white.
  • the adjustment process of the foreground color and the background color will be described below based on the RGB color mode.
  • the RGB value of the foreground color can be set in inverse proportion to the ambient light intensity based on the original RGB value of the foreground color. For example, you can calculate according to Equation 1 as shown below:
  • org_color_value is the original RGB value of the foreground color (ie, the RGB value before adjustment)
  • ambient_light_value is the value of the ambient light intensity obtained in step 101
  • ⁇ is a proportional coefficient
  • show_color is the color value of the adjusted foreground color.
  • the method of calculating the respective component values of R, G, and B, and then synthesizing and adjusting may be adopted, and the calculation result is more accurate in this manner. Get better adjustments.
  • the process of adjusting the foreground color according to the ambient light intensity may include the steps 102-1-1 to 102-1-3 shown below, and the preferred embodiment of adjusting the foreground color is described below with reference to FIG. 2:
  • Step 102-1-1 Obtain the original R, G, and B component values of the foreground color.
  • the original R, G, and B component values (ie, the R, G, and B component values before unadjustment) may be extracted from the foreground color according to a synthesis rule of RGB color values in a corresponding manner.
  • Step 102-1-2 based on the original R, G, and B component values, calculate the adjusted R, G, and B component values in a manner inversely proportional to the ambient light intensity.
  • Equation 1 can be used to calculate the adjusted R, G, and B component values.
  • the same ⁇ scale factor can be used for each R, G, and B component, or different ⁇ scale factors can be used.
  • Steps 102-1-3 synthesizing the RGB color values according to the calculated R, G, and B component values, and setting the foreground color by using the synthesized RGB color values.
  • a light color can be selected as the background color (for example, white is used as the background color, Black as the foreground color is convenient for the user to browse, that is, the RGB color value of the background color is proportional to the ambient light intensity. Therefore, the RGB value of the background color can be set in proportion to the ambient light intensity based on the original RGB value of the background color. For example, you can calculate according to Equation 2 as shown below:
  • org_color_value is the original RGB value of the background color (ie, the RGB value before adjustment)
  • ambient_light_value is the value of the ambient light intensity obtained in step 101
  • ⁇ is the proportional coefficient
  • show_color is the color value of the adjusted background color. After the show_color is calculated by the above formula, the RGB value of the background color is set by the value of show_color, and the adjustment of the background color is completed.
  • each component value of R, G, and B may be separately calculated and then performed.
  • the way of synthesis and adjustment is more accurate in this way, and better adjustment results can be obtained.
  • the process of adjusting the background color according to the ambient light intensity may include the following steps 102-2-1 to 102-2-3, and the preferred embodiment of adjusting the background color is described below with reference to FIG. 3:
  • Step 1022-1 Obtain the original R, G, and B component values of the background color.
  • the original R, G, and B component values (i.e., the R, G, and B component values before unadjustment) may be extracted from the background color according to a synthesis rule of RGB color values in a corresponding manner.
  • Step 102-2-2 Based on the original R, G, and B component values, the adjusted R, G, and B component values are calculated in proportion to the ambient light intensity.
  • Equation 2 can be used to calculate the adjusted R, G, and B component values.
  • the same ⁇ scale factor can be used for each R, G, and B component, or different ⁇ scale coefficients can be used.
  • Steps 102-2-3 synthesizing the RGB color values according to the calculated R, G, and B component values, and setting the background color by using the synthesized RGB color values.
  • the Y component of the original YUV color value can be obtained first, and then the adjusted Y component is calculated on the basis of the component in inverse proportion to the ambient light. And using the calculated Y component to set the Y component of the foreground color; for the same reason, for the background color, the Y component of the original YUV color value can be obtained first, and then based on the component, in proportion to the ambient light In the manner, the adjusted Y component is calculated, and the Y component of the background color is set using the calculated Y component.
  • the processing of the step 102 specifically includes determining a foreground area and a background area in the display buffer, and The two steps of adjusting the color value of the pixel in the buffer are performed, which will be further described below in conjunction with FIG. 4.
  • Step 1023-1 determining a foreground area and a background area of the interface image stored in the display cache.
  • the display cache generally refers to a cache corresponding to the display device, and each storage unit in the cache corresponds to a pixel on the display screen, so the cache can be considered as a direct image of the interface image displayed on the screen. Modify the color value of the pixels in the display cache to change the color of the interface displayed on the screen.
  • the embodiment described here takes advantage of this feature of display caching.
  • the foreground region and the background region of the interface image may be determined by using an edge detection technique according to a color value of a pixel point stored in the display cache.
  • the specific implementation may be: using an edge detection algorithm to identify the contour in the interface image, dividing the interface image into different regions according to the recognized contour, and determining the foreground according to the color distribution characteristics of the pixel points included in each region.
  • the area is also the background area. For example, for a region with a relatively simple color, it can be regarded as a background region, and for a region with a relatively rich color, it can be determined as a foreground region.
  • This step can also use pattern recognition according to the color value of the pixel points stored in the display cache.
  • the technique determines a foreground area and a background area of the interface image. For example, the pattern recognition technology is used to identify that some pixels in the interface image correspond to characters, and then the area composed of the pixels is considered as the foreground area, and the area where the other pixels are located is the background area.
  • edge detection technology and pattern recognition technology can be comprehensively used to improve the recognition accuracy of the foreground area and the background area.
  • the edge detection technology may be used to determine the contour of the interface image, and each region is divided according to the contour, and then the pattern recognition technology is used in each region to detect whether there is text, thereby further determining the foreground region and the background region.
  • Step 102-3-2 adjusting color values of pixel points in the foreground area and/or pixel points in the background area according to the ambient light intensity.
  • the color values of the pixels in the foreground area or the background area can be adjusted, and the color values of the pixels in the two areas can be adjusted, thereby Realize the adjustment of the interface display color.
  • a color scheme corresponding to the ambient light intensity may be extracted from a preset color scheme; then each pixel in the display buffer is traversed, and the pixel points in the foreground region are used.
  • the foreground color specified by the color scheme sets the color value of the pixel, and for the pixel in the background area, the color value of the pixel is set by the background color specified by the color scheme.
  • each pixel in the display buffer can be traversed, and the pixel points in the foreground region can be based on the original RGB values of the pixel points, according to the environment.
  • the light intensity is inversely proportional to the RGB value of the pixel point and is set; the pixel point in the background area may be proportional to the ambient light intensity based on the original RGB value of the pixel point.
  • the RGB values of the pixel points are calculated and set.
  • the RGB value may be calculated or set as a whole, or each component may be separately calculated and recombined and set.
  • the specific processing is similar to the manner in which the upper module described above is adjusted by calculating the color value, and details are not described herein again.
  • the adjustment of the Y component value of the pixel in the display buffer can also be adjusted to adjust the color of the interface display, which will not be described here.
  • the interface color adjustment method provides a new idea of automatically adjusting the interface display color according to the ambient light intensity, and adjusts the interface display color under different ambient light intensities to make the interface display color. It can adapt to the intensity of ambient light, help users to correctly identify the content displayed on the interface, and protect the user's vision, thus effectively improving the user's screen browsing experience.
  • the change of the ambient light intensity can be detected in a relatively real-time manner, thereby enabling a fine and continuous color adjustment capability, even in a scene where the ambient light intensity does not change significantly. It can also be adjusted; and the adjustment process does not require user participation, avoiding interrupting the user's browsing process and ensuring a good browsing experience for the user.
  • an interface color adjustment method is provided.
  • the present application further provides an interface color adjustment device.
  • FIG. 5 is a schematic diagram of an embodiment of an interface color adjustment device of the present application. Since the device embodiment is basically similar to the method embodiment, the description is relatively simple, and the relevant parts can be referred to the description of the method embodiment. The device embodiments described below are merely illustrative.
  • An interface color adjustment device of the embodiment includes: an ambient light intensity acquisition unit 501 for acquiring ambient light intensity; and an interface color adjustment unit 502 for adjusting a display color of the interface according to the ambient light intensity.
  • the ambient light intensity acquiring unit is configured to acquire the ambient light intensity by calling an interface for acquiring ambient light intensity; or acquiring the ambient light intensity by monitoring an ambient light intensity change event.
  • the device further includes:
  • a change amount calculation unit configured to calculate an ambient light intensity according to the historical data of the ambient light intensity and the ambient light intensity acquired this time after the ambient light intensity acquiring unit acquires the ambient light intensity Amount of change;
  • the change amount determining unit is configured to determine whether the change amount output by the change amount calculation unit is greater than a preset threshold, and when the value is greater than, trigger the interface color adjustment unit to work.
  • the interface color adjustment unit is specifically configured to adjust a foreground color and/or a background color of each display element in the interface according to the ambient light intensity;
  • the interface color adjustment unit includes:
  • a loop control subunit configured to trigger an adjustment execution subunit for each display element in the interface
  • a display element adjustment subunit is configured to adjust a background color and/or a foreground color of a display element currently processed by the loop control subunit.
  • the interface color adjustment unit includes:
  • a visual judgment subunit configured to determine whether a node currently processed by the traversal subunit is a visible node
  • the visual node adjustment subunit is configured to adjust a foreground color and/or a background color of the visual node when the output of the visual determination subunit is YES.
  • the display element adjustment subunit or the visual node adjustment subunit includes the following subunits:
  • a color scheme selection subunit configured to extract a color scheme corresponding to the ambient light intensity from a preset color scheme
  • a color setting sub-unit configured to select a corresponding color of the display element or the visual node according to the foreground color and the background color specified in the color scheme selected by the sub-unit according to the color scheme.
  • the device is deployed on a device adopting an RGB color mode
  • the display element adjustment subunit or the visual node adjustment subunit includes:
  • Foreground setting sub-unit for the original RGB value of the foreground color according to the environment Setting the color value of the foreground color in an inversely proportional manner to the light intensity; and/or,
  • the background color setting subunit is configured to set the color value of the background color in a manner proportional to the ambient light intensity based on the original RGB value of the background color.
  • the foreground color setting subunit includes:
  • a foreground component value obtaining subunit configured to acquire original R, G, and B component values of the foreground color
  • a foreground component value calculation subunit configured to calculate, according to the original R, G, and B component values, inversely proportional to the ambient light intensity, the adjusted R, G, and B component values;
  • the foreground color value synthesis subunit is configured to synthesize RGB color values according to the calculated R, G, and B component values, and set the foreground color by using the synthesized RGB color values.
  • the background color setting subunit includes:
  • a background component value obtaining subunit configured to acquire original R, G, and B component values of the background color
  • a background component value calculation sub-unit configured to calculate, according to the original R, G, and B component values, a value of each of the adjusted R, G, and B components in a manner proportional to the ambient light intensity
  • the background color value synthesis subunit is configured to synthesize RGB color values according to the calculated R, G, and B component values, and set the background color by using the synthesized RGB color values.
  • the interface color adjustment unit includes:
  • a foreground background dividing subunit for determining a foreground area and a background area of the interface image stored in the display cache
  • a pixel color value adjusting subunit configured to adjust a color value of a pixel point in the foreground area and/or a pixel point in the background area according to the ambient light intensity.
  • the foreground background partitioning sub-unit is specifically configured to determine a foreground area and a background area of the interface image by using edge detection technology and/or pattern recognition technology according to color values of pixel points stored in the display buffer.
  • the pixel color value adjustment subunit includes:
  • a color scheme selection subunit configured to extract a color scheme corresponding to the ambient light intensity from a preset color scheme
  • a color value adjustment sub-unit for setting a color value of the pixel point with a foreground color specified by the color scheme for a pixel point in the foreground region; and/or, for the pixel point in the background region, using the color
  • the background color specified by the scheme sets the color value of the pixel.
  • the device is deployed on a device adopting an RGB color mode
  • the pixel color value adjustment subunit includes:
  • a foreground pixel adjustment subunit configured to set, according to an original RGB value of the pixel point, an RGB value of the pixel point in inverse proportion to an ambient light intensity; and /or,
  • the background pixel adjustment subunit is configured to set the RGB value of the pixel point in a manner proportional to the ambient light intensity for the pixel point in the background area based on the original RGB value of the pixel point.
  • a webpage color adjustment method provided by the present application includes:
  • Step 601 Acquire ambient light intensity.
  • Step 602 traversing the DOM Tree of the webpage displayed in the interface, and performing an operation on the node therein: when the node is a visible node, according to the ambient light intensity, the foreground color of the visible node And / or background color to adjust.
  • the step can be processed according to the original RGB value of the foreground color according to the ambient light intensity when processing each visible node.
  • the color value of the foreground color is set in an inverse manner; and/or, based on the original RGB value of the background color, the color value of the background color is set in a manner proportional to the ambient light intensity.
  • FIG. 7 is a schematic diagram of an embodiment of a webpage color adjustment apparatus according to the present application. Since the device embodiment is basically similar to the method embodiment, the description is relatively simple, and the relevant parts can be referred to the description of the method embodiment. The device embodiments described below are merely illustrative.
  • the webpage color adjustment apparatus of the embodiment includes: an ambient light intensity acquisition unit 701, configured to acquire an ambient light intensity; and a webpage color adjustment unit 702, configured to traverse a DOM Tree of a webpage displayed in the interface, and
  • the node performs the following operations: when the node is a visible node, adjusting the foreground color and/or the background color of the visible node according to the ambient light intensity.
  • FIG. 8 is a flowchart of an embodiment of an interface color adjustment method provided by the present application. This embodiment is the same as the previously provided embodiments. The parts are not repeated here, and the following highlights the differences.
  • An interface color adjustment method provided by the present application includes:
  • Step 801 Acquire ambient light intensity.
  • Step 802 Determine a foreground area and a background area of the interface image stored in the display cache.
  • Step 803 adjusting color values of pixel points in the foreground area and/or pixel points in the background area according to the ambient light intensity.
  • this step may traverse each pixel in the display buffer, and based on the original RGB value of the pixel in the foreground region, according to the original RGB value of the pixel Setting the RGB value of the pixel point inversely proportional to the ambient light intensity; and/or, for the pixel point in the background area, based on the original RGB value of the pixel point, in proportion to the ambient light intensity The way to set the RGB value of the pixel.
  • FIG. 9 is a schematic diagram of an embodiment of an interface color adjustment device of the present application. Since the device embodiment is basically similar to the method embodiment, the description is relatively simple, and the relevant parts can be referred to the description of the method embodiment.
  • the device embodiments described below are merely illustrative.
  • the interface color adjustment device of the embodiment includes: an ambient light intensity acquisition unit 901, configured to acquire an ambient light intensity; and a foreground background dividing unit 902, configured to determine a foreground region and a background region of the interface image stored in the display cache;
  • the pixel color value adjusting unit 903 is configured to adjust a color value of a pixel point in the foreground area and/or a pixel point in the background area according to the ambient light intensity.
  • the present application also provides an electronic device; the electronic device implementation is as follows:
  • FIG. 10 shows a schematic diagram of an embodiment of an electronic device of the present application.
  • the electronic device includes: an ambient light sensor 1001, a display 1002, a processor 1003, and a memory 1004;
  • the memory 1004 is configured to store an interface color adjustment program, and when executed by the processor, the program performs an operation of: acquiring an ambient light intensity, and adjusting a display color of the interface according to the ambient light intensity.
  • a computing device includes one or more processors (CPUs), input/output interfaces, network interfaces, and memory.
  • processors CPUs
  • input/output interfaces network interfaces
  • memory volatile and non-volatile memory
  • the memory may include non-persistent memory, random access memory (RAM), and/or non-volatile memory in a computer readable medium, such as read only memory (ROM) or flash memory.
  • RAM random access memory
  • ROM read only memory
  • Memory is an example of a computer readable medium.
  • Computer readable media including both permanent and non-persistent, removable and non-removable media may be implemented by any method or technology.
  • the information can be computer readable instructions, data structures, modules of programs, or other data.
  • Examples of computer storage media include, but are not limited to In phase change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read only memory (ROM), electrically erasable programmable Read-only memory (EEPROM), flash memory or other memory technology, CD-ROM, digital versatile disc (DVD) or other optical storage, magnetic cassette, magnetic tape storage or Other magnetic storage devices or any other non-transportable media can be used to store information that can be accessed by the computing device.
  • PRAM phase change memory
  • SRAM static random access memory
  • DRAM dynamic random access memory
  • RAM random access memory
  • ROM read only memory
  • EEPROM electrically erasable programmable Read-only memory
  • flash memory or other memory technology
  • CD-ROM compact disc
  • DVD digital
  • embodiments of the present application can be provided as a method, system, or computer program product.
  • the present application can take the form of an entirely hardware embodiment, an entirely software embodiment or an embodiment in combination of software and hardware.
  • the application can take the form of a computer program product embodied on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) including computer usable program code.

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Controls And Circuits For Display Device (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

L'invention concerne un procédé et un appareil de réglage de couleur d'interface. L'invention concerne également un procédé et un appareil de réglage de couleur de page Web, un autre procédé et un autre appareil de réglage de couleur d'interface, ainsi qu'un dispositif électronique. Le premier procédé de réglage de couleur d'interface consiste : à obtenir l'intensité de la lumière ambiante ; et à régler des couleurs affichées sur une interface selon l'intensité de la lumière ambiante. Le procédé proposé dans la présente invention fournit un nouveau concept de réglage automatique de couleurs affichées sur une interface selon l'intensité de la lumière ambiante. Par réglage des couleurs affichées sur une interface sous différentes intensités de lumière ambiante, les couleurs affichées de l'interface peuvent s'adapter aux intensités de la lumière ambiante, de façon à permettre à un utilisateur de reconnaître correctement le contenu affiché sur l'interface et de protéger la vue de l'utilisateur, permettant ainsi d'améliorer de manière efficace l'expérience de navigation dans l'écran de l'utilisateur. En outre, la solution technique est mise en œuvre périodiquement ou au moyen d'une surveillance d'événement, parvenant à un réglage de couleur fin et continu ; en outre, l'utilisateur ne participe pas au processus de réglage, de telle sorte qu'une bonne expérience de navigation de l'utilisateur est garantie.
PCT/CN2017/074617 2016-03-09 2017-02-23 Procédé et appareil de réglage de couleur d'interface, et procédé et appareil de réglage de couleur de page web WO2017152762A1 (fr)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201610133707.9A CN107179889B (zh) 2016-03-09 2016-03-09 界面色彩调节方法、网页色彩调节方法及装置
CN201610133707.9 2016-03-09

Publications (1)

Publication Number Publication Date
WO2017152762A1 true WO2017152762A1 (fr) 2017-09-14

Family

ID=59790022

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2017/074617 WO2017152762A1 (fr) 2016-03-09 2017-02-23 Procédé et appareil de réglage de couleur d'interface, et procédé et appareil de réglage de couleur de page web

Country Status (2)

Country Link
CN (1) CN107179889B (fr)
WO (1) WO2017152762A1 (fr)

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN114095603A (zh) * 2021-11-11 2022-02-25 努比亚技术有限公司 一种屏幕显示特性调控方法、设备及计算机可读存储介质
EP4145248A4 (fr) * 2020-05-29 2023-10-25 Guangdong Oppo Mobile Telecommunications Corp., Ltd. Procédé et appareil d'affichage de page pour une application tierce, et dispositif électronique

Families Citing this family (11)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107729100B (zh) * 2017-09-26 2020-04-28 维沃移动通信有限公司 一种界面显示控制方法及移动终端
CN108519822A (zh) * 2018-03-29 2018-09-11 北京微播视界科技有限公司 基于人机交互的动作匹配系统、方法、存储介质及交互装置
CN108924338B (zh) * 2018-05-24 2020-12-22 珠海市魅族科技有限公司 移动终端控制方法、移动终端及存储介质
CN111221481A (zh) * 2018-11-23 2020-06-02 珠海金山办公软件有限公司 一种显示处理的方法、装置、计算机存储介质及终端
CN109739609B (zh) * 2019-01-03 2021-01-15 腾讯科技（深圳）有限公司 图像处理方法、装置、计算机可读存储介质和计算机设备
CN109922207B (zh) * 2019-01-21 2021-01-01 竞技世界（北京）网络技术有限公司 一种动态调整应用软件交互界面的方法
CN109961734A (zh) * 2019-02-28 2019-07-02 维沃移动通信有限公司 一种屏幕参数的调整方法、装置和终端设备
CN111695071B (zh) * 2020-07-14 2024-04-09 深圳市欢太科技有限公司 页面的显示方法及相关装置
CN112489592A (zh) * 2020-12-17 2021-03-12 苏州文视光电科技有限公司 一种led显示屏色彩自动调节系统
CN113808552B (zh) * 2021-11-18 2022-03-11 滨州学院 环境光照强度调节方法、装置及电子设备
CN114594921A (zh) * 2022-03-09 2022-06-07 北京沃东天骏信息技术有限公司 多媒体投放方法、装置及系统

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102004784A (zh) * 2010-11-25 2011-04-06 北京播思软件技术有限公司 一种手持终端浏览器的节电方法
KR20120138440A (ko) * 2011-06-15 2012-12-26 엔에이치엔(주) 웹 페이지의 시각적 파라미터 조절 시스템 및 방법
CN102855453A (zh) * 2011-06-30 2013-01-02 网秦无限（北京）科技有限公司 防止偷窥移动设备屏幕显示的方法和系统
CN103903593A (zh) * 2012-12-27 2014-07-02 腾讯科技（武汉）有限公司 一种页面的显示背景的调整方法及终端
CN103959224A (zh) * 2011-11-21 2014-07-30 英特尔公司 基于环境条件修正色度

Family Cites Families (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN1136501C (zh) * 2000-11-28 2004-01-28 英业达（上海）有限公司 一种改进网页显示效果的方法及实现该方法的系统
CN101719944A (zh) * 2009-12-09 2010-06-02 中兴通讯股份有限公司 一种感知光线的终端及感知光线调节人机界面的方法
US9607575B2 (en) * 2013-05-13 2017-03-28 Asustek Computer Inc. Display mode adjusting method of display device and display mode adjusting module thereof
CN105242894B (zh) * 2015-09-24 2018-03-02 徐向霞 智能设备的显示方法及系统

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102004784A (zh) * 2010-11-25 2011-04-06 北京播思软件技术有限公司 一种手持终端浏览器的节电方法
KR20120138440A (ko) * 2011-06-15 2012-12-26 엔에이치엔(주) 웹 페이지의 시각적 파라미터 조절 시스템 및 방법
CN102855453A (zh) * 2011-06-30 2013-01-02 网秦无限（北京）科技有限公司 防止偷窥移动设备屏幕显示的方法和系统
CN103959224A (zh) * 2011-11-21 2014-07-30 英特尔公司 基于环境条件修正色度
CN103903593A (zh) * 2012-12-27 2014-07-02 腾讯科技（武汉）有限公司 一种页面的显示背景的调整方法及终端

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
EP4145248A4 (fr) * 2020-05-29 2023-10-25 Guangdong Oppo Mobile Telecommunications Corp., Ltd. Procédé et appareil d'affichage de page pour une application tierce, et dispositif électronique
US12079905B2 (en) 2020-05-29 2024-09-03 Guangdong Oppo Mobile Telecommunications Corp., Ltd. Page display method and apparatus for third-party application, and electronic device
CN114095603A (zh) * 2021-11-11 2022-02-25 努比亚技术有限公司 一种屏幕显示特性调控方法、设备及计算机可读存储介质
CN114095603B (zh) * 2021-11-11 2024-04-23 努比亚技术有限公司 一种屏幕显示特性调控方法、设备及计算机可读存储介质

Also Published As

Publication number Publication date
CN107179889A (zh) 2017-09-19
CN107179889B (zh) 2020-06-16

Similar Documents

Publication Publication Date Title
WO2017152762A1 (fr) Procédé et appareil de réglage de couleur d'interface, et procédé et appareil de réglage de couleur de page web
US10818081B2 (en) Dynamic lighting for objects in images
CN106030503B (zh) 自适应视频处理
WO2018072270A1 (fr) Procédé et dispositif permettant d'améliorer l'affichage d'image
US20210020139A1 (en) Picture obtaining method and apparatus and picture processing method and apparatus
US11070717B2 (en) Context-aware image filtering
US10244218B2 (en) Image processing apparatus, image processing system, image processing method, and non-transitory computer readable medium
US10298903B2 (en) Method and device for processing a part of an immersive video content according to the position of reference parts
WO2020215861A1 (fr) Procédé d'affichage d'image, appareil d'affichage d'image, dispositif électronique et support d'informations
KR20150038518A (ko) 사진을 이용한 운영체제 색상 세팅
WO2019091411A1 (fr) Procédé de capture d'image, dispositif, terminal et support de stockage
US9934560B2 (en) User sliders for simplified adjustment of images
WO2015165216A1 (fr) Procédé et dispositif de commutation de mode de navigation
CN112950499B (zh) 图像处理方法、装置、电子设备及存储介质
US11128909B2 (en) Image processing method and device therefor
CN114640783B (zh) 一种拍照方法及相关设备
US10825153B2 (en) Image processing apparatus, display apparatus, and image processing method
CN114138215B (zh) 一种显示方法及相关设备
KR102483680B1 (ko) 주변 이미지를 프로세싱하기 위한 방법 및 디바이스
WO2020037754A1 (fr) Procédé et dispositif d'amélioration de la qualité d'image d'une vidéo
WO2020037755A1 (fr) Procédé et appareil pour augmenter la qualité d'image vidéo
KR101911947B1 (ko) 정보 가독성 향상과 배경 이미지 조화를 위한 화면 디자인 방법 및 그 시스템
US9456148B1 (en) Multi-setting preview for image capture
CN111870950B (zh) 游戏控件的显示控制方法、装置和电子设备
KR20180056268A (ko) 영상 처리 장치 및 그 제어 방법

Legal Events

Date Code Title Description
NENP Non-entry into the national phase

Ref country code: DE

121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 17762448

Country of ref document: EP

Kind code of ref document: A1

122 Ep: pct application non-entry in european phase

Ref document number: 17762448

Country of ref document: EP

Kind code of ref document: A1