Page code file generation method and device, and page rendering method and device

Abstract

The present disclosure provides a page code file generation method and device, and a page rendering method and device, wherein the method comprises: obtaining an initial page source file of a target page; the page source file comprises a structure file and a style file; obtaining an initial color value corresponding to a page element in the target page from the page source file; determining a first target color variable corresponding to the page element based on the initial color value and a pre-set color card; wherein the color card is used to describe the corresponding relationship between the colors corresponding to at least one color variable in at least one color rendering mode; replacing the initial color value included in the initial page source file with the first target color variable to obtain a target page source file; and generating a page code file of the target page based on the target page source file.

Description

Technical Field

[0001] The present disclosure relates to the technical field of software development, and in particular to a method and device for generating a page code file, and a method and device for rendering a page. Background Art

[0002] With the development of technology, the use of smart terminals is becoming more and more common. Different users have different usage habits. Taking e-book reading as an example, some users like black text on a white background, some users like white text on a black background, and some users like to use different background colors and font colors at different time periods. At this time, the application needs to configure multiple sets of background colors and font colors to bring users different browsing experiences.

[0003] Most of the current color mode change schemes are relatively fixed. For example, users can only switch the display interface to eye protection mode, night mode, etc. For some personalized color modes that users want to set, the corresponding conversion schemes are particularly insufficient. Summary of the Invention

[0004] The embodiments of the present disclosure at least provide a method and device for generating a page code file, and a method and device for rendering a page.

[0005] In a first aspect, an embodiment of the present disclosure provides a method for generating a page code file, comprising:

[0006] Obtaining the initial page source file of the target page; the page source file includes: a structure file and a style file;

[0007] Obtaining, from the page source file, an initial color value corresponding to a page element in the target page;

[0008] Determining a first target color variable corresponding to the page element based on the initial color value and a preset color card, wherein the color card is used to describe the corresponding relationship between color values ​​corresponding to at least one color variable in at least one color rendering mode;

[0009] Replacing the initial color value included in the initial page source file with the first target color variable to obtain a target page source file;

[0010] Generate a page code file of the target page based on the target page source file;

[0011] Among them, the first target color variable is used to pass the color value corresponding to the first target color variable in the pre-configured color rendering mode into the first target color variable when rendering the target page based on the page code file, and perform color rendering on the associated page elements based on the first target color variable with the passed color value.

[0012] In an optional implementation manner, obtaining the initial color value corresponding to the page element in the target page from the page source file includes:

[0013] Traversing the source code included in the page source file, and reading a first target statement for defining the page element from the source code;

[0014] The initial color value corresponding to the page element is read from the first target statement.

[0015] In an optional embodiment, the at least one color rendering mode includes: a base color rendering mode; different color variables correspond to different colors in the base color rendering mode;

[0016] The determining, based on the initial color value and a preset color card, a first target color variable corresponding to the page element includes:

[0017] Based on the initial color value, determining a target color corresponding to the initial color value from a plurality of colors corresponding to the reference color rendering mode;

[0018] The color variable corresponding to the target color is determined as a first target color variable corresponding to the page element.

[0019] In an optional implementation, generating the page code file of the target page based on the target page source file includes:

[0020] Determine the file type of the target page source file;

[0021] Based on the file type, a syntax replacement operation is performed on the source code in the target page source file to obtain the page code file.

[0022] In an optional embodiment, the method further comprises: injecting into the structure file an initialization program code for initializing the color of each page element in the target page when rendering the target page;

[0023] The initialization program code is used to assign a value to a first target color variable corresponding to each page element in the target page when rendering the target page.

[0024] In an optional implementation manner, the initial page source file further includes: an image file; and the method further includes:

[0025] identifying a target image file from the image files;

[0026] Converting the target image file into a font file based on text content contained in the target image file;

[0027] Changing the references to the target image file in the structure file and the style file to references to the font file; and

[0028] Based on the pre-set color card, a second target color variable corresponding to the font file is added to the target style data in the style file used to describe the style of the target image file; the second target color variable is used to indicate the color values ​​corresponding to the font file in at least one color mode.

[0029] In an optional implementation, the target image file includes: an icon file;

[0030] The identifying a target image file from the image files includes:

[0031] determining, from a file name in the image file, whether a target field exists for indicating that the image file is an icon file;

[0032] In response to the target field being present in the file, the image file is determined to be the target image file.

[0033] In an optional implementation manner, identifying the target image file from the image files includes:

[0034] Comparing the file data volume of the image file with a preset data volume threshold;

[0035] In response to the file data volume of the image file being less than or equal to the data volume threshold, the image file is determined as the target image file.

[0036] In an optional implementation, converting the target image file into a font file based on text content contained in the target image file includes:

[0037] Calling a preset image text recognition interface to obtain the text content contained in the target image file;

[0038] The font file is generated based on the text content.

[0039] In an optional implementation, changing the references to the target image file in the structure file and the style file to references to the font file includes:

[0040] generating an association relationship between the first identification information corresponding to the target image file and the second identification information corresponding to the font file;

[0041] Traversing source code included in the page source file, and identifying a second target statement for referencing the first identification information from the source code;

[0042] and, traversing the style data recorded in the style file, and identifying target style data recording the first identification information from the style data;

[0043] Based on the association relationship, the first identification information recorded in the second target sentence is replaced with the second identification information, and the first identification information in the target style data is replaced with the second identification information.

[0044] In an optional embodiment, the adding of a second target color variable corresponding to the font file to the target style data in the style file for describing the style of the target image file based on the preset color card includes:

[0045] Based on the target image file, determining a primary color value corresponding to the target image file;

[0046] Determining the second target color variable corresponding to the target image file based on the primary color value and the color card;

[0047] In the target pattern data, the second target color variable is added.

[0048] In a second aspect, an embodiment of the present disclosure provides a method for rendering a page, comprising:

[0049] In response to a rendering request for a target page in a target application, obtaining a page code file corresponding to the target page; wherein the page code file is generated using the page code file generation method described in the first aspect;

[0050] Obtaining configuration information of a color rendering mode for the target page;

[0051] The target page is rendered based on the configuration information and the page code file.

[0052] In an optional implementation manner, the page code file includes: initialization program code for initializing the color of each page element in the target page;

[0053] The rendering of the target page based on the configuration information and the page code file includes:

[0054] Passing the configuration information into the initialization program code and executing the initialization program code; when executing the initialization program code, determining a target color rendering mode corresponding to the configuration information based on the configuration information; and

[0055] Based on the page code file, read the color variables corresponding to each page element in the target page;

[0056] Determining the color value of each of the page elements based on the correspondence between the target color rendering mode and the color variable;

[0057] The target page is rendered based on the color values ​​of the various page elements.

[0058] In a third aspect, an embodiment of the present disclosure provides a device for generating a page code file, comprising:

[0059] A first acquisition module is used to acquire an initial page source file of a target page; the page source file includes: a structure file and a style file;

[0060] A second acquisition module is used to acquire an initial color value corresponding to a page element in the target page from the page source file;

[0061] a determination module, configured to determine a first target color variable corresponding to the page element based on the initial color value and a preset color card, wherein the color card is configured to describe a correspondence between color values ​​corresponding to at least one color variable in at least one color rendering mode;

