Theme switching method and device for webpage application and computing equipment

Abstract

The embodiment of the invention provides a theme switching method and device for a webpage application and computing equipment. The method comprises the steps that if the state value of a switching mode flag bit is a first state value, user preference information is obtained, and the user preference information comprises the priority corresponding to a preset theme mode; determining a target theme mode in the preset theme modes according to the priority; obtaining target data through an application programming interface corresponding to the target theme mode; based on the target data, determining a first target theme in application themes corresponding to the target theme mode; and obtaining target style information corresponding to the first target theme, and switching the current theme to the first target theme based on the target style information. According to the method and the device, automatic switching of webpage application themes can be realized, and the intelligent degree is relatively high. Besides, the target theme mode is determined in the multiple pre-designed theme modes based on the user preference information, multi-mode and personalized dynamic adjustment can be achieved, and the diversified requirements of the user are met.

Description

Technical Field

[0001] Embodiments of the present application relate to the field of computer technologies, and particularly to a method, an apparatus, and a computing device for theme switching of a web application. Background Art

[0002] With the continuous development of web applications and user personalization requirements, the traditional theme switching mechanism can no longer meet the needs of modern applications. Traditional web applications generally only support light and dark theme modes, providing a function to switch between a light theme and a dark theme. The theme mode is single and usually can only be manually selected, lacking intelligent interaction with users and having a low degree of intelligence. The themes of traditional web applications cannot achieve dynamic adjustment of multiple modes and personalization, and cannot meet the diverse needs of users. Summary of the Invention

[0003] Embodiments of the present application provide a method, an apparatus, and a computing device for theme switching of a web application, which can determine a target theme mode and a target theme based on user preference information, so as to realize automatic switching of the theme of the web application. Therefore, it can solve the problems that the traditional theme switching method of web applications has a low degree of intelligence, a single interaction mode, cannot achieve dynamic adjustment of multiple modes and personalization, and cannot meet the diverse needs of users.

[0004] To achieve the above object, the embodiments of the present application adopt the following technical solutions:

[0005] In a first aspect, an embodiment of the present application provides a method for theme switching of a web application. The method includes: when the state value of a switching mode flag bit is a first state value, obtaining pre-stored user preference information, where the user preference information includes priorities corresponding to at least one preset theme mode, and the switching mode flag bit is used to identify the theme switching mode of the web application; determining at least one target theme mode from at least one preset theme mode according to the priorities corresponding to the preset theme modes; obtaining target data corresponding to the target theme mode through an application programming interface corresponding to the target theme mode; determining a first target theme from multiple application themes corresponding to the target theme mode based on the target data; obtaining target style information corresponding to the first target theme, and switching the current theme to the first target theme based on the target style information.

[0006] Based on this solution, in the automatic switching mode, the preference degree of the user for each preset theme mode is determined based on the priority in the user preference information. Therefore, the target theme mode can be made more in line with the user's preference. On this basis, the target data corresponding to the target theme mode is obtained, and then the first target theme is determined based on the target data, which can make the first target theme better meet the current actual environment and situation. In addition, different from the traditional solution where the user can only manually click the theme switching button to interact with the web application, based on this solution, the user can interact by inputting user preference information, target data, etc., and the interaction modes are diverse. Through such a design, the user can achieve the switching of the application theme without manual intervention, with a high degree of intelligence, enabling dynamic adjustment of multiple modes and personalization, and being able to meet the diverse needs of users.

[0007] In another possible implementation, the preset theme modes include at least one of a weather mode, a solar term mode, a festival mode, a time mode, a light and dark mode, a sunrise and sunset mode, a mood mode, an eye protection mode, and a function mode.

[0008] Based on this solution, the web application pre-sets multiple different theme modes. In this way, different preset theme modes can meet the user's needs in different dimensions, and can solve the problem that the theme mode of the existing web application is single, resulting in a monotonous application theme.

[0009] In another possible implementation, based on the target data, to determine the first target theme among multiple application themes corresponding to the target theme mode includes: when there are multiple target theme modes, according to the priority corresponding to the target theme mode and the target data, determine the first target theme mode among the multiple target theme modes; otherwise, determine the target theme mode as the first target theme mode; in response to a switching instruction or a change in the target data, according to the preset theme matching rule, determine the first target theme that matches the target data among the multiple application themes corresponding to the first target theme mode.

[0010] Based on this solution, determining the first target theme mode according to the priority can ensure that the first target theme mode is more in line with the user's preference and meets the user's personalized needs. In addition, determining the first target theme according to the target data can ensure that the first target theme is more in line with the actual environment, and moreover, the first target theme that changes according to the actual environment can bring a sense of freshness and fun to the user.

[0011] In yet another possible implementation manner, determining a first target theme mode from multiple target theme modes according to the priority corresponding to the target theme mode and the target data includes: determining a first target theme mode and at least one second target theme mode from multiple target theme modes according to the priority corresponding to the target theme mode; in response to a change in the target data corresponding to any second target theme mode, determining any second target theme mode as the first target theme mode, and after a preset recovery condition is met, returning to the step of determining a first target theme mode and at least one second target theme mode from multiple target theme modes according to the priority corresponding to the target theme mode.

[0012] Based on this solution, in the case of multiple target theme modes, determining a more important first target theme mode and a secondary second target theme mode according to the priority can ensure that the first target theme mode better conforms to the user's preference. In addition, when the web application switches between the first target theme mode and the second target theme mode according to the change in the target data corresponding to the second target theme mode, it can avoid the user missing environmental or situational changes while catering to the user's preferences, and at the same time improve the diversity and interest of the application theme switching. Further, after the web application completes the switching between the first target theme mode and the second target theme mode, if it is monitored that the preset recovery condition is met, and the first target theme mode and the second target theme mode are determined again according to the priority, it can prevent the application theme of the web application from staying in the secondary target theme mode for a long time.

[0013] In yet another possible implementation manner, the method further includes: for each preset theme mode, creating a view component, where the view component includes a template module, a script module, and a style module; the template module is configured to render the mode setting page of the web application; the script module is configured to determine the theme matching rule corresponding to the preset theme mode; the style module includes the first style information of each application theme corresponding to the preset theme mode; in response to a custom instruction input by the user, updating the theme matching rule and / or the first style information.

[0014] Based on this solution, the web application uses the reactive data binding technology, and by using the binding between the view component and the reactive target data, it can manage the display interface in the web application, and can also switch the application theme in real time according to the change in the target data, realizing seamless switching of the application theme.

[0015] In yet another possible implementation manner, obtaining the target style information corresponding to the first target theme includes: in the style module corresponding to the target theme mode, determining the target style information based on the first style information corresponding to the first target theme; and / or, determining the target style information corresponding to the first target theme based on the user preference information, where the user preference information includes the second style information corresponding to at least one application theme.

[0016] Based on this solution, the target style information is determined according to the first style information corresponding to the first target theme in the style module, and the display page can be updated to the style pre-defined in the style module, thus realizing the switching of the application theme. And the target style information is determined according to the second style information corresponding to the first target theme in the user preference information, and the display page can be updated to the user-preferred style, thus realizing the switching of the application theme.

[0017] In another possible implementation, the method further includes: when the status value is the second status value, in response to the theme switching request sent by the user, determining the second target theme corresponding to the theme switching request; switching the current theme to the second target theme.

