Theme color dynamic acquisition method and device and storage medium

Abstract

The invention provides a theme color dynamic acquisition method and device and a storage medium, and relates to the technical field of information, and the method comprises the steps: obtaining the current time, current temperature and current climate of a city where a user side is located; obtaining target brightness according to the current time; acquiring target saturation according to the current temperature; obtaining a target hue according to the current climate; and obtaining a target color according to the target brightness, the target saturation and the target hue, wherein the target color is used for being displayed on the user side interface. The theme color obtained by the method is more suitable for the perception of human on the external environment, the theme atmosphere sense is increased, and the user interaction experience is improved.

Description

Technical Field

[0001] The present application relates to the field of information technology, and in particular to a method, device and storage medium for dynamically acquiring theme colors. Background Art

[0002] With the development of software development technology, user experience has become one of the most important goals for developers. The current existing application theme colors are single, which makes the software lack of personalization and differentiation, making it difficult to attract users' attention and improve their memory.

[0003] The current existing technology relies on the color change of a single variable, which only changes the theme color according to the temperature or the day and night, and has little correlation with the external environment.

[0004] In view of the above defects, there is an urgent need for a method, device and storage medium for dynamically acquiring theme colors, which can solve the problems of single theme color changes and weak user interaction in the existing system. Summary of the invention

[0005] The present application provides a method, device and storage medium for dynamically acquiring theme colors, so as to solve the problems that the existing theme colors have a single change and the user interaction is not strong.

[0006] In a first aspect, the present application provides a method for dynamically acquiring a theme color, comprising:

[0007] Get the current time, temperature and climate of the city where the user is located;

[0008] Acquire the target brightness according to the current time; acquire the target saturation according to the current temperature; acquire the target hue according to the current climate;

[0009] A target color is obtained according to the target brightness, target saturation, and target hue, and the target color is used for display on the user terminal interface.

[0010] In a possible design, obtaining the current temperature and current climate of the current city includes:

[0011] Access the map application interface to obtain the city where the current user is located;

[0012] Access the weather application interface to obtain the current temperature and current climate of the city.

[0013] In a possible design, obtaining the target brightness according to the current time includes:

[0014] Determine the preset time period in which the current time falls;

[0015] The preset brightness corresponding to the preset time period is used as the target brightness.

[0016] In a possible design, obtaining a target saturation according to the current temperature includes:

[0017] Determine the preset temperature range in which the current temperature falls;

[0018] The preset saturation corresponding to the preset temperature range is used as the target saturation.

[0019] In a possible design, the step of obtaining a target hue according to the current climate includes:

[0020] The preset hue corresponding to the current climate is used as the target hue.

[0021] In a possible design, the step of obtaining a target color according to the target brightness, target saturation, and target hue includes:

[0022] The target brightness, target saturation, and target hue are used as parameters of the HSI color model to obtain the target color.

[0023] In one possible design, the method further includes:

[0024] Call the ConfigProvider component to set the target color as the application theme color.

[0025] In a second aspect, the present application provides a theme color dynamic acquisition device, including:

[0026] The first module is used to obtain the current time, current temperature and current climate of the city where the user is located;

[0027] The second module is used to obtain the target brightness according to the current time; obtain the target saturation according to the current temperature; and obtain the target hue according to the current climate;

[0028] The third module is used to obtain a target color according to the target brightness, target saturation and target hue, and the target color is used to be displayed on the user terminal interface.

[0029] In a third aspect, the present application provides an electronic device, comprising: a processor, and a memory communicatively connected to the processor;

[0030] The memory stores computer-executable instructions;

[0031] The processor executes the computer-executable instructions stored in the memory to implement the above-mentioned method for dynamically acquiring theme colors.

[0032] In a fourth aspect, the present application provides a computer-readable storage medium, in which computer-executable instructions are stored. When the computer-executable instructions are executed by a processor, they are used to implement the above-mentioned method for dynamically acquiring theme colors.

[0033] The method, device and storage medium for dynamically acquiring theme colors provided by the present application determine the target color as the application theme color according to the current time, current temperature and current climate of the city where the user terminal is located. The following technical effects are achieved:

[0034] This application determines the target color based on the current time, current temperature and current climate of the user's city. The acquired theme color is more suitable for human perception of the external environment, increases the sense of theme atmosphere and enhances the user interaction experience. BRIEF DESCRIPTION OF THE DRAWINGS

[0035] In order to more clearly illustrate the embodiments of the present invention 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 some embodiments of the present invention. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.

[0036] Figure 1 A schematic diagram of a method for dynamically acquiring theme colors provided in an embodiment of the present application Figure 1 ;

[0037] Figure 2 A schematic diagram of a method for dynamically acquiring theme colors provided in an embodiment of the present application Figure 2 ;

[0038] Figure 3 A schematic diagram of the structure of a device for dynamically acquiring theme colors provided in an embodiment of the present application;

[0039] Figure 4 A schematic diagram of the hardware structure of an electronic device provided in an embodiment of the present application. DETAILED DESCRIPTION

[0040] Exemplary embodiments will be described in detail herein, examples of which are shown in the accompanying drawings. When the following description refers to the drawings, unless otherwise indicated, the same numbers in different drawings represent the same or similar elements. The implementations described in the following exemplary embodiments do not represent all implementations consistent with the present application. On the contrary, they are merely examples of devices and methods consistent with some aspects of the present application as detailed in the attached claims, rather than all embodiments. Based on the embodiments in the present invention, all other embodiments obtained by ordinary technicians in this field without making creative work are within the scope of protection of the present invention.

[0041] It should be noted that in the embodiments of the present application, words such as "exemplary" or "for example" are used to indicate examples, illustrations or descriptions. Any embodiment or design described as "exemplary" or "for example" in the present application should not be interpreted as being more preferred or more advantageous than other embodiments or designs. Specifically, the use of words such as "exemplary" or "for example" is intended to present related concepts in a specific way.

[0042] It should be noted that the terms "first", "second", "third", "fourth", etc. (if any) in the specification and claims of the present invention and the above-mentioned drawings are used to distinguish similar objects, and are not necessarily used to describe a specific order or sequence. It should be understood that the numbers used in this way can be interchanged where appropriate, so that the embodiments of the present invention described herein can be implemented in an order other than those illustrated or described herein, for example.

[0043] It should be noted that the “at…” in the embodiments of the present application may be the instant when a certain situation occurs, or may be a period of time after the occurrence of a certain situation, and the embodiments of the present application do not specifically limit this.

[0044] First, the terms in this application are explained:

[0045] Umi: Umi is an extensible front-end framework and an extensible enterprise-level front-end application framework. Umi is based on routing and supports both configurable routing and agreed routing to ensure the functionality of routing and to extend the functionality. It is then equipped with a plug-in system with a complete life cycle, covering every life cycle from source code components to built products, and supporting various functional extensions and business needs.

[0046] This application is implemented based on the Umi framework and is implemented in the src / layouts / BasicLayout file of the newly created Umi project. It can determine the target color as the main theme color of the web (user-side) application according to the current time, temperature and climate of the current city. The obtained theme color is more appropriate for human perception of time, temperature and climate, increases the sense of theme atmosphere, and increases the user interaction experience.

[0047] A method for dynamically acquiring theme colors provided in an embodiment of the present application is described in detail below with reference to the accompanying drawings.

[0048] Figure 1 A schematic diagram of a method for dynamically acquiring theme colors provided in an embodiment of the present application Figure 1 ,like Figure 1 As shown, the method includes:

[0049] S101, obtaining the current time, current temperature and current climate of the city where the user terminal is located;

[0050] Specifically, the current time, current temperature and current climate of the city where the user is located are obtained by accessing related applications through http requests.

[0051] S102, obtaining target brightness according to the current time; obtaining target saturation according to the current temperature; obtaining target hue according to the current climate;

[0052] Specifically, the corresponding target brightness, target saturation and target hue are determined according to the current time, current temperature and current climate of the current city. Among them, the target brightness is more consistent with people's perception of the brightness of the sky at the current time, the target saturation is more consistent with people's perception of temperature, and the target hue is more consistent with people's perception of climate.

[0053] S103, obtaining a target color according to the target brightness, the target saturation, and the target hue, and the target color is used for display on the user terminal interface.

