Skin changing implementation method and system based on style sheet

Abstract

The invention provides a style sheet-based skin changing implementation method and system. The method comprises the following steps: S1, making a skin color value table; s2, writing an application program according to the skin color value table; s3, selecting as a skin identifier through the application program, reading the skin color value table, and replacing a color value actually corresponding to the skin identifier in the current memory with a target color value; the skin identifier is a variable name; s4, replacing the variable in the current style sheet with the target color value to obtain a new style skin; and S5, putting the new style of skin to a target window. According to the method, color values in software are managed in a unified manner by adopting a color value table form, so that the time cost and the labor cost for adding new skin are reduced.

Description

Technical Field

[0001] The present invention relates to, in particular, a method and system for implementing skinning based on a style sheet, and more particularly, to an instant and efficient method for implementing skinning based on a style sheet. Background Art

[0002] With the rapid development of smart phones and mobile Internet, users' demands for mobile applications are becoming increasingly personalized and diversified. Application skinning technology has emerged. Skinning technology allows users to freely choose the theme, color and style of the application according to their preferences and needs, thereby achieving a personalized interface experience, which has good commercial value.

[0003] Currently, application skinning technology also faces many technical difficulties in the implementation process.

[0004] First, resource ID management is a major challenge. To ensure that the business code does not need to be modified during the skinning process, the resource IDs in the new skin and the old skin need to be consistent. At the same time, in the process of gradual skinning, new and old resources need to coexist, and the business code needs to be able to use the corresponding resources according to different situations.

[0005] Secondly, the management of migration logic is also a big problem. In order to implement functions such as gradual skinning, deletion of old skin resources, and skin upgrade and downgrade, the business code needs to handle complex logic switching and ensure that these switches do not affect the stability of the application and user experience.

[0006] Patent document CN107133038A discloses a method and device for skinning an application program, which includes: receiving a user input instruction and obtaining a target color corresponding to the user input instruction; changing the color of a set of single-color images of common components constituting an interface according to the target color and an extensible markup language table; displaying the common components constituting the interface after the color change to achieve skinning of the application program. The embodiment of the present application reduces the design workload, and the application program occupies less storage space.

[0007] In other words, although the Chinese invention patent with application number CN201710293906.0 discloses an "application skinning method" in the prior art, which can support application skinning, users are required to select color values ​​for skinning, which is challenging for users. Moreover, if the technical solution is applied to more complex scenarios, it may cause freezes during the skinning process. This problem needs to be solved urgently. Summary of the invention

[0008] In view of the defects in the prior art, the object of the present invention is to provide a method and system for implementing skinning based on a style sheet.

[0009] A method for implementing skinning based on a style sheet according to the present invention includes: Step S1: creating a skin color value table; Step S2: writing an application program according to the skin color value table; Step S3: select the skin identifier through the application, read the skin color value table, and replace the color value actually corresponding to the skin identifier in the current memory with the target color value; the skin identifier is the variable name; Step S4: Replace the variable in the current style sheet with the target color value to obtain a new style skin; Step S5: Apply the new style skin to the target window.

[0010] Preferably, in step S1, the skin color value table is used to record the variable name and the corresponding color value of the skin; the skin color value table is built into the installation package; the installation package is used to send to the client; In the step S2, the color of the application corresponds to the variable name of the corresponding color in the skin color value table; In the step S2, all independent windows of the application are each an independent module; the independent module has an identification string; the identification string is used to correspond to the style sheet.

[0011] Preferably, the step S4 includes: Step S4.1: Select a corresponding skin color value table according to the skin identification; Step S4.2: traverse all color values ​​in the skin color value table; let the color values ​​replace each variable in the style table one by one; re-execute step S4.2 until the traversal is completed.

[0012] Preferably, in step S5, the skin file is loaded into the memory, and according to the correspondence between the style sheet file and the module, the top-level object of the module of the application is distributed, and then the top-level object is distributed to the sub-objects step by step to present a new style skin; The style sheet file is a UI interface style sheet; The correspondence between the style sheet file and the module is the object relationship between the style sheet file and the module specified by the application.

[0013] A skinning implementation system based on a style sheet provided by the present invention includes: Module M1: Create a skin color table; Module M2: writing an application according to the skin color value table; Module M3: select the skin identifier through the application, read the skin color value table, and replace the color value actually corresponding to the skin identifier in the current memory with the target color value; the skin identifier is the variable name; Module M4: replace the variable in the current style sheet with the target color value to obtain a new style skin; Module M5: Apply the new style skin to the target window.