[0018] Based on this solution, in addition to the automatic switching mode, a manual switching mode is also designed. Therefore, the user can freely select a suitable switching mode according to actual needs, improving the freedom of the theme switching method.

[0019] In another possible implementation, the method further includes: in response to the status switching instruction input by the user, adjusting the status value.

[0020] Based on this solution, the status value of the switching mode flag bit is dynamically adjusted according to the status switching instruction input by the user, and the conversion between the manual switching mode and the automatic switching mode can be realized based on the actual needs of the user.

[0021] In a second aspect, an embodiment of the present application further provides a theme switching device for a web application, and the device includes:

[0022] A switching mode determination module, configured to obtain pre-stored user preference information when the status value of the switching mode flag bit is the first status value, where the user preference information includes the priorities corresponding to at least one preset theme mode, and the switching mode flag bit is used to identify the theme switching mode of the web application; determining at least one target theme mode from at least one preset theme mode according to the priorities corresponding to each preset theme mode; a data acquisition module, configured to obtain target data corresponding to the target theme mode through an application programming interface corresponding to the target theme mode; a theme determination module, configured to determine a first target theme from multiple application themes corresponding to the target theme mode based on the target data; a theme switching module, configured to obtain target style information corresponding to the first target theme, and based on the target style information, switch the current theme to the first target theme.

[0023] In a possible implementation, the preset theme modes include at least one of a weather mode, a solar term mode, a festival mode, a time mode, a light and dark mode, a mood mode, an eye protection mode, and a function mode.

[0024] In a possible implementation, the switching mode determination module is configured to obtain at least one preset theme mode and the priority corresponding to the preset theme mode from the pre-stored user preference information; and determine at least one target theme mode from the at least one preset theme mode according to the priority corresponding to the preset theme mode.

[0025] In a possible implementation, the theme determination module is configured to, when there are multiple target theme modes, determine a first target theme mode from the multiple target theme modes according to the priority corresponding to the target theme mode and the target data, otherwise determine the target theme mode as the first target theme mode; in response to a switching instruction or a change in the target data, determine a first target theme that matches the target data from the multiple application themes corresponding to the first target theme mode according to the preset theme matching rule.

[0026] In a possible implementation, the switching mode determination module is configured to determine a first target theme mode and at least one second target theme mode from the multiple target theme modes according to the priority corresponding to the target theme mode; in response to a change in the target data corresponding to any one of the second target theme modes, determine any one of the second target theme modes as the first target theme mode, and after a preset recovery condition is met, return to the step of determining a first target theme mode and at least one second target theme mode from the multiple target theme modes according to the priority corresponding to the target theme mode.

[0027] In a possible implementation, the device further includes a component creation module, which is configured to create view components for each preset theme mode, and the view components include a template module, a script module, and a style module; the template module is configured to render the mode setting page of the web application; the script module is configured to determine the theme matching rule corresponding to the preset theme mode; the style module includes first style information of each application theme corresponding to the preset theme mode; and in response to a custom instruction input by the user, update the theme matching rule and / or the first style information.

[0028] In a possible implementation, the theme switching module is configured to determine target style information based on the first style information corresponding to the first target theme in the style module corresponding to the target theme mode; and / or determine the target style information corresponding to the first target theme based on the user preference information, where the user preference information includes second style information corresponding to at least one application theme.

[0029] In a possible implementation, the theme switching module is configured to, when the status value is the second status value, in response to a theme switching request sent by the user, determine a second target theme corresponding to the theme switching request; and switch the current theme to the second target theme.

[0030] In a possible implementation, the device further includes a status switching module, configured to adjust the status value in response to a status switching instruction input by the user.

[0031] In a third aspect, an embodiment of the present application further provides a computing device, including: a processor and a memory; the processor and the memory are coupled; the memory is configured to store program instructions; the processor is configured to execute the program instructions to perform the method according to any one of the first aspects above.

[0032] In a fourth aspect, an embodiment of the present application provides a chip, and the chip is configured to perform the method according to any one of the first aspects above.

[0033] In a fifth aspect, an embodiment of the present application provides a computer-readable storage medium, in which computer-executable instructions are stored, and when the computer-executable instructions are executed by a computer, the method according to any one of the first aspects is implemented.

[0034] In a sixth aspect, an embodiment of the present application provides a program product, including a computer program, and when the computer program is executed by a processor, the method according to any one of the first aspects is implemented.

[0035] It can be understood that for the beneficial effects that can be achieved by the technical solutions provided in the second to sixth aspects above, reference can be made to the beneficial effects in the first aspect and any of its optional implementation manners, which will not be elaborated here. BRIEF DESCRIPTION OF THE DRAWINGS

[0036] Figure 1 is a flowchart of a theme switching method for a web application provided by an embodiment of the present application;

[0037] Figure 2 is a schematic diagram of determining a first target theme mode provided by an embodiment of the present application;

[0038] Figure 3 is another schematic diagram of determining a first target theme mode provided by an embodiment of the present application;

[0039] Figure 4 is a schematic diagram of switching from the first target theme mode to the second target theme mode provided by an embodiment of the present application;

[0040] Figure 5 is another schematic diagram of switching from the first target theme mode to the second target theme mode provided by an embodiment of the present application;

[0041] Figure 6 is a schematic diagram of switching back from the second target theme mode to the first target theme mode provided by an embodiment of the present application;

[0042] Figure 7Another schematic diagram for switching back from the second target theme mode to the first target theme mode provided by an embodiment of the present application;

[0043] Figure 8 Another flowchart of the theme switching method for a web application provided by an embodiment of the present application;

[0044] Figure 9 Another flowchart of the theme switching method for a web application provided by an embodiment of the present application;

[0045] Figure 10 A schematic diagram for setting the status value of a switching mode flag bit provided by an embodiment of the present application;

[0046] Figure 11 A schematic diagram of a theme switching device for a web application provided by an embodiment of the present application;

[0047] Figure 12 A schematic diagram of a computing device provided by an embodiment of the present application. Detailed implementation manners

[0048] Next, the technical solutions in the embodiments of the present application will be described with reference to the accompanying drawings in the embodiments of the present application. For the convenience of clearly describing the technical solutions in the embodiments of the present application, the first, second, etc. descriptions that appear in the embodiments of the present application are only for schematic and distinguishing description objects, without order, and do not represent special limitations on the number of devices in the embodiments of the present application, and cannot constitute any limitation to the embodiments of the present application.

[0049] Hereinafter, the professional terms mentioned in the embodiments of the present application will be explained to facilitate the understanding of those skilled in the art.

[0050] A web application is an application program accessed through a browser, usually running on a server, and users interact with the application program through the network. Different from traditional desktop application programs, web applications do not need to be installed and can be used only through a browser.

[0051] The theme of a web application refers to the visual style and design elements of the user interface (UI) in the web application, including colors, fonts, layouts, icons, etc.

[0052] A view component refers to a component model in a development framework. Each view component encapsulates custom content and logic internally, can be used to extend HTML web page elements, and encapsulates reusable code. By dividing a complex page into several view components with independent functions, developers can reduce the development difficulty and improve the code reusability and maintainability.

[0053] A repository can be used for sharing states among view components.

[0054] An embodiment of the present application proposes a method for theme switching of a web application, which can be applied to a web application to automatically determine an application theme mode that meets user requirements, and then automatically switch the theme of the web application.

[0055] The following combines Figures 1 to 10 to exemplarily illustrate the process of the theme switching method of the web application.