[0062] a replacement module, configured to replace the initial color value included in the initial page source file with the first target color variable to obtain a target page source file;

[0063] A generating module, configured to generate a page code file of the target page based on the target page source file;

[0064] Among them, the first target color variable is used to pass the color value corresponding to the first target color variable in the pre-configured color rendering mode into the first target color variable when rendering the target page based on the page code file, and perform color rendering on the associated page elements based on the first target color variable with the passed color value.

[0065] In an optional implementation manner, the second acquisition module is specifically configured to:

[0066] Traversing the source code included in the page source file, and reading a first target statement for defining the page element from the source code;

[0067] The initial color value corresponding to the page element is read from the first target statement.

[0068] In an optional embodiment, the at least one color rendering mode includes: a base color rendering mode; different color variables correspond to different colors in the base color rendering mode;

[0069] The determining module is specifically configured to:

[0070] Based on the initial color value, determining a target color corresponding to the initial color value from a plurality of colors corresponding to the reference color rendering mode;

[0071] The color variable corresponding to the target color is determined as a first target color variable corresponding to the page element.

[0072] In an optional implementation manner, the generating module is specifically configured to:

[0073] Determine the file type of the target page source file;

[0074] Based on the file type, a syntax replacement operation is performed on the source code in the target page source file to obtain the page code file.

[0075] In an optional embodiment, the device further includes:

[0076] An injection module, configured to inject into the structure file an initialization program code for initializing the color of each page element in the target page when rendering the target page;

[0077] The initialization program code is used to assign a value to a first target color variable corresponding to each page element in the target page when rendering the target page.

[0078] In an optional implementation manner, the initial page source file further includes: an image file; and the device further includes:

[0079] an identification module, configured to identify a target image file from the image files;

[0080] a conversion module, configured to convert the target image file into a font file based on text content contained in the target image file;

[0081] a changing module, configured to change the references to the target image file in the structure file and the style file to references to the font file; and

[0082] An adding module is used to add a second target color variable corresponding to the font file in the target style data used to describe the style of the target image file in the style file based on the pre-set color card; the second target color variable is used to indicate the color value corresponding to the font file in at least one color mode.

[0083] In an optional implementation, the target image file includes: an icon file;

[0084] The identification module is specifically used for:

[0085] determining, from a file name in the image file, whether a target field exists for indicating that the image file is an icon file;

[0086] In response to the target field being present in the file, the image file is determined to be the target image file.

[0087] In an optional implementation, the identification module is further configured to:

[0088] Comparing the file data volume of the image file with a preset data volume threshold;

[0089] In response to the file data volume of the image file being less than or equal to the data volume threshold, the image file is determined as the target image file.

[0090] In an optional implementation, the identification module is further configured to:

[0091] Calling a preset image text recognition interface to obtain the text content contained in the target image file;

[0092] The font file is generated based on the text content.

[0093] In an optional implementation, the identification module is further configured to:

[0094] generating an association relationship between the first identification information corresponding to the target image file and the second identification information corresponding to the font file;

[0095] Traversing source code included in the page source file, and identifying a second target statement for referencing the first identification information from the source code;

[0096] and, traversing the style data recorded in the style file, and identifying target style data recording the first identification information from the style data;

[0097] Based on the association relationship, the first identification information recorded in the second target sentence is replaced with the second identification information, and the first identification information in the target style data is replaced with the second identification information.

[0098] In an optional implementation manner, the adding module is specifically configured to:

[0099] Based on the target image file, determining a primary color value corresponding to the target image file;

[0100] Determining the second target color variable corresponding to the target image file based on the primary color value and the color card;

[0101] In the target pattern data, the second target color variable is added.

[0102] In a fourth aspect, an embodiment of the present disclosure provides a page rendering device, comprising:

[0103] a fourth acquisition module, configured to, in response to a rendering request for a target page in a target application, acquire a page code file corresponding to the target page; wherein the page code file is generated using the page code file generation method described in the first aspect;

[0104] A fifth acquisition module, configured to acquire configuration information of a color rendering mode for the target page;

[0105] A rendering module is used to render the target page based on the configuration information and the page code file.

[0106] In an optional implementation manner, the page code file includes: initialization program code for initializing the color of each page element in the target page;

[0107] The rendering module is specifically used for:

[0108] Passing the configuration information into the initialization program code and executing the initialization program code; when executing the initialization program code, determining a target color rendering mode corresponding to the configuration information based on the configuration information; and

[0109] Based on the page code file, read the color variables corresponding to each page element in the target page;

[0110] Determining the color value of each of the page elements based on the correspondence between the target color rendering mode and the color variable;

[0111] The target page is rendered based on the color values ​​of the various page elements.

[0112] In a fifth aspect, an embodiment of the present disclosure further provides a computer device, comprising: a processor, a memory, and a bus, wherein the memory stores machine-readable instructions executable by the processor. When the computer device is running, the processor and the memory communicate through the bus, and when the machine-readable instructions are executed by the processor, the steps of the above-mentioned first aspect, or any possible implementation of the first aspect, or the steps of the above-mentioned second aspect, or any possible implementation of the second aspect are executed.

[0113] In a sixth aspect, an embodiment of the present disclosure further provides a computer-readable storage medium, on which a computer program is stored. When the computer program is executed by a processor, the processor executes the steps of the above-mentioned first aspect, or any possible implementation of the first aspect, or executes the above-mentioned second aspect, or any possible implementation of the second aspect.

[0114] The page code file generation method and device, and page rendering method and device provided by the embodiments of the present disclosure, when generating a page code file, obtain the initial color value corresponding to the page element in the target page based on the initial page source file of the target page, determine the first target color variable of the page element based on the initial color value and the preset color card, obtain the target page file by replacing the first target color variable, and render the page, thereby replacing the color value of each page element recorded in the page source file with the color variable; and the designer can conveniently set the color value in different color modes for different variables, so as to configure different color cards, and thus can use the color card to more easily inject the color value in different color modes into the page code file, thereby conveniently improving the efficiency of changing the color of each page element in the target page.

[0115] In addition, in the embodiment of the present disclosure, the target image file is replaced with a corresponding font file, and the color variable of the font file is added to the style file, thereby enabling corresponding adjustment of the color of the original image, such as an icon.

[0116] In order to make the above-mentioned objectives, features and advantages of the present disclosure more obvious and easy to understand, preferred embodiments are given below and described in detail with reference to the accompanying drawings. BRIEF DESCRIPTION OF THE DRAWINGS

[0117] In order to more clearly illustrate the technical solutions of the embodiments of the present disclosure, the following briefly introduces the drawings required for use in the embodiments. The drawings herein are incorporated into and constitute a part of the specification. These drawings illustrate embodiments consistent with the present disclosure and, together with the specification, are used to illustrate the technical solutions of the present disclosure. It should be understood that the following drawings only illustrate certain embodiments of the present disclosure and should not be regarded as limiting the scope. For those of ordinary skill in the art, other relevant drawings can be obtained based on these drawings without inventive effort.

[0118] Figure 1 A flow chart showing a method for generating a page code file provided by an embodiment of the present disclosure is shown;