[0014] Preferably, in the module M1, the skin color value table is used to record the variable name and the corresponding color value of the skin; the skin color value table is built into the installation package; the installation package is used to send to the client; In the module M2, the color of the application corresponds to the variable name of the corresponding color in the skin color value table; In the module M2, all independent windows of the application are each an independent module; the independent module has an identification string; the identification string is used to correspond to the style sheet.

[0015] Preferably, the module M4 includes: Module M4.1: Select the corresponding skin color table according to the skin identification; Module M4.2: traverse all color values ​​in the skin color value table; make the color values ​​replace each variable in the style sheet one by one; re-trigger module M4.2 until the traversal is completed.

[0016] Preferably, in the module M5, the skin file is loaded into the memory, and according to the correspondence between the style sheet file and the module, the top-level object of the module of the application is distributed, and then the top-level object is distributed to the sub-objects step by step to present a new style skin; The style sheet file is a UI interface style sheet; The correspondence between the style sheet file and the module is the object relationship between the style sheet file and the module specified by the application.

[0017] According to a computer-readable storage medium storing a computer program provided by the present invention, when the computer program is executed by a processor, the steps of the skinning implementation method based on a style sheet are implemented.

[0018] An electronic device provided according to the present invention includes a memory, a processor, and a computer program stored in the memory and executable on the processor. When the computer program is executed by the processor, the steps of the style sheet-based skinning implementation method are implemented.

[0019] Compared with the prior art, the present invention has the following beneficial effects: 1. The present invention solves the problem of interface freeze during skinning by adopting a modular style sheet method, and improves the efficiency of skinning. The modular style sheet refers to dividing the program functions into multiple modules when the program is written, and providing a style sheet for different modules. The benefit is that the style sheet can be divided into modules when performing variable replacement, and the style sheet file can be distributed to the specified module according to the corresponding relationship, thereby improving the efficiency of program skinning.

[0020] 2. The present invention manages the color values ​​in the software in a unified manner by adopting a color value table, thereby reducing the time cost and labor cost when adding a new skin.

[0021] 3. The present invention solves the problem of needing to issue a version when adding a skin by adopting a method of transmitting skin files over the network. BRIEF DESCRIPTION OF THE DRAWINGS

[0022] Other features, objects and advantages of the present invention will become more apparent from the detailed description of non-limiting embodiments made with reference to the following drawings: Figure 1 A schematic diagram of the process provided by the present invention. DETAILED DESCRIPTION

[0023] The present invention is described in detail below in conjunction with specific embodiments. The following embodiments will help those skilled in the art to further understand the present invention, but are not intended to limit the present invention in any form. It should be noted that, for those of ordinary skill in the art, several changes and improvements can also be made without departing from the concept of the present invention. These all belong to the protection scope of the present invention.

[0024] The present invention realizes a method for efficiently changing skins by module without exiting the program during the use of the application. The universal skin file is built-in with skin resources when the program is released. If the user wants to use more skin styles, he can still browse the online resources provided by the background through the network and download them for use.

[0025] The present invention divides program functions into multiple modules and provides style sheets that are written for different modules. The advantage is that the style sheets can be divided into modules when performing variable replacement, and the style sheet files can be distributed to designated modules according to the corresponding relationship, thereby improving the program skinning efficiency.

[0026] Specifically, the modular process includes: 1. First, let all top-level windows, that is, all independent windows, be an independent module; each independent module has an identification string.

[0027] 2. Write style sheets for these identifier strings; Specifically, the identification character strings of the modules may be the same or different.

[0028] 3. When the program starts and each module is initialized, the object of the independent module is registered in the skin manager. The skin manager is a memory object responsible for storing the objects of each independent module.

[0029] 4. When changing the skin, it is done through the skin manager; the skin manager traverses the registered objects of the independent module, searches for the corresponding style sheet according to the identification string, and then distributes the content of the style sheet to the objects of the independent module.

[0030] 5. When traversing the objects of the independent modules, if the skinning of a module takes a long time, continue to process the UI event queue after the skinning of the module is completed to reduce the visual lag of the user. Then, skinn the next independent module object. Finally, the skinning is completed until all module objects are traversed.