[0056] Figure 1 is a flowchart of the theme switching method of the web application provided by the embodiment of the present application.

[0057] As Figure 1 shown, the method includes the following steps S11 - S15:

[0058] S11: When the status value of the switching mode flag bit is the first status value, obtain the pre - stored user preference information.

[0059] Among them, the user preference information includes the priorities corresponding to at least one preset theme mode.

[0060] Among them, the switching mode flag bit is used to identify the theme switching mode of the web application.

[0061] In step S11, the web application can set the switching mode flag bit in the project code, and each status value of the switching mode flag bit can identify a theme switching mode of the web application. For example, the web application can set the switching mode flag bit as a boolean variable, and its status value of 1 corresponds to the automatic switching mode. In this way, if the web application determines that the status value of the current switching mode flag bit is 1, it can confirm that the automatic switching mode is enabled, so as to automatically perform the theme switching of the web application.

[0062] Specifically in this step, when the web application determines that the status value of the current switching mode flag bit is the first status value, it confirms that the automatic switching mode is enabled. Therefore, it can first obtain the user preference information, so as to determine the target theme mode and target theme based on the user preference information in the subsequent steps and perform automatic theme switching.

[0063] Among them, the user preference information can be stored in a repository, such as the Pinia storage space, the local storage space, or the cloud storage space. If the user preference information is stored in the cloud storage space, when the user uses the web application on different devices, the web applications on different devices can access the user preference information through the cloud storage space, so as to realize the synchronization of the user preference information on different devices. For the application scenarios where the user only uses the web application on the same device or does not frequently switch devices, the web application can access the user preference information through the Pinia storage space or the local storage space to save the cloud storage space resources.

[0064] Among them, the user preference information can be information manually input by the user. For example, the user can manually input the preference degree for each preset theme mode through the theme mode setting page of the web application.

[0065] In addition, the user preference information can also be obtained by the web application based on the historical operation records of the user's manual theme switching. For example, if the web application monitors that the user frequently switches the theme of the web application to the meeting theme in the function mode during the day and frequently switches the theme of the web application to the dark theme in the light and dark mode at night recently, the user preference information can be set to prefer the function mode during the day and prefer the light and dark mode at night.

[0066] In addition, the user preference information can also be obtained based on big data analysis. For example, if the web application confirms based on big data analysis that most users manually switch to the festival theme mode during the Spring Festival, the user preference information can be set to prefer the festival theme mode during the Spring Festival.

[0067] In some embodiments, the application theme can fine-tune the user preference information based on the information manually input by the user, based on the historical operation records and the big data analysis results to obtain the final user preference information.

[0068] Among them, the user preference information includes the priorities corresponding to each preset theme mode. The priorities corresponding to different preset theme modes can be the same or different. The preset theme mode with a higher priority is the preset theme mode that the user is more likely to prefer. For example, in the user preference information P1, the solar term mode and the sunrise and sunset mode correspond to high priorities, the weather mode corresponds to medium priority, and the mood mode corresponds to low priority. At this time, it can be considered that the user prefers the solar term mode more. For another example, in the user preference information P2, the mood mode corresponds to a priority of 1, the time mode corresponds to a priority of 2, and the solar term mode corresponds to a priority of 3.

[0069] In one implementation, the preset theme modes are used to identify theme types, and may include weather mode, solar term mode, time mode, light and dark mode, sunrise and sunset mode, mood mode, eye protection mode, function module mode, etc. Each preset theme mode corresponds to at least one application theme. For example, the weather mode may correspond to sunny theme, light rain theme, cloudy theme, etc., which can enhance the user's immersive experience of the weather. The solar term mode may include the Spring Equinox theme, the Summer Solstice theme, etc., which can enable the user to perceive the seasonal changes. The festival mode may include the Spring Festival theme, the Mid-Autumn Festival theme, etc., which can create a festival atmosphere. The time mode may include the time reporting themes corresponding to special moments such as the whole hour, which can remind the user of the current time. The light and dark mode may include the light theme and the dark theme, etc., which can adopt different themes under different light intensities to improve the user's visual comfort. The sunrise and sunset mode may include the sunrise theme and the sunset theme, etc., which can switch to the corresponding theme during the sunrise or sunset period to enhance the user's immersion. The mood mode may include the happy theme, the sad theme, etc., which can realize the personalized expression of the user's mood. The eye protection mode may include different eye protection color themes, which can protect the user's eyesight. The function mode may include the reading theme, the work theme, the meeting theme, etc. In this way, multiple modes and various different themes can be provided according to the diverse needs of users.

[0070] Among them, the preset theme modes and their corresponding application themes can be pre-built in the web application or customized by the user. The embodiments of the present application do not limit this.

[0071] Through step S11, the web application can quickly identify whether it is in the automatic switching mode, and then obtain the user preference information in the automatic switching mode, so as to automatically determine the target theme mode that the user prefers more based on the user preference information in the subsequent steps, improving the intelligence of the application theme switching and being able to cater to the user preference and improve the user experience.

[0072] S12: Determine at least one target theme mode from at least one preset theme mode according to the priorities corresponding to the preset theme modes.

[0073] In step S12, the web application determines one or more target theme modes with relatively higher priorities according to the priorities corresponding to the preset theme modes. For example, for the aforementioned user preference information P1, the web application may determine the high-priority solar term mode and sunrise and sunset mode as the target theme modes; for the aforementioned user preference information P2, the web application may determine the mood mode with a priority of 1 as the target theme mode.

[0074] It should be noted that in the embodiments of the present application, only the preset theme mode with the highest priority is taken as the target theme mode as an example. In some other embodiments, for the aforementioned user preference information P1, the web application may also determine the solar term mode and sunrise and sunset mode with high priority and the weather mode with medium priority as the target theme modes at the same time; for the aforementioned user preference information P2, the web application may also determine the time mode with priority 1 and the mood mode with priority 2 as the target theme modes at the same time. The embodiments of the present application do not make any limitations on this.

[0075] Through step S12 in the embodiments of the present application, the web application can determine the user's preference degree for each preset theme mode based on the priority in the user preference information. Therefore, it can make the target theme mode more in line with the user's preference, which is beneficial to realizing personalized theme switching.

[0076] S13: Obtain target data corresponding to the target theme mode through the application programming interface corresponding to the target theme mode.

[0077] In step S13, the web application uses the application programming interface (Application Programming Interface, API) corresponding to the target theme mode to obtain the corresponding target data. Among them, the target data can be used to determine which application theme in the current situation is more in line with the target theme mode.

[0078] Exemplarily, if the target theme mode is the solar term mode, the web application can use the calendar API to obtain the solar term information corresponding to the current date; if the target theme mode is the weather mode, the web application can use the weather API to obtain the current weather data; if the target theme mode is the mood mode, the web application can use the mood monitoring API to obtain the mood data input by the user in the web application by himself, or use the mood monitoring API to obtain the mood data detected by intelligent hardware devices such as smart bracelets. It can be understood that the embodiments of the present application only take the above target theme modes and application programming interfaces as examples. In some other implementation manners, the web application may also adopt other target theme modes and other application programming interfaces, such as the browser API, etc., to obtain the above target data. The embodiments of the present application do not make any limitations on this.

[0079] S14: Based on the target data, determine the first target theme among multiple application themes corresponding to the target theme mode.