[0119] Figure 2 A flowchart showing another method for generating a page code file provided by an embodiment of the present disclosure is shown;

[0120] Figure 3 A flow chart of a page rendering method provided by an embodiment of the present disclosure is shown;

[0121] Figure 4 One of the schematic diagrams of a device for generating a page code file provided by an embodiment of the present disclosure is shown;

[0122] Figure 5 A second schematic diagram of a device for generating a page code file provided by an embodiment of the present disclosure is shown;

[0123] Figure 6 A schematic diagram showing another apparatus for generating a page code file provided by an embodiment of the present disclosure is shown;

[0124] Figure 7 A schematic diagram of a page rendering device provided by an embodiment of the present disclosure is shown;

[0125] Figure 8 A schematic diagram of a computer device provided by an embodiment of the present disclosure is shown. DETAILED DESCRIPTION

[0126] In order to make the purpose, technical solutions and advantages of the embodiments of the present disclosure clearer, the technical solutions in the embodiments of the present disclosure will be clearly and completely described below in conjunction with the drawings in the embodiments of the present disclosure. Obviously, the described embodiments are only part of the embodiments of the present disclosure, not all of the embodiments. The components of the embodiments of the present disclosure generally described and shown in the drawings herein can be arranged and designed in various different configurations. Therefore, the following detailed description of the embodiments of the present disclosure provided in the drawings is not intended to limit the scope of the disclosure for which protection is sought, but merely represents selected embodiments of the present disclosure. Based on the embodiments of the present disclosure, all other embodiments obtained by those skilled in the art without making creative work are within the scope of protection of the present disclosure.

[0127] Research has found that with the development of technology, the use of smart terminals is becoming more and more common. Different users have different usage habits. For example, when reading e-books, some users prefer black text on a white background, some prefer white text on a black background, and some prefer different background colors and font colors at different times of day. In this case, the application needs to configure multiple background colors and font colors to provide users with different browsing experiences. As the front-end is the most direct part of the user experience, there are several ways to change the color mode:

[0128] 1. Night mode: Most of the methods use inverted colors, such as white to black, black to white, etc.; the problem is that it cannot well meet the demand for more diverse color modes (such as white to green, eye protection mode, etc.);

[0129] Second, manual implementation involves configuring multiple sets of color styles and adapting multiple color modes by overwriting the styles. The problem is that the maintenance cost is too high each time a new color is added or the original color is modified.

[0130] The above solution has the problem that it is difficult to set the color mode corresponding to the page elements for the target page; at the same time, the above solution can only solve the problem of changing the color of the text and background color, and cannot change or adjust the color of the icons on the page.

[0131] Based on the above research, the present disclosure provides a method for generating a page code file and a method for rendering a page. When generating a page code file, the initial color value corresponding to the page element in the target page is obtained based on the initial page source file of the target page. Based on the initial color value and the preset color card, the first target color variable of the page element is determined. By replacing the first target color variable, the target page file is obtained, and the page is rendered, so that the color value of each page element recorded in the page source file is replaced with the color variable; and the designer can conveniently set the color value in different color modes for different variables, so as to configure different color cards, so that the color values ​​in different color modes can be more easily injected into the page code file by using the color card, thereby conveniently improving the efficiency of changing the color of each page element in the target page.

[0132] In addition, in the embodiment of the present disclosure, the target image file is replaced with a corresponding font file, and the color variable of the font file is added to the style file, thereby enabling corresponding adjustment of the color of the original image, such as an icon.

[0133] The defects in the above solutions are the results obtained by the inventors after practice and careful research. Therefore, the process of discovering the above problems and the solutions proposed by this disclosure for the above problems below should be the contributions made by the inventors to this disclosure during the disclosure process.

[0134] It should be noted that similar reference numerals and letters denote similar items in the following drawings, and therefore, once an item is defined in one drawing, it does not need to be further defined or explained in subsequent drawings.

[0135] To facilitate understanding of this embodiment, a method for generating a page code file and a method for rendering a page disclosed in an embodiment of the present disclosure are first introduced in detail. The execution subject of the method for generating a page code file and the method for rendering a page provided in the embodiment of the present disclosure is generally a computer device with a certain computing capability, and the computer device includes, for example: a terminal device or a server or other processing device. The terminal device can be a user equipment (UE), a mobile device, a user terminal, a terminal, a cellular phone, a cordless phone, a personal digital assistant (PDA) device, a handheld device, a computing device, a vehicle-mounted device, a wearable device, etc. In some possible implementations, the method for generating a page code file and the method for rendering a page can be implemented by a processor calling computer-readable instructions stored in a memory.

[0136] The following describes the method for generating a page code file and the method for rendering a page provided by the embodiment of the present disclosure by taking a terminal device as an example in which the execution subject is an example.

[0137] See also Figure 1 FIG. 1 is a flow chart of a method for generating a page code file provided by an embodiment of the present disclosure, the method comprising steps S101 to S105, wherein:

[0138] S101: Acquire the initial page source file of the target page; the page source file includes: a structure file and a style file.

[0139] The initial page source file refers to the source file configured for the initial state of the target page. For a project, it includes multiple target pages and multiple initial page source codes. Each target page consists of multiple structure files and multiple style files.

[0140] In an embodiment of the present disclosure, the structure file is a file written in a high-level language for programming pages; it includes code for describing the page content, page structure, page execution logic, and a description file reference to the page style indicating the target page.

[0141] Exemplarily, the page content of the target page indicates the target content to be displayed on the target page, for example, the text, image, icon, background color, etc. to be displayed on the target page; the page structure refers to the arrangement of each page content, such as the placement of text and image, text font size information, image size information, etc.; the page execution logic includes how to open the target page or how to jump to the target page, etc.; the reference to the page style includes reference information of the target page to any page style example or template for multiple page style examples or templates, etc.

[0142] In the disclosed embodiments, the style file refers to a description file used to describe the page style. The style file includes the colors of various page elements on the target page, such as text color, style background color, button background color, etc. Page elements include icons, text, images, links, etc.

[0143] In the embodiment of the present disclosure, there are two situations in which the initial page source file of the target page can be obtained:

[0144] Case 1: Obtaining the target page's initial source file can be performed during the initial compilation process. In this case, a color palette (color library) and initialization adaptation method (i.e., initialization program code) are generally pre-set, where different color palettes correspond to different color modes. The color palette is used to describe the corresponding relationship between the colors corresponding to at least one color variable in at least one color rendering mode.

[0145] In a possible implementation, the method for generating a page code file proposed in the embodiment of the present disclosure further includes:

[0146] An initialization program code is injected into the structure file for initializing the color of each page element in the target page when rendering the target page; the initialization program code is used to assign a first target color variable corresponding to each page element in the target page when rendering the target page.

[0147] In one possible implementation, since the color mode selected by the user can only be known when the application is running and cannot be obtained at compile time, it is necessary to preset all the base colors in advance, and after obtaining the color mode selected by the user at runtime, adapt the base color corresponding to the color mode, and match other colors based on the base color. In the embodiment of the present disclosure, a color card and an initialization adaptation method (initialization program code) can be injected into the initial page source file of the target page, wherein, when rendering the target page, the initialization program code can be used to assign the first target color variable corresponding to each page element in the target page, and then determine the color value corresponding to each first target color variable, and in the subsequent calling process of the first target color, the corresponding first target color can be called based on the color value numerical value.