[0031] According to a method for implementing skinning based on a style sheet provided by the present invention, the process of the software system includes: Step S1: creating a skin color value table; Step S2: writing an application program according to the skin color value table; Step S3: Select a skin identifier, i.e., a variable name, read the skin color value table, and replace the color value actually corresponding to the variable name in the current memory with the target color value; Step S4: Replace the variables in the current style sheet with the target color value to obtain a new style skin; Step S5: Apply the new style skin to the target window; In the step S2, the color of the application corresponds to the variable name of the corresponding color in the skin color value table; In the step S1, the skin color value table records a series of variable names and corresponding color values; In the step S1, the skin color value table is transmitted over the network, which solves the problem of needing to release a version when adding a skin; specifically, the skin color value table is built into the installation package when the version is released; generally speaking, a set of white skin color value table and black skin color value table are generally built-in; after the version is released, if a new skin is added, the prepared skin color value table can be transmitted to the client through the network; after the client receives the new skin color value table, it is dynamically added to the skin changing function.

[0032] Skin files are UI interface style sheets written by programmers. Font colors are represented by variables. When generating actual usable skin files, the color values ​​corresponding to the variables in the skin color value table are used to replace them. The skin color value table, that is, the color value list abstracted by the designer, records a series of variable names and corresponding color values.

[0033] In other words, the skin color value table is abstracted after the UI designer performs system design; In step S2, an application is written according to the skin color value table; specifically, when writing the program, a unique name is added to each object, so that the font size, color, border and other attributes of each object can be customized in the style sheet. If the object does not provide a name, the style sheet can also add a unified style to a certain type of object.

[0034] In step S4, the variables in the style sheet are replaced with target color values ​​according to the modules, which is specifically implemented as follows: Step S4.1: Selecting a corresponding skin color value table according to the skin identifier; Step S4.2: traverse all color values ​​in the skin color value table, and let the color values ​​replace each variable in the style sheet file one by one; re-execute step S4.2 until the traversal is completed; the style sheet file, i.e., the skin file, is the configuration information written by the programmer for the UI interface; Specifically, in the step S4.2, all skin files are traversed to send the skin files to the corresponding modules in a targeted manner, so as to achieve modular skinning, improve skinning efficiency, and reduce interface freezes.

[0035] In the step S5, the style is refreshed to a specific window according to the module, which is specifically implemented as follows: when the user clicks to switch the skin, the skin file with the variables replaced in step S4 is loaded into the memory, and then the file is directed to the top-level object of the module in the application according to the correspondence between the style sheet file and the module, and then the top-level object distributes it to the child objects step by step until the child object has no children. The distributed style sheet is parsed by each object itself.

[0036] Specifically, the correspondence between the style sheet file and the module, that is, the object relationship between the style sheet file and the module will be specified in the program. When the variables in the style sheet are replaced, the style sheet will be distributed to the corresponding module according to the correspondence; the top-level object of the module will parse the style sheet and distribute it to the sub-modules level by level.

[0037] In other words, a method for implementing skinning based on a style sheet provided by the present invention includes: Step 1: UI designers design the system and abstract a skin color value table, which records a series of variable names and corresponding color values; Step 2: All colors used in the application are uniformly named with the variable names corresponding to the color values; Step 3: When the application changes its skin, the corresponding color value table is read according to the currently selected skin identifier, and the color value actually used by the variable in the memory is replaced; Step 4: Replace the variables in the style sheet by module with new color values; Step 5: Apply the new style to specific windows by module.

[0038] In other words, in step 4: 1. The user clicks on the skin change function, and gets the corresponding skin color value table based on the unique skin identifier clicked by the user 2. Read all color values ​​in the skin color table 3. By traversing all color values, replace each variable in the style sheet file one by one until all variables become specific color values 4. Traverse the skin files under all modules and execute step 3 in a loop.

[0039] The present invention also provides a style sheet-based skin changing implementation system, which can be implemented by executing the process steps of the style sheet-based skin changing implementation method, that is, those skilled in the art can understand the style sheet-based skin changing implementation method as a preferred implementation mode of the style sheet-based skin changing implementation system.

[0040] A skinning implementation system based on a style sheet provided by the present invention includes: Module M1: Create a skin color table; Module M2: writing an application according to the skin color value table; Module M3: select the skin identifier through the application, read the skin color value table, and replace the color value actually corresponding to the skin identifier in the current memory with the target color value; the skin identifier is the variable name; Module M4: replace the variable in the current style sheet with the target color value to obtain a new style skin; Module M5: Apply the new style skin to the target window.

[0041] According to a computer-readable storage medium storing a computer program provided by the present invention, when the computer program is executed by a processor, the steps of the skinning implementation method based on a style sheet are implemented.

[0042] An electronic device provided according to the present invention includes a memory, a processor, and a computer program stored in the memory and executable on the processor. When the computer program is executed by the processor, the steps of the style sheet-based skinning implementation method are implemented.