[0080] In step S14, the web application determines which application theme corresponding to the target theme mode the current actual environment and situation are more in line with according to the obtained target data, and then determines the first target theme. Exemplarily, if the target theme mode is the weather mode and the weather data shows that the current weather is light rain, the light rain theme can be determined as the first target theme among multiple application themes corresponding to the weather mode.

[0081] In the embodiment of the present application, through steps S13 and S14, the web application can obtain target data corresponding to the target theme mode, and then, based on the target data, determine which application theme is more suitable currently to determine the first target theme. In this way, the first target theme can better meet the current actual environment and situation.

[0082] In one implementation, step S14 includes the following steps S141 - S142:

[0083] S141: When there are multiple target theme modes, according to the priorities corresponding to the target theme modes and the target data, determine the first target theme mode among the multiple target theme modes; otherwise, determine the target theme mode as the first target theme mode.

[0084] In step S141, it can be understood that if there is only one target theme mode, then the first target theme can be directly determined among the multiple application themes corresponding to the target theme mode. Therefore, this target theme mode can be directly used as the first target theme mode. For example, if the target theme mode only includes the weather mode, then the weather mode can be used as the first target theme mode to determine the first target theme among the multiple application themes corresponding to the first target theme mode, that is, the weather mode.

[0085] If there are multiple target theme modes, there are relatively many application themes corresponding to the multiple target theme modes. To facilitate the determination of the target theme from the relatively many application themes, a first target theme mode can be first determined among the multiple target theme modes. For example, if the target theme modes include the solar term mode, the time mode, and the sunrise and sunset mode, then the priorities corresponding to the above three target theme modes and the target data can be comprehensively analyzed to screen out a first target theme mode, such as screening out the solar term mode as the first target theme mode, so as to determine the first target theme among the multiple application themes corresponding to the first target theme mode, that is, the solar term mode.

[0086] In one implementation, "According to the priorities corresponding to the target theme modes and the target data, determine the first target theme mode among the multiple target theme modes" in step S141 includes the following steps S1411 - S1412:

[0087] S1411: According to the priorities corresponding to the target theme modes, determine the first target theme mode and at least one second target theme mode among the multiple target theme modes.

[0088] In step S1411, if there are multiple target theme modes, according to the priorities corresponding to each target theme mode, determine a first target theme mode and several second target theme modes, where the priority of the first target theme mode is not lower than that of the second target theme mode.

[0089] The following, in combination with Figure 2 and Figure 3 , introduces how to determine the first target theme mode in the case of multiple target theme modes.

[0090] Figure 2 FIG. is a schematic diagram for determining the first target theme mode provided by an embodiment of the present application.

[0091] As Figure 2 shown, for the foregoing user preference information P2, if the time mode with a priority of 1 and the mood mode with a priority of 2 are target theme modes, the web application can determine the time mode with a higher priority as the first target theme mode, and the mood mode with a lower priority as the second target theme mode.

[0092] In addition, if there are multiple target theme modes corresponding to the highest priority at the same time, the web application can determine a first target theme mode from the multiple target theme modes corresponding to the highest priority according to the historical operation records of operations such as the user manually switching the application theme.

[0093] Figure 3 FIG. is another schematic diagram for determining the first target theme mode provided by an embodiment of the present application.

[0094] As Figure 3 shown, for example, for the foregoing user preference information P1, if the solar term mode and the sunrise and sunset mode with a high priority, and the weather mode with a medium priority are target theme modes, and the web application determines according to the historical operation records that the user often manually switches to the solar term mode, the solar term mode can be determined as the first target theme mode from the solar term mode and the sunrise and sunset mode with a high priority, and the other sunrise and sunset mode with a high priority and the weather mode with a medium priority can be used as the second target theme modes.

[0095] S1412: In response to a change in the target data corresponding to any second target theme mode, determine any second target theme mode as the first target theme mode, and after reaching a preset recovery condition, return to the step of determining the first target theme mode and at least one second target theme mode from multiple target theme modes according to the priority corresponding to the target theme mode.

[0096] In step S1412, if there are multiple target theme patterns, after the web application determines a first target theme pattern, it can also monitor the target data corresponding to each target theme pattern, and switch between the first target theme pattern and the second target theme pattern according to the change of the target data corresponding to the second target theme pattern. Specifically, the second target theme pattern with changed target data is used as the new first target theme pattern, and the original first target theme pattern is used as the new second target theme pattern to complete the switching between the first target theme pattern and the second target theme pattern.

[0097] The following combines Figure 4 and Figure 5 to introduce the switching process between the first target theme pattern and the second target theme pattern.

[0098] Figure 4 FIG. is a schematic diagram provided by an embodiment of the present application for restoring from the second target theme pattern to the first target theme pattern.

[0099] As Figure 4 shown, for the foregoing Figure 2 shown embodiment, after determining that the time mode is the first target theme pattern and the mood mode is the second target theme pattern, the web application can obtain mood information in real time or at regular intervals through the mood API. If the mood data changes, such as from a calm mood to a happy mood, the web application can determine the mood mode as the new first target theme pattern and the time mode as the new second target theme pattern.

[0100] Figure 5 FIG. is another schematic diagram provided by an embodiment of the present application for switching from the first target theme pattern to the second target theme pattern.

[0101] As Figure 5 shown, for the foregoing Figure 3 shown embodiment, after determining that the solar term mode is the first target theme and the sunrise / sunset mode and the weather mode are the second target themes, the web application can obtain time data and weather data in real time or at regular intervals through the clock API and the mood API. If the time data changes, for example, as time goes by, the time difference between the current moment and the sunset moment is within a preset range, the web application can determine the sunrise / sunset mode as the new first target theme pattern and the solar term mode and the weather mode as the new second target theme patterns.

[0102] In addition, considering that the priority of the original first target theme mode is relatively high, after the web application completes the switch between the first target theme mode and the second target theme mode, it can, after meeting the preset restoration condition, re-determine the first target theme mode and the second target theme mode according to the priority of the target theme mode, or directly switch back from the current second target mode (i.e., the original first target theme mode) to the first target theme mode (such as switching the Figure 4 time mode from the second target theme mode back to the first target theme mode) after meeting the preset restoration condition, or switch back from the current first target mode (i.e., the original second target theme mode) to the second target theme mode (such as switching the Figure 4 mood mode from the first target theme mode back to the second target theme mode). That is to say, the restoration of the first target theme mode and the second target theme mode is completed. Among them, the preset restoration condition can include time constraints or target data constraints, etc. For example, if the web application reaches the preset duration after completing the switch between the second target theme mode and the first target theme mode, it can be considered that the time constraint in the preset restoration condition is met; or after the web application completes the switch between the second target theme mode and the first target theme mode, the change in the target data corresponding to the original second target theme mode meets the target data constraint in the preset restoration condition.

[0103] Next, in combination with Figure 6 and Figure 7 , the restoration process of the first target theme mode and the second target theme mode will be introduced.

[0104] Figure 6 FIG. is a schematic diagram provided by an embodiment of the present application for switching back from the second target theme mode to the first target theme mode.

[0105] As Figure 6 shown, for the foregoing Figure 4 embodiment, after the web application determines the mood mode as the new first target theme mode and the time mode as the new second target theme mode, after 3 minutes, the web application considers that the preset restoration condition is reached. At this time, the web application switches the mood mode back to the second target theme mode and the time mode back to the first target theme mode. In this way, the restoration of the first target theme mode and the second target theme mode is completed.