[0148] A color swatch is a configuration file, such as "title: {'black background': 'white', 'white background': 'black'}." New colors can be dynamically expanded using color swatches and base colors. The color swatch tool provides a full list of color swatches and initialization methods for each color swatch. The initialization method obtains the current base color of the target page and dynamically selects the color for all standard areas (title, description, short link, etc.) that share the same base color.

[0149] Illustratively, the color card corresponding to the base color is used as a reference for determining variables. Colors included in other color cards may include the same color as the base color, but the color card corresponding to the base color is not used to determine color variables.

[0150] In a possible implementation, a color card injection tool is further included, which is a development tool for automatically injecting color card tools, and automatically obtaining and replacing colors in the page source file.

[0151] In a possible implementation, the user's color cards can be maintained, and the color cards can be added, deleted, modified, and checked, and the authority control of the color card role can be performed to provide maintenance for the user.

[0152] Exemplarily, the programming logic of the initialization program code includes matching other colors corresponding to the color mode after the initialization method is called according to the color mode selected by the user to obtain all colors.

[0153] Exemplarily, the above process for the user, or from the user's perspective, is as follows: Steps 1 to 13:

[0154] Step 1: Open the application (Application, APP), select the color mode for the target page (Default / Night / Eye Protection / Custom, etc.);

[0155] Step 1 and 2: Open the target page;

[0156] Step 13: The target page automatically matches all colors that match the selected color mode.

[0157] In the embodiment of the present disclosure, based on the user's selection of a color or color mode and the initialization calling process, all colors that match the user's selection can be obtained for later calling.

[0158] Case 2: Obtaining the initial page source file of the target page can be used when the color mode changes or the user's choice of color mode changes. Since the color mode has changed or been updated, the initial page source file needs to be recompiled to obtain all the updated colors.

[0159] For example, case 2 refers to when the user changes the color or color mode selection, the color after the initialization call will also change accordingly. Case 2 is similar to case 1 in application process and can achieve the same application effect, so it will not be repeated here.

[0160] Following S101 above, the method for generating a page code file proposed in the embodiment of the present disclosure further includes:

[0161] S102: Acquire, from the page source file, initial color values ​​corresponding to page elements in the target page.

[0162] In an embodiment of the present disclosure, in response to obtaining a page source file, the configured initial color values ​​corresponding to the page elements are extracted from the page source file.

[0163] In a possible implementation, the initial color value corresponding to the page element in the target page may be obtained from the page source file through the following steps S1021-S1022:

[0164] Step S1021: traversing the source code included in the page source file, and reading the first target statement for defining the page element from the source code;

[0165] Step S1022: Read the initial color value corresponding to the page element from the first target statement.

[0166] In the above step S1021, the first target statement refers to a statement in the page source file used to describe the initial color value. The initial color value or the color value information of the initial color can be read from the first target statement in the page source file.

[0167] In the above step S1022 , in response to determining the first target sentence, the initial color value corresponding to the page element can be obtained from the first target sentence.

[0168] For example, colors are generally identified using the format of #FFF, #FFFFFF, rgba (0, 0, 0, 0.5). By determining the target format in the page source file, the first target statement can be determined, and the initial color value or the color value information of the initial color can be read.

[0169] Following S102 above, the method for generating a page code file proposed in the embodiment of the present disclosure further includes:

[0170] S103: Determine a first target color variable corresponding to the page element based on the initial color value and a preset color card, wherein the color card is used to describe the correspondence between color values ​​corresponding to at least one color variable in at least one color rendering mode.

[0171] In this disclosed embodiment, since the user's selected color mode is only known during application runtime and cannot be obtained at compile time, it is necessary to pre-set all base colors. After obtaining the user's selected color mode at runtime, the base color corresponding to that color mode is adapted and used as the standard for matching other colors. Therefore, in this embodiment, the first target color variable refers to the determined base color variable.

[0172] In a possible implementation, the at least one color rendering mode includes: a base color rendering mode; different color variables correspond to different colors in the base color rendering mode.

[0173] Under the above conditions, the first target color variable corresponding to the page element can be determined based on the initial color value and the preset color card through the following steps S1031-S1032:

[0174] S1031: Based on the initial color value, determine a target color corresponding to the initial color value from a plurality of colors corresponding to the reference color rendering mode;

[0175] S1032: Determine the color variable corresponding to the target color as the first target color variable corresponding to the page element.

[0176] In step S1031, the target color may be the same color as the color indicated by the initial color value, or the color closest to the color or color value indicated by the initial color value. After determining the initial color value, the target color can be selected from a plurality of reference colors corresponding to the reference color rendering mode. In step S1032, the color variable corresponding to the target color is determined, and the color variable is determined as the first target color variable corresponding to the page element.

[0177] For example, colors are generally identified using the format of #FFF, #FFFFFF, rgba (0, 0, 0, 0.5). Regular expressions can be used to extract colors, and combined with the colors and the corresponding reference colors, the extracted colors can be reversed to obtain the first target color variable. Here, the syntax of different files is different and is not limited here.

[0178] Following S103 above, the method for generating a page code file proposed in the embodiment of the present disclosure further includes:

[0179] S104: Replace the initial color value included in the initial page source file with the first target color variable to obtain a target page source file.

[0180] Among them, the first target color variable is used to pass the color value corresponding to the first target color variable in the pre-configured color rendering mode into the first target color variable when rendering the target page based on the page code file, and perform color rendering on the associated page elements based on the first target color variable with the passed color value.

[0181] In the embodiment of the present disclosure, after determining the first target color variable, the initial color value included in the initial page source file is replaced with the first target color variable to obtain the target page source file, thereby realizing the dynamic color adaptation process.

[0182] In a possible implementation, the page code file of the target page may be generated based on the target page source file through the following steps S1041-S1042:

[0183] Determine the file type of the target page source file;

[0184] Based on the file type, a syntax replacement operation is performed on the source code in the target page source file to obtain the page code file.

[0185] In the embodiment of the present disclosure, since different file types correspond to different syntaxes, it is necessary to first determine the file type corresponding to the target page source file, thereby determining the syntax for the target page source file, and based on the syntax, complete the syntax replacement operation on the source code in the target page source file to obtain the page code file.

[0186] For example, colors are generally identified using the formats of #FFF, #FFFFFF, and rgba(0,0,0,0.5). Regular expressions are used to intercept colors, and the identified colors are replaced with corresponding variables. For example, #FFF, #FFFFFF, and rgba(0,0,0,1) are all the same pure white color. The three colors with different writing styles are identified and replaced with the variable name $WHITECOLOR. In the white system, $WHITECOLOR represents white #FFF, and in the black system, $WHITECOLOR represents black #000, etc. Dynamic color adaptation can be achieved by replacing the variable values.

[0187] Following S104 above, the method for generating a page code file proposed in the embodiment of the present disclosure further includes:

[0188] S105: Generate a page code file of the target page based on the target page source file.