[0054] Specifically, a color whose target brightness, target saturation, and target hue are parameters of the HSI color model is the target color.

[0055] The embodiment of the present application provides a method for determining a target color as an application theme color according to the current time, current temperature and current climate of the city where the user terminal is located. The following technical effects are achieved:

[0056] This application determines the target color based on the current time, current temperature and current climate of the user's city. The acquired theme color is more suitable for human perception of the external environment, increases the sense of theme atmosphere and enhances the user interaction experience.

[0057] Figure 2 A schematic diagram of a method for dynamically acquiring theme colors provided in an embodiment of the present application Figure 2 ;like Figure 2 As shown, the method includes:

[0058] S201, obtaining the current time;

[0059] Specifically, in the src / layouts / BasicLayout file of the umi project, the current time is obtained according to the Date object of the front-end js language.

[0060] S202, access the map application interface to obtain the city where the current user terminal is located; access the weather application interface to obtain the current temperature and current climate of the city.

[0061] For example, in the src / layouts / BasicLayout file of the umi project, access the API interface of a map application and obtain the city where the user is located; its API interface is:

[0062] "https: / / restapi.amap.com / v3 / ip?parameters&key="

[0063] Part of the returned value is:

[0064] “"status":"1","info":"OK","infocode":"10000","province":"Jiangsu Province","city":"Nanjing City","adcode":"320000","rectangle":

[0065] "118.4253323,31.80452471;119.050169,32.39401346""

[0066] From the above example, we can see that the current city is Nanjing;

[0067] For example, in the src / layouts / BasicLayout file of the umi project, through a weather api, the unified API interface is:

[0068] https: / / api.seniverse.com / v3 / weather / now.json? key=&location=. An example of the return value of the request is "{"results":[{"location":{"id":"WTSQQYHVQ973","name":"Nanjing","country":"CN","path":"Nanjing,Jiangsu,China","timezone":"Asia / Shanghai","timezone_offset":"+08:00"},"now":{"text":"Cloudy","code":"9","temperature":"24"},"last_update":"2023-06-25T14:04:37+08:00"}]}". As can be seen from the current example, the current climate is cloudy and the current temperature is 24 degrees.

[0069] It should be noted that: there is no clear order relationship between the above S201 and S202;

[0070] S203, determining a preset time period in which the current time is located; and taking a preset brightness corresponding to the preset time period as a target brightness;

[0071] Specifically, the present application obtains the target brightness according to the current time, obtains the target saturation according to the current temperature, and obtains the target hue according to the current climate, thereby determining the target color. The present application determines the target color through the parameters in the HSI color model. The HSI color model is based on the human visual system and uses hue, saturation, and intensity to describe the color; the saturation S ranges from 0 to 100%, the hue H ranges from 0° to 360°, and the brightness V ranges from 0 to 100%.

[0072] Further, the preset time period and the corresponding preset brightness are determined according to the sunshine time in most of my country. The current time determines the brightness of the theme color. The brightness is the highest at noon and early morning, followed by morning and evening, and the lowest at night. Table 1 is a comparison table of preset time periods and preset brightness provided in the embodiment of the present application, wherein when the preset time period is 0-5 o'clock (early morning) and 19-24 o'clock (night), the preset brightness corresponding to the preset time period is determined to be 30%; when the preset time period is 5-8 o'clock (morning) and 16-19 o'clock (evening), the preset brightness corresponding to the preset time period is determined to be 40%; and when the preset time period is 8-11 o'clock (morning) and 12-16 o'clock (afternoon), the preset brightness corresponding to the preset time period is determined to be 50%; when the preset time period is 11-13 o'clock (noon), the preset brightness corresponding to the preset time period is determined to be 60%.

[0073] Table 1 Comparison table of preset time periods and preset brightness

[0074] Time Preset time period (hours) Default brightness (%) Early morning 0-5 30 morning 5-8 40 morning 8-11 50 noon 11-13 60 afternoon 12-16 50 evening 16-19 40 night 19-24 30

[0075] S204, determining a preset temperature interval in which the current temperature is located; and taking a preset saturation corresponding to the preset temperature interval as a target saturation.