[0106] Figure 7 FIG. is another schematic diagram provided by an embodiment of the present application for switching back from the second target theme mode to the first target theme mode.

[0107] As Figure 7 shown, for the foregoing Figure 5In the illustrated embodiment, after the web application determines the sunrise and sunset mode as the new first target theme mode, and the solar term mode and the weather mode as the new second target theme modes, as time goes by, if the time difference between the current moment and the sunset moment exceeds the preset range, the web application considers that the preset recovery condition is met. At this time, the web application restores the sunrise and sunset mode from the current first target theme mode to the second target theme mode, restores the solar term mode from the current second target theme mode to the first target theme mode, and the weather mode continues to remain the second target theme mode unchanged. In this way, the restoration of the first target theme mode and the second target theme mode is completed.

[0108] It should be noted that the change of the target data in the embodiments of the present application refers to the change of the application theme matched by the target data. Exemplarily, if in the mood data, the mood index corresponds to the calm theme when it is between [41, 60], and corresponds to the happy theme when it is between [61, 80], then when the mood index changes from 60 to 61, that is, the application theme matched by the mood data changes from the calm theme to the happy theme, it can be considered that the mood data has changed. And when the mood index changes from 50 to 51, that is, the application theme matched by the mood data is still the calm theme, it can be considered that the mood data has not changed. In this way, it is possible to avoid frequent small fluctuations of the target data, resulting in frequent switching between the first target theme mode and the second target theme mode, which affects the display effect of the application theme and the user experience.

[0109] In the embodiments of the present application, through steps S1411 and S1412, in the case of multiple target theme modes, the web application determines the more important first target theme mode and the secondary second target theme mode according to the priority, which can ensure that the first target theme mode better meets the user's preferences and the actual environment. In addition, the web application switches between the first target theme mode and the second target theme mode according to the change of the target data corresponding to the second target theme mode, which can avoid the user missing the environmental or situational changes while catering to the user's preferences, and at the same time can improve the diversity and interest of the application theme switching. Further, after the web application completes the switching between the first target theme mode and the second target theme mode, if it monitors that the preset recovery condition is met, it restores the first target theme mode and the second target theme mode, which can avoid the application theme staying in the secondary target theme mode for a long time.

[0110] S142: In response to the switching instruction or the change of the target data, according to the preset theme matching rule, determine the first target theme that matches the target data among the multiple application themes corresponding to the first target theme mode.

[0111] In step S142, if the web application receives a switching instruction or detects a change in the target data corresponding to the first target theme, it switches the application theme. Specifically, the web application determines, according to the preset theme matching rule, among multiple application themes corresponding to the first target theme mode, the application theme that matches the target data as the first target theme. Among them, the switching instruction can be input by the user by clicking a switching button or the like, or can be automatically triggered by a timer.

[0112] Exemplarily, after the user first opens the application, the user can input a switching instruction to the web application. In response to the switching instruction, the web application filters out the first target theme, and then uses the first target theme to implement the interface display of the web application, completing the initialization of the application theme.

[0113] Exemplarily, for the foregoing Figure 3 shown embodiment, after determining that the solar term mode is the first target theme, if the web application detects a change in the current solar term, for example, from the Spring Equinox to the Tomb-Sweeping Festival, among the application themes corresponding to the solar term mode, it determines the Tomb-Sweeping Festival theme that matches the Tomb-Sweeping Festival solar term as the first target theme.

[0114] In the embodiment of the present application, through steps S141 and S142, the web application determines the first target theme mode according to the priority, which can ensure that the first target theme mode better conforms to the user's preference and meets the user's personalized needs; in addition, the web application determines the first target theme according to the target data, which can ensure that the first target theme better conforms to the actual environment, and moreover, the first target theme that changes according to the actual environment can bring a sense of freshness and fun to the user.

[0115] S15: Obtain the target style information corresponding to the first target theme, and based on the target style information, switch the current theme to the first target theme.

[0116] In step S15, the web application switches the current theme to the first target theme to complete the automatic switching of the application theme.

[0117] In some embodiments, the web application is developed based on Vue3, and can determine the target style information through CSS variables, etc., and modify the theme style based on the target style information to achieve the switching from the current theme to the first target theme.

[0118] Figure 8 It is another flowchart of the theme switching method of the web application provided by the embodiment of the present application.

[0119] As Figure 8 shown, the method includes the following steps S21 - S26:

[0120] S21: Create a view component for each preset theme mode.

[0121] In step S21, for each preset theme mode, a corresponding view (Vue) component is created. Among them, the Vue component includes a template module, a script module, and a style module.

[0122] Among them, the template module is configured to render the mode setting page of the web application.

[0123] For example, in the Vue component corresponding to the weather mode, the template module can be configured to render the mode setting page of the weather theme mode. Among them, the mode setting page can display the current weather data and a "switch theme" button. When the user clicks the "switch theme" button, a theme switch will be triggered. For example, the switching instruction in step S132 can be input by the user through the "switch theme" button. It can be understood that except at the moment corresponding to step S132, the user can also click the "switch theme" button at any other moment, and the embodiments of the present application do not limit this.

[0124] Among them, the script module is configured to determine the theme matching rules corresponding to the preset theme mode.

[0125] For example, in the Vue component corresponding to the weather mode, the script module can be configured to receive weather data and, based on the weather data, determine the first target theme and its corresponding background image data in a repository (such as Pinia Store). In this way, the binding between the view component and the responsive target data can be realized, so that when the target data changes, seamless application theme switching can be achieved, improving the performance of the web application and simplifying the development logic.

[0126] In some embodiments, the script module can receive weather information in real time through a WebSocket connection. When new weather information is received and the status value of the switching mode flag bit is the first status value, the application theme of the web application is automatically updated.

[0127] Among them, the script module can determine the theme matching rules corresponding to the weather mode through a repository (such as Pinia Store).

[0128] Exemplarily, the theme matching rules corresponding to the weather mode and the background images corresponding to each application theme can be defined in the repository. Specifically, sunny days can match the light theme, and cloudy days or nights can match the dark theme. In this way, if it is determined that the current is a sunny day according to the weather data, the light theme can be determined as the first target theme, and the background image corresponding to the light theme can be automatically set as the background of the web application.

[0129] It can be understood that in the embodiments of the present application, only the light theme and the dark theme are taken as examples. In some other embodiments, the weather mode may further include other themes, such as the light rain theme, the heavy rain theme, etc., and the embodiments of the present application do not limit this.

[0130] It can be understood that in the embodiments of the present application, only the Pinia Store is used to store the theme matching rules and background images as an example. In some other embodiments, the cloud storage space, etc. can also be used to store the above information so that the settings of the applied theme can be synchronized on different devices.

[0131] It can be understood that in the embodiments of the present application, only the script module reads the theme matching rules in the Pinia Store as an example. In some other embodiments, the theme matching rules can be defined within the script module without reading the Pinia Store.

[0132] Among them, the style module contains the first style information of each applied theme corresponding to the preset theme mode.

[0133] For example, in the Vue component corresponding to the weather mode, the style module can be configured to set the first style information corresponding to the light theme and the dark theme in the weather mode. For example, the text color and background color corresponding to the light theme, the text color and background color corresponding to the dark theme, etc. can be set. It can be understood that in the embodiments of the present application, only the above background color style and text color style are taken as examples. In some other embodiments, the first style information may further include other styles, and the embodiments of the present application do not limit this. In addition, it can be seen that the style module can also be configured to set the style information of the web page rendered by the temple module. For example, the style information of h1 in the web page rendered by the temple module is set in the above style module.