[0189] The page code file types include, for example, Javascript (JS), Hypertext Markup Language (HTML), Cascading Style Sheets (CSS), and the like.

[0190] In the embodiment of the present disclosure, based on the target page source file obtained by replacement, a page code file of the target page is generated to complete the dynamic adaptation process of the target page color.

[0191] See also Figure 2 FIG. 1 is a flowchart of another method for generating a page code file provided by an embodiment of the present disclosure. In this embodiment, the initial page source file further includes: an image file; based on the above conditions, the method includes steps S201 to S203, wherein:

[0192] S201: Identify a target image file from the image files.

[0193] The image files include images of various image formats and sizes. The target image files refer to icon files and partial image files.

[0194] In the embodiment of the present disclosure, the structure file involved in step S101 is also used to describe a reference to the image file.

[0195] In a possible implementation, the target image file includes an icon file. Accordingly, the target image file can be identified from the image file through the following steps S2011-S2012:

[0196] S2011: Determine from the file name of the image file whether there is a target field for indicating that the image file is an icon file;

[0197] S2012: In response to the presence of the target field in the file, determine the image file as the target image file.

[0198] In the above steps S2011-S2012, a file with an icon file target field may be selected from the file name of the image file, and the selected file may be determined as the target image file.

[0199] Exemplarily, the icon file name suffix includes: .icon, or .ico, etc. The target image file may include files in all icon file formats. In response to finding the target field such as .icon or .ico in the image file, the image file corresponding to the target field is determined to be the target image file.

[0200] In a possible implementation, the target image file may be identified from the image file through the following steps S2013-S2014:

[0201] S2013: Compare the file data volume of the image file with a preset data volume threshold;

[0202] S2014: In response to the file data volume of the image file being less than or equal to the data volume threshold, determining the image file as the target image file.

[0203] In the above steps S2011-S2012, a file with an icon file target field can be selected from the image file name, and the file whose file data volume is less than or equal to the data volume threshold is analyzed and determined, and the file is selected as the target image file.

[0204] For example, the image file format may include the JPEG format (Joint Photographic Experts Group), the Portable Network Graphic Format (PNG), and the like. The target image file may include an image file format whose file data size is less than a preset file data size threshold. For example, a file whose data size is less than 32KB is determined to be the target image file. In response to finding a target field such as .jpg or .png in the image file, and the file data size of the file is less than the preset file data size threshold, the image file corresponding to the target field may be determined to be the target image file.

[0205] In the embodiment of the present disclosure, by processing an image with a data volume that meets the requirements, the coverage range of changing the icon color can be processed on a larger scale, and the icon image can also be included in the scope of color processing and processed.

[0206] Following S201 above, the method for generating a page code file proposed in the embodiment of the present disclosure further includes:

[0207] S202: Convert the target image file into a font file based on the text content contained in the target image file.

[0208] In the embodiment of the present disclosure, in order to facilitate processing of the target image file, it can be first converted into a font file, and then the font file is processed using the method proposed in the above embodiment to obtain the target image file with changed color.

[0209] In a possible implementation, the target image file may be converted into a font file based on the text content contained in the target image file through the following steps S2021-S2022:

[0210] S2021: calling a preset image text recognition interface to obtain text content contained in the target image file;

[0211] S2022: Generate the font file based on the text content.

[0212] In the above steps S2021-S2022, in response to determining the target image file, the image text recognition interface can be used to extract the text content contained in the target image file and generate a font file.

[0213] Exemplarily, after the target image file is identified, the identified target image file is uploaded to the icon management platform (iconfont), and after uploading, the font file and font mark corresponding to the target image file are obtained; the icon management platform is used to store online icon files and perform operations such as identifying icon files. Users can upload icon files to the platform or download icon files from the platform, and perform operations such as identifying icon files through the platform.

[0214] Following S202 above, the method for generating a page code file proposed in the embodiment of the present disclosure further includes:

[0215] S203: Changing the references to the target image file in the structure file and the style file to references to the font file.

[0216] In a possible implementation, the references to the target image file in the structure file and the style file may be changed to references to the font file through the following steps S2027-S2029:

[0217] S2027: Generate an association relationship between the first identification information corresponding to the target image file and the second identification information corresponding to the font file;

[0218] S2028: traversing the source code included in the page source file, identifying a second target statement for referencing the first identification information from the source code; and traversing the style data recorded in the style file, identifying target style data recording the first identification information from the style data;

[0219] S2029: Based on the association relationship, replace the first identification information recorded in the second target sentence with the second identification information, and replace the first identification information in the target style data with the second identification information.

[0220] In the above steps S2027-S2029, based on the first identification information corresponding to the target image file and the second identification information corresponding to the font file, the association relationship between the two is determined, and the second target statement referencing the first identification information is determined from the source code of the page source file. Finally, according to the determined association relationship, the first identification information recorded in the second target statement is replaced with the second identification information.

[0221] For example, the corresponding icon font file may be imported, the reference address of the target image file may be modified to the reference address of the corresponding font file, and the color of the font file may be set, thereby achieving dynamic adaptation of the color of the image font file.

[0222] In one possible implementation, an icon replacement tool may be provided as a development tool that can automatically identify icons, upload them to an icon management platform or icon font file, and perform replacement operations.

[0223] Following S203 above, the method for generating a page code file proposed in the embodiment of the present disclosure further includes:

[0224] S204: Based on the pre-set color card, a second target color variable corresponding to the font file is added to the target style data in the style file used to describe the style of the target image file; the second target color variable is used to indicate the color values ​​corresponding to the font file in at least one color mode.

[0225] In an embodiment of the present disclosure, a color variable of a font file may be added to a style file to generate a page code file for rendering a target page.

[0226] In a possible implementation, the second target color variable corresponding to the font file may be added to the target style data in the style file for describing the style of the target image file based on the preset color card through the following steps S2041-S2042:

[0227] S2041: Based on the target image file, determine a primary color value corresponding to the target image file;

[0228] S2042: Determine the second target color variable corresponding to the target image file based on the primary color value and the color card;

[0229] S2043: Add the second target color variable to the target style data.

[0230] In the above steps S2041-S2042, after the target image file is determined, the main color corresponding to the target image file, that is, the base color, can be determined, and based on the main color and the pre-configured color card, other colors, that is, the second target color variable, can be determined. The second target color variable is added to the style file, and a new page code file is generated to complete the dynamic adaptation process of the target image file color.

[0231] See also Figure 3 FIG. 1 is a flow chart of a page rendering method provided by an embodiment of the present disclosure; the method includes steps S301 to S303, wherein:

[0232] S301: In response to a rendering request for a target page in a target application, obtaining a page code file corresponding to the target page; wherein the page code file is generated using a page code file generation method;

[0233] S302: Acquire configuration information of the color rendering mode of the target page;

[0234] S303: Rendering the target page based on the configuration information and the page code file.

[0235] In steps S301 to S303, after the target page in the target application is initialized or in response to a user adjusting the color mode of the target page, a rendering request is sent to the target page in the target application. In response to the rendering request, a page code file is obtained. The page code file is generated based on the page code file generation method proposed in the above embodiment. The page code file is analyzed to obtain the configuration information of the color rendering mode of the target page, and the target page is rendered.