[0043] Those skilled in the art know that, in addition to realizing the system and its various devices, modules, and units provided by the present invention in a purely computer-readable program code, it is entirely possible to realize the same functions in the form of logic gates, switches, application-specific integrated circuits, programmable logic controllers, and embedded microcontrollers by logically programming the method steps. Therefore, the system and its various devices, modules, and units provided by the present invention can be considered as a hardware component, and the devices, modules, and units included therein for realizing various functions can also be regarded as structures within the hardware component; the devices, modules, and units for realizing various functions can also be regarded as both software modules for realizing the method and structures within the hardware component.

[0044] The above describes the specific embodiments of the present invention. It should be understood that the present invention is not limited to the above specific embodiments, and those skilled in the art can make various changes or modifications within the scope of the claims, which does not affect the essence of the present invention. In the absence of conflict, the embodiments of the present application and the features in the embodiments can be combined with each other arbitrarily.

Claims

1. A method for implementing skinning based on a style sheet, characterized in that: include: Step S1: creating a skin color value table; Step S2: writing an application program according to the skin color value table; Step S3: select the skin identifier through the application, read the skin color value table, and replace the color value actually corresponding to the skin identifier in the current memory with the target color value; the skin identifier is the variable name; Step S4: Replace the variable in the current style sheet with the target color value to obtain a new style skin; Step S5: Apply the new style skin to the target window.

2. The method for implementing skinning based on style sheet according to claim 1, characterized in that: In the step S1, the skin color value table is used to record the variable name and the corresponding color value of the skin; the skin color value table is built into the installation package; and the installation package is used to send to the client; In the step S2, the color of the application corresponds to the variable name of the corresponding color in the skin color value table; In the step S2, all independent windows of the application are each an independent module; the independent module has an identification string; the identification string is used to correspond to the style sheet.

3. The method for implementing skinning based on style sheet according to claim 2, characterized in that: In the step S4, it includes: Step S4.1: Select a corresponding skin color value table according to the skin identification; Step S4.2: traverse all color values ​​in the skin color value table; let the color values ​​replace each variable in the style table one by one; re-execute step S4.2 until the traversal is completed.

4. The method for implementing skinning based on style sheet according to claim 3, characterized in that: In the step S5, the skin file is loaded into the memory, and the top-level object of the module of the application is distributed according to the correspondence between the style sheet file and the module, and then the top-level object is distributed to the sub-objects step by step to present a new style skin; The style sheet file is a UI interface style sheet; The correspondence between the style sheet file and the module is the object relationship between the style sheet file and the module specified by the application.

5. A skinning implementation system based on style sheet, characterized in that: include: Module M1: Create a skin color table; Module M2: writing an application according to the skin color value table; Module M3: select the skin identifier through the application, read the skin color value table, and replace the color value actually corresponding to the skin identifier in the current memory with the target color value; the skin identifier is the variable name; Module M4: replace the variable in the current style sheet with the target color value to obtain a new style skin; Module M5: Apply the new style skin to the target window.

6. The skinning implementation system based on style sheet according to claim 5, characterized in that: In the module M1, the skin color value table is used to record the variable name and the corresponding color value of the skin; the skin color value table is built into the installation package; the installation package is used to send to the client; In the module M2, the color of the application corresponds to the variable name of the corresponding color in the skin color value table; In the module M2, all independent windows of the application are each an independent module; the independent module has an identification string; the identification string is used to correspond to the style sheet.

7. The skinning implementation system based on style sheet according to claim 6, characterized in that: The module M4 includes: Module M4.1: Select the corresponding skin color table according to the skin identification; Module M4.2: traverse all color values ​​in the skin color value table; make the color values ​​replace each variable in the style sheet one by one; re-trigger module M4.2 until the traversal is completed.

8. The skinning implementation system based on style sheet according to claim 7, characterized in that: In the module M5, the skin file is loaded into the memory, and according to the correspondence between the style sheet file and the module, the top-level object of the module of the application is distributed, and then the top-level object is distributed to the sub-objects step by step to present a new style skin; The style sheet file is a UI interface style sheet; The correspondence between the style sheet file and the module is the object relationship between the style sheet file and the module specified by the application.

9. A computer-readable storage medium storing a computer program, characterized in that: When the computer program is executed by a processor, the steps of the method for implementing skinning based on a style sheet according to any one of claims 1 to 4 are implemented.

10. An electronic device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein: When the computer program is executed by a processor, the steps of the method for implementing skinning based on a style sheet according to any one of claims 1 to 4 are implemented.

Images