[0134] It should be noted that each module in the Vue component may further include other contents, and the embodiments of the present application will not list them one by one.

[0135] In the embodiments of the present application, through step S21, the web application uses the reactive data binding technology, and through the binding between the Vue component and the reactive target data, it can manage the display interface in the web application and switch the applied theme in real time according to the change of the target data, realizing the seamless switching of the applied theme.

[0136] S22: When the status value of the switching mode flag bit is the first status value, obtain the pre-stored user preference information.

[0137] Among them, the user preference information includes the priority corresponding to at least one preset theme mode, and the switching mode flag bit is used to identify the theme switching mode of the web application;

[0138] S23: Determine at least one target theme mode among multiple preset theme modes based on the priorities corresponding to the preset theme modes.

[0139] S24: Obtain target data corresponding to the target theme mode through the application programming interface corresponding to the target theme mode.

[0140] S25: Based on the target data, determine the first target theme among multiple application themes corresponding to the target theme mode.

[0141] For the descriptions of steps S22 - S25, please refer to the foregoing steps S11 - S14, which will not be elaborated here.

[0142] S26: Obtain the target style information corresponding to the first target theme, and based on the target style information, switch the current theme to the first target theme.

[0143] For the description of step S26, please refer to the foregoing step S15.

[0144] In one implementation, "obtain the target style information corresponding to the first target theme" in step S26 includes the following steps S261 and / or S262:

[0145] S261: In the style module corresponding to the target theme mode, determine the target style information based on the first style information corresponding to the first target theme.

[0146] In step S261, after the web application determines the first target theme, it can obtain the first style information corresponding to the first target theme and determine the target style information based on the first style information. In this way, the web application can update the style of the web application according to the target style information to achieve the switching of the application theme.

[0147] Exemplarily, for the weather mode in the above - mentioned embodiment, after the web application determines that the first target theme is the light theme, it can determine the first style information corresponding to the light theme, such as the background color #ffffff and the text color #000000, in the style module of the Vue component corresponding to the above - mentioned weather mode as the target style information.

[0148] In this way, the web application can switch the current theme to the light theme by switching the background color to the color corresponding to #ffffff (white) and the text color to the color corresponding to #000000 (black).

[0149] In the embodiment of the present application, through step S261, the web application can determine the target style information according to the first style information corresponding to the first target theme in the style module. In this way, the web application can update the display page to the style corresponding to the target style information, thereby achieving the switching of the application theme.

[0150] S262: Determine the target style information corresponding to the first target theme based on user preference information; wherein, the user preference information includes the second style information corresponding to at least one application theme.

[0151] In step S262, after the web application determines the first target theme, it can determine the target style information based on the second style information corresponding to each application theme in the user preference information. In this way, the web application can update the style of the web application according to the target style information to achieve the switching of the application theme.

[0152] Exemplarily, for the weather mode in the above embodiment, after the web application determines that the first target theme is the light theme, it can determine the following information in the user preference information pre-stored in the above Pinia Store as the second style information corresponding to the light theme, such as the address of the background image / images / sunny-bg.jpg, as the target style information.

[0153] In this way, the web application can switch the current theme to the light theme by switching the address of the background image to / images / sunny-bg.jpg.

[0154] Through step S262 in the embodiments of the present application, the web application can determine the target style information according to the second style information corresponding to the first target theme in the user preference information. In this way, the web application can update the display page to the style corresponding to the target style information, thereby achieving the switching of the application theme.

[0155] In addition, in some embodiments, steps S261 and S262 can be adopted simultaneously. For example, after the web application determines that the first target theme is the light theme, it can combine the above first style information and second style information to obtain the target style information. In this way, the web application can switch the current theme to the light theme by switching the background color to white, the text color to black, and the address of the background image to / images / sunny-bg.jpg. In this way, it is more in line with the writing specifications of the project code of the web application and is beneficial to improving the readability and maintainability of the project code.

[0156] Figure 9 It is another flowchart of the theme switching method of the web application provided by the embodiments of the present application.

[0157] As Figure 9 shown, the method includes the following steps S31 - S35:

[0158] S31: If the status value of the switching mode flag bit is the first status value, jump to step S32; otherwise, jump to step S36.

[0159] In step S31, a switching mode flag bit (isManualSwitch) is set in the project code of the web application. If the web application determines that the status value of the current switching mode flag bit is the first status value (for example, isManualSwitch is false), it can be confirmed that the automatic switching mode is enabled, so it jumps to step S32, and the automatic switching of the application theme is performed using steps S32 - S35; otherwise, for example, if the web application determines that the status value of the current switching mode flag bit is the second status value (for example, isManualSwitch is true), it can be confirmed that the manual switching mode is enabled, so it jumps to step S36, and the manual switching of the application theme is performed using steps S36 - S37.

[0160] Among them, the status value of the switching mode flag bit can be set based on user requirements. Specifically, the web application can adjust the status value in response to a status switching instruction input by the user. Exemplarily, a certain display page of the web application includes a setting button for the switching mode. The user can click the setting button for the switching mode to adjust the automatic switching mode to the manual switching mode.

[0161] Figure 10 It is a schematic diagram of setting the status value of the switching mode flag bit provided by an embodiment of the present application.

[0162] Such as Figure 10 As shown, the display interface of the web application includes a drop-down menu for receiving a theme switching request. The drop-down menu displays three options: light theme, dark theme, and auto-follow theme. When the user selects the dark theme or the light theme through the drop-down menu, the web application is set to the manual switching mode, and the current application theme is switched to the dark theme or the light theme based on the user's selection. When the user selects the auto-follow theme through the drop-down menu, the web application is set to the automatic switching mode. Therefore, it can automatically determine whether the current time is day or night based on the current time and sunrise and sunset times, and automatically switch to the light theme during the day and the dark theme at night without user intervention.

[0163] Through the status value of the switching mode flag bit in step S31 of the embodiment of the present application, two modes, namely the automatic switching mode and the manual switching mode, can be implemented. In this way, the user can select the preferred switching mode, which is beneficial to meeting the personalized needs of the user and improving the freedom of the user.

[0164] S32: Obtain the pre-stored user preference information, and determine at least one target theme mode among multiple preset theme modes according to the priorities corresponding to the preset theme modes in the user preference information.

[0165] S33: Obtain the target data corresponding to the target theme mode through the application programming interface corresponding to the target theme mode.

[0166] S34: Based on the target data, determine the first target theme among multiple application themes corresponding to the target theme pattern.

[0167] S35: Obtain the target style information corresponding to the first target theme, and based on the target style information, switch the current theme to the first target theme, and return to step S31.

[0168] For the descriptions of steps S32 - S35, please refer to the foregoing embodiments and will not be elaborated here.

[0169] S36: In response to a theme switching request sent by the user, determine the second target theme corresponding to the theme switching request.

[0170] In step S36, in the manual switching mode of the web application, the application theme is no longer automatically switched according to the target data. At this time, the user sends a theme switching request to the web application by clicking a button or other means. When the web application receives the theme switching request, it starts to switch the application theme to achieve the manual switching of the application theme. Among them, the second target theme can be determined based on the theme switching request.