[0236] The configuration information of the color rendering mode of the target page can be read from a server or locally from the user. For example, if the user has login information, the configuration information can be read from the server corresponding to the login information. If the user has not added login information on the network, the configuration information is obtained locally.

[0237] In a possible implementation, the page code file includes initialization program code for initializing the color of each page element in the target page.

[0238] Based on the above conditions, the embodiment of the present disclosure may further render the target page based on the configuration information and the page code file through the following steps S3031-S3034:

[0239] S3031: passing the configuration information into the initialization program code, and executing the initialization program code; when executing the initialization program code, determining a target color rendering mode corresponding to the configuration information based on the configuration information; and

[0240] S3032: Reading color variables corresponding to each page element in the target page based on the page code file;

[0241] S3033: Determine the color value of each of the page elements based on the correspondence between the target color rendering mode and the color variable;

[0242] S3034: Rendering the target page based on the color value of each page element.

[0243] In steps S3031-S3034, the initialization code logic includes matching the user-selected color mode with the other colors corresponding to that color mode after the initialization method is called, thereby obtaining all colors. Therefore, the target color rendering mode can be determined based on the initialization code and configuration information. After determining the target color rendering mode and the color variables corresponding to each page element in the target page, the color values ​​corresponding to each page element are determined, and the target page is rendered based on these values.

[0244] When generating a page code file, the embodiment of the present disclosure obtains the initial color value corresponding to the page element in the target page based on the initial page source file of the target page, determines the first target color variable of the page element based on the initial color value and the preset color card, obtains the target page file by replacing the first target color variable, and renders the page, thereby replacing the color value of each page element recorded in the page source file with the color variable; and the designer can conveniently set the color value under different color modes for different variables, so as to configure different color cards, and thus can use the color card to more easily inject the color value under different color modes into the page code file, thereby conveniently improving the efficiency of changing the color of each page element in the target page.

[0245] Those skilled in the art will understand that in the above-mentioned method of the specific implementation method, the writing order of each step does not mean a strict execution order and does not constitute any limitation on the implementation process. The specific execution order of each step should be determined by its function and possible internal logic.

[0246] Based on the same inventive concept, the embodiments of the present disclosure also provide a device for generating a page code file corresponding to the method for generating a page code file, and a device for rendering a page corresponding to the method for rendering a page. Since the principle of solving the problem by the device in the embodiments of the present disclosure is similar to the above-mentioned method for generating a page code file and the method for rendering a page in the embodiments of the present disclosure, the implementation of the device can refer to the implementation of the method, and the repeated parts will not be repeated.

[0247] Reference Figure 4 FIG. 1 is a schematic diagram of a device for generating a page code file according to an embodiment of the present disclosure, wherein the device includes: a first acquisition module 410, a second acquisition module 420, a determination module 430, a replacement module 440, and a generation module 450; wherein,

[0248] The first acquisition module 410 is used to acquire the initial page source file of the target page; the page source file includes: a structure file and a style file;

[0249] The second acquisition module 420 is configured to acquire, from the page source file, an initial color value corresponding to a page element in the target page;

[0250] Determination module 430, configured to determine a first target color variable corresponding to the page element based on the initial color value and a preset color card, wherein the color card is configured to describe a correspondence between color values ​​corresponding to at least one color variable in at least one color rendering mode;

[0251] a replacement module 440, configured to replace the initial color value included in the initial page source file with the first target color variable to obtain a target page source file;

[0252] A generating module 450 is configured to generate a page code file of the target page based on the target page source file;

[0253] Among them, the first target color variable is used to pass the color value corresponding to the first target color variable in the pre-configured color rendering mode into the first target color variable when rendering the target page based on the page code file, and perform color rendering on the associated page elements based on the first target color variable with the passed color value.

[0254] In an optional implementation manner, the second acquisition module 420 is specifically configured to:

[0255] Traversing the source code included in the page source file, and reading a first target statement for defining the page element from the source code;

[0256] The initial color value corresponding to the page element is read from the first target statement.

[0257] In an optional embodiment, the at least one color rendering mode includes: a base color rendering mode; different color variables correspond to different colors in the base color rendering mode;

[0258] The determining module 430 is specifically configured to:

[0259] Based on the initial color value, determining a target color corresponding to the initial color value from a plurality of colors corresponding to the reference color rendering mode;

[0260] The color variable corresponding to the target color is determined as a first target color variable corresponding to the page element.

[0261] In an optional implementation manner, the generating module 450 is specifically configured to:

[0262] Determine the file type of the target page source file;

[0263] Based on the file type, a syntax replacement operation is performed on the source code in the target page source file to obtain the page code file.

[0264] In an optional embodiment, referring to Figure 5 FIG. 2 is a second schematic diagram of another apparatus for generating a page code file provided by an embodiment of the present disclosure; the apparatus further includes:

[0265] An injection module 460 is configured to inject into the structure file an initialization program code for initializing the color of each page element in the target page when rendering the target page;

[0266] The initialization program code is used to assign a value to a first target color variable corresponding to each page element in the target page when rendering the target page.

[0267] In an optional embodiment, referring to Figure 6 As shown, it is a schematic diagram of another device for generating a page code file provided by an embodiment of the present disclosure; the initial page source file also includes: an image file; the device also includes: an identification module 610, a conversion module 620, a modification module 630, and an addition module 640; wherein,

[0268] An identification module 610 is configured to identify a target image file from the image files;

[0269] A conversion module 620, configured to convert the target image file into a font file based on text content contained in the target image file;

[0270] A changing module 630 is configured to change the references to the target image file in the structure file and the style file to references to the font file; and

[0271] Adding module 640 is used to add a second target color variable corresponding to the font file in the target style data used to describe the style of the target image file in the style file based on the pre-set color card; the second target color variable is used to indicate the color value corresponding to the font file in at least one color mode.

[0272] In an optional implementation, the target image file includes: an icon file;

[0273] The identification module 610 is specifically configured to:

[0274] determining, from a file name in the image file, whether a target field exists for indicating that the image file is an icon file;

[0275] In response to the target field being present in the file, the image file is determined to be the target image file.

[0276] In an optional implementation, the identification module 610 is further configured to:

[0277] Comparing the file data volume of the image file with a preset data volume threshold;

[0278] In response to the file data volume of the image file being less than or equal to the data volume threshold, the image file is determined as the target image file.

[0279] In an optional implementation, the identification module 620 is further configured to:

[0280] Calling a preset image text recognition interface to obtain the text content contained in the target image file;

[0281] The font file is generated based on the text content.

[0282] In an optional implementation, the identification module 610 is further configured to:

[0283] generating an association relationship between the first identification information corresponding to the target image file and the second identification information corresponding to the font file;

[0284] Traversing source code included in the page source file, and identifying a second target statement for referencing the first identification information from the source code;

[0285] and, traversing the style data recorded in the style file, and identifying target style data recording the first identification information from the style data;

[0286] Based on the association relationship, the first identification information recorded in the second target sentence is replaced with the second identification information, and the first identification information in the target style data is replaced with the second identification information.

[0287] In an optional implementation, the adding module 640 is specifically configured to:

[0288] Based on the target image file, determining a primary color value corresponding to the target image file;