[0076] Specifically, the lower the temperature, the lower the saturation, and the higher the temperature, the higher the saturation. Table 2 is a comparison table of preset temperature ranges and preset saturations provided in the embodiment of the present application; wherein: when the preset temperature range is less than -20°, the corresponding preset saturation is 30%; when the preset temperature range is greater than, the corresponding preset saturation is 100%; if the current temperature is in the preset temperature range of [-20°, 50°], the corresponding preset saturation is (current temperature + 50)%.

[0077] It should be noted that the current temperature and preset temperature range here refer to Fahrenheit temperatures.

[0078] Table 2 Comparison table of preset temperature range and preset saturation

[0079] Preset temperature range (℃) Preset saturation (%) <-20 30 >50 100 [-20,50] Current temperature +50

[0080] S205: Use the preset hue corresponding to the current climate as the target hue.

[0081] Specifically, according to the human body's perception of the weather, a sunny day is orange, a rainy and snowy day is blue, and a foggy and sandy day is yellow. Table 3 is a comparison table of the current climate and the preset hue provided in the embodiment of the present application; the current climate is one of sunny, cloudy, overcast, rainy, snowy, sandy, foggy, windy and extreme weather, and the corresponding preset hues are 30 (orange), 80 (light green), 120 (dark green), 200 (blue), 235 (dark blue), 60 (yellow), 275 (purple) and 350 (red).

[0082] Table 3 Comparison table of climate and preset hue

[0083] climate color Preset Hue clear orange color 30 partly cloudy Light green 80 Negative Dark Green 120 rain blue 200 Snow Dark Blue 235 Blowing sand and haze yellow 60 wind Purple 275 Extreme Weather red 350

[0084] It should be noted that: there is no clear order relationship between the above S203, S204 and S205;

[0085] S206 , taking the target brightness, target saturation, and target hue as parameters of the HSI color model to obtain a target color as an application theme color.

[0086] Specifically, in the src / layouts / BasicLayout file of the umi framework, set the theme color according to the configured HSL parameters, change with the update of the page, and configure it globally.

[0087] Furthermore, based on the umi+antd5 framework, under the BasicLayout file (page entry), wrap the ConfigProvider component of antd5, and set token.colorPrimary in the component theme interface according to the above method. The color of antd components can be changed automatically. Under the src / page directory structure (page), through the useToken hook provided by antd, call the token.colorPrimary field it provides to get the currently set theme color.

[0088] Among them, antd5 is a theme library that implements theme rendering based on cssinjs.

[0089] Specifically, the method of the present application also includes: continuing to obtain the current time, the city, the current time in the city, the current temperature and the current climate according to a preset cycle, determining the target color according to the above method, and realizing dynamic adjustment of the theme color.

[0090] The embodiment of the present application provides a method for determining a target color as an application theme color according to the current time, current temperature and current climate of the city where the user terminal is located. The following technical effects can be achieved:

[0091] This application determines the target color based on the current time, current temperature and current climate of the user's city; uses the HSL color mode to display the target color, and determines the specific color (i.e. hue) of the theme color based on the current climate; determines the brightness of the theme color based on the current time, which is consistent with human perception of the degree of daylight; determines the vividness (i.e. saturation) of the theme color based on the temperature, which is consistent with human perception of temperature.

[0092] This application can continue to obtain the current time, the city, the current time in the city, the current temperature and the current climate according to a preset cycle, determine the target color according to the above method, and realize dynamic adjustment of the theme color.

[0093] This application is implemented using the Umi front-end framework and combined with antd5 for theme color rendering. The implementation method is simple and easy to deploy.

[0094] The target color obtained by the present application is more suitable for human perception of time, temperature and climate, which increases the actual sense of atmosphere of the current moment and enhances the user interaction experience.

[0095] The embodiment of the present invention can divide the electronic device or the main control device into functional modules according to the above method example. For example, each functional module can be divided according to each function, or two or more functions can be integrated into one processing unit. The above integrated unit can be implemented in the form of hardware or in the form of software functional modules. It should be noted that the division of modules in the embodiment of the present invention is schematic and is only a logical function division. There may be other division methods in actual implementation.

[0096] Figure 3 A schematic diagram of a device for dynamically acquiring theme colors provided in an embodiment of the present application Figure 1 ;like Figure 3 The device 30 comprises:

[0097] The first module 301 is used to obtain the current time, current temperature and current climate of the city where the user terminal is located;

[0098] The second module 302 is used to obtain the target brightness according to the current time; obtain the target saturation according to the current temperature; and obtain the target hue according to the current climate;

[0099] The third module 302 is used to obtain a target color according to the target brightness, target saturation and target hue, and the target color is used to be displayed on the user terminal interface.

[0100] Furthermore, the first module 301 is specifically used for:

[0101] Access the map application interface to obtain the city where the current user is located;

[0102] Access the weather application interface to obtain the current temperature and current climate of the city.

[0103] Furthermore, the second module 302 is specifically used for:

[0104] Determine the preset time period in which the current time falls;

[0105] The preset brightness corresponding to the preset time period is used as the target brightness.

[0106] Furthermore, the second module 302 is further specifically used for:

[0107] Determine the preset temperature range in which the current temperature is located;

[0108] The preset saturation corresponding to the preset temperature range is used as the target saturation.

[0109] Furthermore, the second module 302 is further specifically used for:

[0110] Use the preset hue corresponding to the current climate as the target hue.

[0111] Furthermore, the third module 303 is specifically used for:

[0112] The target brightness, target saturation, and target hue are used as parameters of the HSI color model to obtain the target color.

[0113] Furthermore, the third module 303 is further specifically used for:

[0114] Call the ConfigProvider component to set the target color to the application theme color.

[0115] The present embodiment provides a device for dynamically acquiring theme colors, which can execute the above-mentioned method for dynamically acquiring theme colors. The implementation principle and technical effects thereof are similar, and will not be described in detail in the present embodiment.

[0116] In a specific implementation of the aforementioned device for dynamically acquiring a theme color, each module may be implemented as a processor, and the processor may execute computer-executable instructions stored in a memory, so that the processor executes the aforementioned method for dynamically acquiring a theme color.

[0117] Figure 4This is a schematic diagram of the structure of an electronic device provided in an embodiment of the present application. Figure 4 As shown, the electronic device 40 includes: at least one processor 401 and a memory 402. The electronic device 40 also includes a communication component 403. The processor 401, the memory 402 and the communication component 403 are connected via a bus 404.

[0118] In a specific implementation process, at least one processor 401 executes the computer-executable instructions stored in the memory 402, so that at least one processor 401 executes the theme color dynamic acquisition method executed by the electronic device side as above.

[0119] The specific implementation process of the processor 401 can be found in the above method embodiment, and its implementation principle and technical effect are similar, so this embodiment will not be repeated here.

[0120] In the above embodiments, it should be understood that the processor may be a central processing unit (CPU), or other general-purpose processors, digital signal processors (DSP), application-specific integrated circuits (ASIC), etc. A general-purpose processor may be a microprocessor or any conventional processor. The steps of the method disclosed in the invention may be directly implemented as being executed by a hardware processor, or may be executed by a combination of hardware and software modules in the processor.

[0121] The memory may include a high-speed RAM memory, and may also include a non-volatile storage NVM, such as at least one disk storage.

[0122] The bus may be an Industry Standard Architecture (ISA) bus, a Peripheral Component Interconnect (PCI) bus, or an Extended Industry Standard Architecture (EISA) bus, etc. The bus may be divided into an address bus, a data bus, a control bus, etc. For ease of representation, the bus in the drawings of the present application is not limited to only one bus or one type of bus.

[0123] The above-mentioned functions implemented by the electronic device and the main control device introduce the scheme provided by the embodiment of the present invention. It can be understood that in order to implement the above-mentioned functions, the electronic device or the main control device includes a hardware structure and / or software module corresponding to the execution of each function. In combination with the units and algorithm steps of each example described in the embodiment disclosed in the embodiment of the present invention, the embodiment of the present invention can be implemented in the form of hardware or a combination of hardware and computer software. Whether a function is executed in the form of hardware or computer software driving hardware depends on the specific application and design constraints of the technical solution. Those skilled in the art can use different methods to implement the described functions for each specific application, but such implementation should not be considered to exceed the scope of the technical solution of the embodiment of the present invention.