[0171] It should be noted that in some embodiments, when the user clicks the setting button for the switching mode, the application theme switching can be automatically triggered. That is, by clicking the setting button for the switching mode, the user can generate and send a theme switching request to the web application. In this way, the user does not need to separately input the theme switching request, and the web application can start to perform the manual switching of the application theme.

[0172] S37: Switch the current theme to the second target theme, and return to step S31.

[0173] In step S37, in the manual mode, the web application switches the current theme to the second target theme to achieve the manual switching of the application theme. Among them, the method for obtaining the target style information corresponding to the second target theme is similar to the method for obtaining the target style information corresponding to the foregoing first target theme, and will not be elaborated here.

[0174] In addition, the web application can also save the theme switching request sent by the user and corresponding information such as the time stamp in the historical operation record. In this way, the web application can further deeply analyze the user's preferences based on the historical operation record to update the user preference information.

[0175] It should be understood that the sequence numbers of the steps in the above embodiments do not indicate the order of execution, and the execution order of each process should be determined according to its function and internal logic, and should not constitute any limitation to the implementation process of the embodiments of the present invention. For example, the steps recorded in the above embodiments can be executed in parallel, sequentially, or in different orders, as long as the desired results of the technical solutions disclosed in the present invention can be achieved, and the present invention makes no limitation thereto.

[0176] Corresponding to the embodiments of the theme switching method for web applications described above, an embodiment of a theme switching device for web applications is further provided in an embodiment of the present application.

[0177] Figure 11 It is a schematic diagram of a theme switching device for a web application provided by an embodiment of the present application.

[0178] As Figure 11 shown, the theme switching device 1100 for the web application may include a switching mode determination module 1110, a data acquisition module 1120, a theme determination module 1130, and a theme switching module 1140.

[0179] The switching mode determination module 1110 is configured to determine at least one target theme mode from a plurality of preset theme modes when the status value of the switching mode flag bit is the first status value; wherein, the switching mode flag bit is used to identify the theme switching mode of the web application; the data acquisition module 1120 is configured to obtain target data corresponding to the target theme mode through an application programming interface corresponding to the target theme mode; the theme determination module 1130 is configured to determine a first target theme from a plurality of application themes corresponding to the target theme mode based on the target data; the theme switching module 1140 is configured to obtain target style information corresponding to the first target theme, and based on the target style information, switch the current theme to the first target theme.

[0180] In a possible implementation manner, the switching mode determination module 1110 is configured to obtain at least one preset theme mode and the priority corresponding to the preset theme mode from the pre-stored user preference information; and determine at least one target theme mode from the at least one preset theme mode according to the priority corresponding to the preset theme mode.

[0181] In a possible implementation manner, the theme determination module 1130 is configured to, when there are multiple target theme modes, determine a first target theme mode from the multiple target theme modes according to the priority corresponding to the target theme mode and the target data, otherwise determine the target theme mode as the first target theme mode; in response to a switching instruction or a change in the target data, determine a first target theme that matches the target data from a plurality of application themes corresponding to the first target theme mode according to a preset theme matching rule.

[0182] In a possible implementation, the switching mode determination module 1110 is configured to determine a first target theme mode and at least one second target theme mode among a plurality of target theme modes according to the priority corresponding to the target theme mode; in response to a change in target data corresponding to any one of the second target theme modes, determine any one of the second target theme modes as the first target theme mode, and after a preset recovery condition is reached, return to the step of determining a first target theme mode and at least one second target theme mode among a plurality of target theme modes according to the priority corresponding to the target theme mode.

[0183] In a possible implementation, the theme switching device 1100 further includes a component creation module, which is configured to create view components for each preset theme mode, and the view components include a template module, a script module, and a style module; the template module is configured to render the mode setting page of the web application; the script module is configured to determine the theme matching rules corresponding to the preset theme mode; the style module includes first style information of each application theme corresponding to the preset theme mode; in response to a custom instruction input by the user, update the theme matching rules and / or the first style information.

[0184] In a possible implementation, the theme switching module 1140 is configured to determine target style information in the style module corresponding to the target theme mode based on the first style information corresponding to the first target theme; and / or determine the target style information corresponding to the first target theme based on user preference information, where the user preference information includes second style information corresponding to at least one application theme.

[0185] In a possible implementation, the theme switching module 1140 is configured to, when the status value is the second status value, in response to a theme switching request sent by the user, determine a second target theme corresponding to the theme switching request; and switch the current theme to the second target theme.

[0186] In a possible implementation, the theme switching device 1100 further includes a status switching module, which is configured to adjust the status value in response to a status switching instruction input by the user.

[0187] For the theme switching device 1100 of the web application provided in the embodiments of the present application, the principles and beneficial effects of each module and unit can be seen in the foregoing embodiments of the theme switching method of the web application, and the embodiments of the present application will not be elaborated herein.

[0188] The embodiments of the present application further provide a computing device, including: a processor and a memory; the processor and the memory are coupled; the memory is used to store program instructions; the processor is used to execute the program instructions to execute the method in any one of the above-mentioned embodiments.

[0189] In some embodiments, a computing device may include devices such as servers and terminals, such as rack servers, blade servers, etc.; the computing device includes one or more processors and a memory. The memory is configured to store one or more programs. When the one or more programs are executed by the one or more processors, the one or more processors implement the theme switching method of the web application in the above embodiments.

[0190] Figure 12 It is a schematic diagram of a computing device provided by an embodiment of the present application.

[0191] Among them, the computing device may be a server, for example, it may be a rack server, a high-density server, an AI server, a whole rack server, etc.

[0192] Such as Figure 12 As shown, the computing device 1200 includes: a processor 1201 and a memory 1202. Exemplarily, the computing device 1200 may further include: a communication interface 1203 and a communication bus 1204.

[0193] Among them, the processor 1201, the memory 1202, and the communication interface 1203 complete mutual communication through the communication bus 1204. The communication interface 1203 may include a type of device such as a transmitter and a receiver, and is used to communicate with other devices or communication networks. It may be a wired interface (port), such as a fiber distributed data interface (FDDI), a gigabit ethernet interface (GE).

[0194] In some embodiments, the processor 1201 is used to execute the program 1205, and specifically may execute the relevant steps in the above embodiments of the theme switching method of the web application. Specifically, the program 1205 may include program code, and the program code includes computer-executable instructions.

[0195] Exemplarily, the processor 1201 may be a central processing unit CPU, or an application specific integrated circuit (ASIC), or one or more integrated circuits configured to implement some embodiments of the present application. The one or more processors that the computing device 1200 may include may be of the same type of processor, such as one or more CPUs; or they may be different types of processors, such as one or more CPUs and one or more ASICs. The CPU may be a single-core CPU or a multi-core CPU.

[0196] In some embodiments, the memory 1202 is used to store the program 1205. The memory 1202 may include a high-speed random access memory (Random Access Memory, RAM), or may include non-volatile memory (Non-Volatile Memory, NVM), such as at least one disk memory.

[0197] The program 1205 can be specifically called by the processor 1201 to cause the computing device 1200 to perform the operations of the theme switching method for web applications.

[0198] Some embodiments of the present application provide a computer-readable storage medium storing at least one executable instruction, which, when running on the computing device 1200, causes the computing device 1200 to perform the theme switching method for web applications in the above embodiments.

[0199] The executable instruction can be specifically used to cause the computing device 1200 to perform the operations of the theme switching method for web applications.