[0289] Determining the second target color variable corresponding to the target image file based on the primary color value and the color card;

[0290] In the target pattern data, the second target color variable is added.

[0291] Reference Figure 7 FIG. 1 is a schematic diagram of a page rendering device provided by an embodiment of the present disclosure, wherein the device includes: a fourth acquisition module 710, a fifth acquisition module 720, and a rendering module 730; wherein,

[0292] A fourth acquisition module 710 is configured to, in response to a rendering request for a target page in a target application, acquire a page code file corresponding to the target page; wherein the page code file is generated using the page code file generation method described in the first aspect;

[0293] A fifth acquisition module 720 is configured to acquire configuration information of a color rendering mode for the target page;

[0294] The rendering module 730 is configured to render the target page based on the configuration information and the page code file.

[0295] In an optional implementation manner, the page code file includes: initialization program code for initializing the color of each page element in the target page;

[0296] The rendering module 730 is specifically used for:

[0297] Passing the configuration information into the initialization program code and executing the initialization program code; when executing the initialization program code, determining a target color rendering mode corresponding to the configuration information based on the configuration information; and

[0298] Based on the page code file, read the color variables corresponding to each page element in the target page;

[0299] Determining the color value of each of the page elements based on the correspondence between the target color rendering mode and the color variable;

[0300] The target page is rendered based on the color values ​​of the various page elements.

[0301] When generating a page code file, the embodiment of the present disclosure obtains the initial color value corresponding to the page element in the target page based on the initial page source file of the target page, determines the first target color variable of the page element based on the initial color value and the preset color card, obtains the target page file by replacing the first target color variable, and renders the page, thereby replacing the color value of each page element recorded in the page source file with the color variable; and the designer can conveniently set the color value under different color modes for different variables, so as to configure different color cards, and thus can use the color card to more easily inject the color value under different color modes into the page code file, thereby conveniently improving the efficiency of changing the color of each page element in the target page.

[0302] For descriptions of the processing flow of each module in the device and the interaction flow between each module, reference can be made to the relevant descriptions in the above method embodiment, which will not be described in detail here.

[0303] Based on the same technical concept, the embodiment of the present disclosure also provides a computer device. Figure 8 802, and a bus 803. The computer device provided in an embodiment of the present disclosure is shown in FIG. 802, which includes a processor 801, a memory 802, and a bus 803. The memory 802 is used to store execution instructions and includes a memory 8021 and an external memory 8022. The memory 8021 is also referred to as internal memory and is used to temporarily store computational data in the processor 801 and data exchanged with an external memory 8022, such as a hard disk. The processor 801 exchanges data with the external memory 8022 via the memory 8021. When the computer device is running, the processor 801 communicates with the memory 802 via the bus 803, so that the processor 801 executes the following instructions:

[0304] Obtaining the initial page source file of the target page; the page source file includes: a structure file and a style file;

[0305] Obtaining, from the page source file, an initial color value corresponding to a page element in the target page;

[0306] Determining a first target color variable corresponding to the page element based on the initial color value and a preset color card, wherein the color card is used to describe the corresponding relationship between color values ​​corresponding to at least one color variable in at least one color rendering mode;

[0307] Replacing the initial color value included in the initial page source file with the first target color variable to obtain a target page source file;

[0308] Based on the target page source file, a page code file of the target page is generated.

[0309] When the computer device is running, the processor 801 communicates with the memory 802 via the bus 803, and the processor 801 executes the following instructions:

[0310] In response to a rendering request for a target page in a target application, obtaining a page code file corresponding to the target page; wherein the page code file is generated using the above-mentioned page code file generation method;

[0311] Obtaining configuration information of a color rendering mode for the target page;

[0312] The target page is rendered based on the configuration information and the page code file.

[0313] The present disclosure also provides a computer-readable storage medium having a computer program stored thereon. When the computer program is executed by a processor, the computer program executes the steps of the method for generating a page code file described in the above method embodiment. When the computer program is executed by a processor, the computer program also executes the steps of the method for generating a page code file described in the above method embodiment. The storage medium may be a volatile or non-volatile computer-readable storage medium.

[0314] The computer program product of the page code file generation method and the page rendering method provided in the embodiments of the present disclosure includes a computer-readable storage medium storing program code, and the instructions included in the program code can be used to execute the steps of the page code file generation method described in the above method embodiment, and the instructions included in the program code can also be used to execute the steps of the page rendering method described in the above method embodiment. For details, please refer to the above method embodiment and will not be repeated here.

[0315] The present disclosure also provides a computer program that, when executed by a processor, implements any of the methods of the aforementioned embodiments. The computer program product can be implemented in hardware, software, or a combination thereof. In one optional embodiment, the computer program product is embodied as a computer storage medium. In another optional embodiment, the computer program product is embodied as a software product, such as a software development kit (SDK).

[0316] Those skilled in the art can clearly understand that, for the convenience and brevity of description, the specific working processes of the systems and devices described above can refer to the corresponding processes in the aforementioned method embodiments, and will not be repeated here. In the several embodiments provided in the present disclosure, it should be understood that the disclosed systems, devices and methods can be implemented in other ways. The device embodiments described above are merely schematic. For example, the division of the units is only a logical function division. There may be other division methods in actual implementation. For example, multiple units or components can be combined or integrated into another system, or some features can be ignored or not executed. Another point is that the mutual coupling or direct coupling or communication connection shown or discussed can be through some communication interfaces, indirect coupling or communication connection of devices or units, which can be electrical, mechanical or other forms.

[0317] The units described as separate components may or may not be physically separate, and the components shown as units may or may not be physical units, that is, they may be located in one place or distributed across multiple network units. Some or all of these units may be selected to achieve the purpose of this embodiment according to actual needs.

[0318] In addition, each functional unit in each embodiment of the present disclosure may be integrated into one processing unit, or each unit may exist physically separately, or two or more units may be integrated into one unit.

[0319] If the functions are implemented in the form of software functional units and sold or used as independent products, they can be stored in a non-volatile computer-readable storage medium that is executable by a processor. Based on this understanding, the technical solution of the present disclosure, or the part that contributes to the prior art or the part of the technical solution, can be embodied in the form of a software product, which is stored in a storage medium and includes several instructions for enabling a computer device (which can be a personal computer, a server, or a network device, etc.) to execute all or part of the steps of the method described in each embodiment of the present disclosure. The aforementioned storage medium includes: various media that can store program codes, such as a USB flash drive, a mobile hard disk, a read-only memory (ROM), a random access memory (RAM), a magnetic disk or an optical disk.

[0320] Finally, it should be noted that the above-described embodiments are only specific implementation methods of the present disclosure, which are used to illustrate the technical solutions of the present disclosure, rather than to limit them. The scope of protection of the present disclosure is not limited thereto. Although the present disclosure has been described in detail with reference to the above-described embodiments, those skilled in the art should understand that any person skilled in the art can modify or easily conceive of changes to the technical solutions described in the above-described embodiments within the technical scope disclosed in the present disclosure, or replace some of the technical features therein with equivalents. Such modifications, changes, or replacements do not deviate from the spirit and scope of the technical solutions of the embodiments of the present disclosure, and should be included in the scope of protection of the present disclosure. Therefore, the scope of protection of the present disclosure shall be subject to the scope of protection of the claims.