[0124] The present application also provides a computer-readable storage medium, in which computer-executable instructions are stored. When a processor executes the computer-executable instructions, the above-mentioned method for dynamically acquiring theme colors is implemented.

[0125] The computer-readable storage medium mentioned above can be implemented by any type of volatile or non-volatile storage device or a combination thereof, such as static random access memory (SRAM), electrically erasable programmable read-only memory (EEPROM), erasable programmable read-only memory (EPROM), programmable read-only memory (PROM), read-only memory (ROM), magnetic memory, flash memory, magnetic disk or optical disk. The readable storage medium can be any available medium that can be accessed by a general or special-purpose computer.

[0126] An exemplary readable storage medium is coupled to a processor so that the processor can read information from the readable storage medium and write information to the readable storage medium. Of course, the readable storage medium can also be a component of the processor. The processor and the readable storage medium can be located in an application specific integrated circuit (Application Specific Integrated Circuits, referred to as: ASIC). Of course, the processor and the readable storage medium can also exist as discrete components in an electronic device or a main control device.

[0127] The present application also provides a computer program product, which includes: a computer program, which is stored in a readable storage medium. At least one processor of an electronic device can read the computer program from the readable storage medium, and at least one processor executes the computer program so that the electronic device executes the solution provided by any of the above embodiments.

[0128] Those skilled in the art can understand that all or part of the steps of implementing the above-mentioned method embodiments can be completed by hardware related to program instructions. The aforementioned program can be stored in a computer-readable storage medium. When the program is executed, the steps of the above-mentioned method embodiments are executed; and the aforementioned storage medium includes: ROM, RAM, disk or optical disk and other media that can store program codes.

[0129] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present invention, rather than to limit it. Although the present invention has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that they can still modify the technical solutions described in the aforementioned embodiments, or replace some or all of the technical features therein with equivalents. However, these modifications or replacements do not cause the essence of the corresponding technical solutions to deviate from the scope of the technical solutions of the embodiments of the present invention.

Claims

1. A method for dynamically acquiring theme colors, characterized in that: include: Get the current time, temperature and climate of the city where the user is located; Acquire the target brightness according to the current time; Acquire a target saturation according to the current temperature; Obtaining a target hue according to the current climate; A target color is obtained according to the target brightness, target saturation, and target hue, and the target color is used for display on the user terminal interface.

2. The method according to claim 1, characterized in that The method of obtaining the current temperature and climate of the current city includes: Access the map application interface to obtain the city where the current user is located; Access the weather application interface to obtain the current temperature and current climate of the city.

3. The method according to claim 1, characterized in that The acquiring the target brightness according to the current time includes: Determine the preset time period in which the current time falls; The preset brightness corresponding to the preset time period is used as the target brightness.

4. The method according to claim 1, characterized in that The step of obtaining the target saturation according to the current temperature comprises: Determine the preset temperature range in which the current temperature falls; The preset saturation corresponding to the preset temperature range is used as the target saturation.

5. The method according to claim 1, characterized in that The step of obtaining the target hue according to the current climate comprises: The preset hue corresponding to the current climate is used as the target hue.

6. The method according to claim 1, characterized in that The step of obtaining a target color according to the target brightness, target saturation, and target hue comprises: The target brightness, target saturation, and target hue are used as parameters of the HSI color model to obtain the target color.

7. The method according to claim 6, characterized in that After obtaining the target color, the method further includes: Call the ConfigProvider component to set the target color as the application theme color.

8. A theme color dynamic acquisition device, characterized in that: include: Module 1; Used to obtain the current time, temperature and climate of the city where the user is located; Module 2; Used to obtain the target brightness according to the current time; Acquire a target saturation according to the current temperature; Obtaining a target hue according to the current climate; The third module is used to obtain a target color according to the target brightness, target saturation and target hue, and the target color is used to be displayed on the user terminal interface.

9. An electronic device, characterized in that: include: A processor, and a memory communicatively connected to the processor; The memory stores computer-executable instructions; The processor executes the computer-executable instructions stored in the memory to implement the method according to any one of claims 1 to 7.

10. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores computer-executable instructions, which are used to implement the method according to any one of claims 1 to 7 when executed by a processor.

Images