[0200] For example, the computer-readable storage medium can be a read-only memory (Read-Only Memory, ROM), a random access memory (Random Access Memory, RAM), a compact disc read-only memory (Compact Disc Read-Only Memory, CD-ROM), magnetic tape, floppy disk, and optical data storage device, etc.

[0201] Some embodiments of the present application provide a chip system applied to a server. The chip system includes one or more interface circuits and one or more processors. The interface circuits and the processors are interconnected by lines. The interface circuits are used to receive signals from the memory of the server and send signals to the processors, and the signals include computer instructions stored in the memory. When the server processor executes the computer instructions, the server performs each step in the theme switching method for web applications shown in the above method embodiments.

[0202] The beneficial effects that can be achieved by the readable storage medium provided in some embodiments of the present application can refer to the beneficial effects in the corresponding theme switching method for web applications provided above, and will not be elaborated here.

[0203] It should be noted that, in the application, relational terms such as first and second, etc. are only used to distinguish one entity or operation from another entity or operation, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Moreover, the terms "include", "comprise" or any other variants thereof are intended to cover non-exclusive inclusion, so that a process, method, article or device including a series of elements includes not only those elements, but also other elements not explicitly listed, or also includes elements inherent to such process, method, article or device. In the absence of further restrictions, the elements defined by the sentence "including a ..." do not exclude the existence of other identical elements in the process, method, article or device including the elements.

[0204] Each embodiment in this specification is described in a related manner, and the same or similar parts between the embodiments can be referred to each other, and each embodiment focuses on the differences from other embodiments. In particular, for the device embodiment, since it is basically similar to the method embodiment, the description is relatively simple, and the relevant parts can be referred to the partial description of the method embodiment.

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

[0206] For the purposes of this specification, a "computer-readable medium" can be any apparatus that can contain, store, communicate, propagate, or transport the program for use by an instruction execution system, apparatus, or device or in conjunction with such instruction execution system, apparatus, or device.

[0207] More specific examples (a non-exhaustive list) of computer-readable media include the following: an electrical connection having one or more wires (electronic device), a portable computer disk case (magnetic device), a random access memory (RAM), a read-only memory (ROM), an erasable and programmable read-only memory (EPROM or flash memory), a fiber optic device, and a portable compact disk read-only memory (CDROM).

[0208] In addition, a computer-readable medium can even be paper or other suitable media on which a program can be printed, because the program can be obtained electronically, for example, by optically scanning the paper or other media, followed by editing, interpretation or, if necessary, other appropriate processing, and then stored in a computer memory. It should be understood that the various parts of the present application can be implemented by hardware, software, firmware, or a combination thereof.

[0209] In the above embodiments, multiple steps or methods can be implemented by software or firmware stored in a memory and executed by a suitable instruction execution system. For example, if implemented in hardware, as in another embodiment, any one or a combination of the following techniques well known in the art can be used: discrete logic circuits having logic gate circuits for implementing logical functions on data signals, application specific integrated circuits having appropriate combinational logic gate circuits, programmable gate arrays (PGAs), field programmable gate arrays (FPGAs), etc. The above-described embodiments are only specific embodiments of the present application and are not used to limit the protection scope of the present application. Any modifications, equivalent replacements, improvements, etc. made on the basis of the technical solutions of the present application shall be included in the protection scope of the present application.

Claims

1. A method for theme switching of a web application, characterized in that, The method includes: When the status value of the switching mode flag bit is the first status value, obtaining the pre-stored user preference information; wherein, the user preference information includes the priorities corresponding to at least one preset theme mode, and the switching mode flag bit is used to identify the theme switching mode of the web application; Determining at least one target theme mode from the at least one preset theme mode according to the priorities corresponding to the preset theme modes; Obtaining target data corresponding to the target theme mode through the application programming interface corresponding to the target theme mode; Based on the target data, determining a first target theme among the multiple application themes corresponding to the target theme mode; Obtaining the target style information corresponding to the first target theme, and based on the target style information, switching the current theme to the first target theme.

2. The method according to claim 1, wherein The preset theme modes include at least one of a weather mode, a solar term mode, a festival mode, a time mode, a light and dark mode, a sunrise and sunset mode, a mood mode, an eye protection mode, and a function mode.

3. The method according to claim 1 or 2, characterized in that The determining a first target theme among the multiple application themes corresponding to the target theme mode based on the target data includes: When there are multiple target theme modes, determining a first target theme mode from the multiple target theme modes according to the priorities corresponding to the target theme modes and the target data; otherwise, determining the target theme mode as the first target theme mode; In response to a switching instruction or a change in the target data, determining the first target theme that matches the target data among the multiple application themes corresponding to the first target theme mode according to a preset theme matching rule.

4. The method according to claim 3, wherein The determining a first target theme mode from the multiple target theme modes according to the priorities corresponding to the target theme modes and the target data includes: Determining the first target theme mode and at least one second target theme mode from the multiple target theme modes according to the priorities corresponding to the target theme modes; In response to a change in the target data corresponding to any one of the second target theme modes, determining any one of the second target theme modes as the first target theme mode, and after a preset recovery condition is met, returning to the step of determining the first target theme mode and at least one second target theme mode from the multiple target theme modes according to the priorities corresponding to the target theme modes.

5. The method according to claim 1, characterized in that, The method further includes: For each of the preset theme modes, creating a view component, the view component including a template module, a script module, and a style module; the template module is configured to render the mode setting page of the web application; the script module is configured to determine the theme matching rule corresponding to the preset theme mode; the style module includes the first style information of each of the application themes corresponding to the preset theme mode; In response to a custom instruction input by the user, updating the theme matching rule and / or the first style information.

6. The method according to claim 5, wherein The obtaining the target style information corresponding to the first target theme includes: In the style module corresponding to the target theme mode, determine the target style information based on the first style information corresponding to the first target theme; and / or, Determine the target style information corresponding to the first target theme based on the user preference information; wherein, the user preference information includes second style information corresponding to at least one of the application themes.

7. The method according to claim 1, characterized in that, The method further includes: When the status value is the second status value, in response to a theme switching request sent by the user, determine a second target theme corresponding to the theme switching request; Switch the current theme to the second target theme.

8. The method according to any one of claims 1 to 7, characterized in that, The method further includes: In response to a status switching instruction input by the user, adjust the status value.

9. A theme switching device for a web application, comprising: A switching mode determination module, configured to obtain pre-stored user preference information when the status value of the switching mode flag bit is the first status value; And, determine at least one target theme mode from at least one preset theme mode according to the priorities corresponding to the preset theme modes; wherein, the user preference information includes priorities corresponding to at least one preset theme mode, and the switching mode flag bit is used to identify the theme switching mode of the web application; A data acquisition module, configured to acquire target data corresponding to the target theme mode through an application programming interface corresponding to the target theme mode; A theme determination module, configured to determine a first target theme from multiple application themes corresponding to the target theme mode based on the target data; A theme switching module, configured to acquire target style information corresponding to the first target theme, and switch the current theme to the first target theme based on the target style information.

10. A computing device, characterized in that, The computing device includes a memory and a processor; the memory is coupled to the processor; the memory is used to store computer program code, and the computer program code includes computer instructions. When the processor is used to execute the computer instructions, the computing device is enabled to execute the theme switching method of the web application according to any one of claims 1 to 8.

Images