Claims

1. A method for generating a page code file, characterized in that: include: Get the initial page source file of the target page; The page source files include: structure files and style files; Obtaining, from the page source file, an initial color value corresponding to a page element in the target page; Determining a first target color variable corresponding to the page element based on the initial color value and a preset color card; wherein the color card is used to describe the corresponding relationship between color values ​​corresponding to at least one color variable in at least one color rendering mode, and the first target color variable is the determined reference color variable; the color card and the first target color variable are used to dynamically expand other new colors that are compatible with the color mode; Replacing the initial color value included in the initial page source file with the first target color variable to obtain a target page source file; Generate a page code file of the target page based on the target page source file; Among them, the first target color variable is used to pass the color value corresponding to the first target color variable in the pre-configured color rendering mode into the first target color variable when rendering the target page based on the page code file, and perform color rendering on the associated page elements based on the first target color variable with the passed color value.

2. The method according to claim 1, characterized in that The step of obtaining, from the page source file, an initial color value corresponding to a page element in the target page includes: Traversing the source code included in the page source file, and reading a first target statement for defining the page element from the source code; The initial color value corresponding to the page element is read from the first target statement.

3. The method according to claim 1, characterized in that The at least one color rendering mode includes: a base color rendering mode; different color variables correspond to different colors in the base color rendering mode; The determining, based on the initial color value and a preset color card, a first target color variable corresponding to the page element includes: Based on the initial color value, determining a target color corresponding to the initial color value from a plurality of colors corresponding to the reference color rendering mode; The color variable corresponding to the target color is determined as a first target color variable corresponding to the page element.

4. The method according to claim 1, wherein The step of generating a page code file of the target page based on the target page source file includes: Determine the file type of the target page source file; Based on the file type, a syntax replacement operation is performed on the source code in the target page source file to obtain the page code file.

5. The method according to claim 1, wherein The method further includes: injecting into the structure file an initialization program code for initializing the color of each page element in the target page when rendering the target page; The initialization program code is used to assign a value to a first target color variable corresponding to each page element in the target page when rendering the target page.

6. The method according to any one of claims 1 to 5, characterized in that The initial page source file further includes: an image file; the method further includes: identifying a target image file from the image files; Converting the target image file into a font file based on text content contained in the target image file; Changing the references to the target image file in the structure file and the style file to references to the font file; and Based on the pre-set color card, a second target color variable corresponding to the font file is added to the target style data in the style file used to describe the style of the target image file; the second target color variable is used to indicate the color values ​​corresponding to the font file in at least one color mode.

7. The method according to claim 6, characterized in that The target image file includes: an icon file; The identifying a target image file from the image files includes: determining, from a file name in the image file, whether a target field exists for indicating that the image file is an icon file; In response to the target field being present in the file, the image file is determined to be the target image file.

8. The method according to claim 6, characterized in that The identifying a target image file from the image files includes: Comparing the file data volume of the image file with a preset data volume threshold; In response to the file data volume of the image file being less than or equal to the data volume threshold, the image file is determined as the target image file.

9. The method according to claim 6, characterized in that The step of converting the target image file into a font file based on text content contained in the target image file includes: Calling a preset image text recognition interface to obtain the text content contained in the target image file; The font file is generated based on the text content.

10. The method according to claim 6, characterized in that The step of changing the references to the target image file in the structure file and the style file to references to the font file includes: generating an association relationship between the first identification information corresponding to the target image file and the second identification information corresponding to the font file; Traversing source code included in the page source file, and identifying a second target statement for referencing the first identification information from the source code; and, traversing the style data recorded in the style file, and identifying target style data recording the first identification information from the style data; Based on the association relationship, the first identification information recorded in the second target sentence is replaced with the second identification information. Based on the association relationship, the first identification information recorded in the second target sentence is replaced with the second identification information, and the first identification information in the target style data is replaced with the second identification information.

11. The method according to claim 6, characterized in that The adding, based on the preset color card, a second target color variable corresponding to the font file to the target style data in the style file for describing the style of the target image file comprises: Based on the target image file, determining a primary color value corresponding to the target image file; Determining the second target color variable corresponding to the target image file based on the primary color value and the color card; In the target pattern data, the second target color variable is added.

12. A page rendering method, characterized in that: include: In response to a rendering request for a target page in a target application, obtaining a page code file corresponding to the target page; wherein the page code file is generated using the page code file generation method according to any one of claims 1 to 11; Obtaining configuration information of a color rendering mode for the target page; The target page is rendered based on the configuration information and the page code file.

13. The method according to claim 12, characterized in that The page code file includes: initialization program code for initializing the color of each page element in the target page; The rendering of the target page based on the configuration information and the page code file includes: Passing the configuration information into the initialization program code and executing the initialization program code; when executing the initialization program code, determining a target color rendering mode corresponding to the configuration information based on the configuration information; and Based on the page code file, read the color variables corresponding to each page element in the target page; Determining the color value of each of the page elements based on the correspondence between the target color rendering mode and the color variable; The target page is rendered based on the color values ​​of the various page elements.

14. A device for generating a page code file, characterized in that: include: A first acquisition module is used to acquire the initial page source file of the target page; The page source files include: structure files and style files; A second acquisition module is used to acquire an initial color value corresponding to a page element in the target page from the page source file; a determination module, configured to determine a first target color variable corresponding to the page element based on the initial color value and a preset color card; wherein the color card is used to describe the corresponding relationship between color values ​​corresponding to at least one color variable in at least one color rendering mode, and the first target color variable is a determined reference color variable; the color card and the first target color variable are used to dynamically expand other new colors that are compatible with the color mode; a replacement module, configured to replace the initial color value included in the initial page source file with the first target color variable to obtain a target page source file; A generating module, configured to generate a page code file of the target page based on the target page source file; Among them, the first target color variable is used to pass the color value corresponding to the first target color variable in the pre-configured color rendering mode into the first target color variable when rendering the target page based on the page code file, and perform color rendering on the associated page elements based on the first target color variable with the passed color value.

15. A page rendering device, characterized in that: include: a fourth acquisition module, configured to, in response to a rendering request for a target page in a target application, acquire a page code file corresponding to the target page; wherein the page code file is generated using the page code file generation method according to any one of claims 1 to 11; A fifth acquisition module, configured to acquire configuration information of a color rendering mode for the target page; A rendering module is used to render the target page based on the configuration information and the page code file.

16. A computer device, characterized in that: include: A processor, a memory, and a bus, wherein the memory stores machine-readable instructions executable by the processor. When the computer device is running, the processor and the memory communicate via the bus. When the machine-readable instructions are executed by the processor, the steps of the method for generating a page code file according to any one of claims 1 to 11 are performed, or the steps of the method for generating a page code file according to any one of claims 12 to 13 are performed.

17. A computer-readable storage medium, characterized in that The computer-readable storage medium stores a computer program, which, when executed by a processor, executes the steps of the method for generating a page code file according to any one of claims 1 to 11, or executes the steps of the method for generating a page code file according to any one of claims 12 to 13.

Images