Component updating method, device, electronic device and storage medium

Abstract

The present disclosure relates to a component update method, device, electronic device and storage medium. The method comprises: in response to a component update request, obtaining element update information for a target component element; determining the corresponding component to be updated according to the element update information; in response to an element information synchronization request, sending the element update information to a first client and a second client; the first client is used to display the updated component corresponding to the component to be updated according to the element update information; the second client is used to obtain component update information for updating the component to be updated to the updated component according to the element update information. The present disclosure can ensure the matching of style design and component update information, and improve the updating efficiency of component style.

Description

Technical Field

[0001] The present disclosure relates to the field of computer technology, and in particular to a component updating method, device, electronic device and storage medium. Background Art

[0002] With the development of computer technology, a technology has emerged in which multiple users collaborate to complete component updates. One of the users provides an update plan for the component style, and other users conduct research and development based on the update plan, thereby achieving the update of the component style.

[0003] In the related art, in order to ensure the updating efficiency of component styles, when multiple users collaborate to complete the updating of component styles, it is necessary to implement synchronous modification of component styles, that is, the component style design needs to be updated synchronously with the component update information. However, when the component style is frequently modified, the style design may not match the component update information. Therefore, the current updating efficiency of component styles is low. Summary of the invention

[0004] The present disclosure provides a component update method, device, electronic device and storage medium to at least solve the problem of low update efficiency of component styles in related technologies. The technical solution of the present disclosure is as follows:

[0005] According to a first aspect of an embodiment of the present disclosure, a component updating method is provided, including:

[0006] In response to the component update request, obtaining element update information for the target component element;

[0007] Determine the corresponding component to be updated according to the element update information;

[0008] In response to an element information synchronization request, the element update information is sent to a first client and a second client; the first client is used to display the updated component corresponding to the component to be updated according to the element update information; the second client is used to obtain component update information for updating the component to be updated to the updated component according to the element update information.

[0009] In an exemplary embodiment, determining the corresponding component to be updated according to the element update information includes: acquiring the information type represented by the element update information; and determining the component to be updated based on the information type.

[0010] In an exemplary embodiment, determining the component to be updated based on the information type includes: if the information type is a first type representing updating an element value of a target component element in a first component, using the first component as the component to be updated.

[0011] In an exemplary embodiment, determining the component to be updated based on the information type includes: if the information type is a second type representing an update of an element value of a preset element identifier, obtaining a second component associated with the preset element identifier; the preset element identifier is used to identify the element value of a target component element in the second component; and using the second component as the component to be updated.

[0012] In an exemplary embodiment, sending the element update information to the first client and the second client includes: sending the updated element value of the preset element identifier to the first client and the second client; the first client is used to display the updated component corresponding to the component to be updated according to the updated element value of the preset element identifier; the second client is used to obtain component update information for updating the component to be updated to the updated component according to the updated element value of the preset element identifier.

[0013] In an exemplary embodiment, the component update method further includes: in response to the component update request, displaying a component information update page; the component information update page carries a preview control for previewing the updated component; in response to a trigger operation on the preview control, displaying the updated component corresponding to the component to be updated according to the element update information.

[0014] In an exemplary embodiment, the target component element includes a color element; the element update information includes the updated color value of the component to be updated; and displaying the updated component corresponding to the component to be updated according to the element update information includes: displaying the color of the updated component according to the updated color value.

[0015] In an exemplary embodiment, the updated component has multiple component states; and displaying the color of the updated component according to the updated color value includes: obtaining a color scale order preset for each component state; obtaining multiple color scale values ​​corresponding to the updated color value, and filtering out a target color scale value that matches the color scale order from the multiple color scale values; and displaying each component state of the updated component according to the target color scale value.

[0016] According to a second aspect of an embodiment of the present disclosure, there is provided a component updating device, including:

[0017] An update information acquisition unit, configured to execute, in response to a component update request, acquiring element update information for a target component element;

[0018] An update component determination unit, configured to determine a corresponding component to be updated according to the element update information;

[0019] An update information synchronization unit is configured to execute in response to an element information synchronization request, and send the element update information to a first client and a second client; the first client is used to display the updated component corresponding to the component to be updated according to the element update information; the second client is used to obtain component update information for updating the component to be updated to the updated component according to the element update information.

[0020] In an exemplary embodiment, the update component determination unit is further configured to obtain the information type represented by the element update information; and determine the component to be updated based on the information type.

[0021] In an exemplary embodiment, the update component determination unit is further configured to execute, if the information type is a first type representing updating an element value of a target component element in a first component, taking the first component as the component to be updated.

[0022] In an exemplary embodiment, the update component determination unit is further configured to execute if the information type is a second type representing an update of an element value of a preset element identifier, then obtain a second component associated with the preset element identifier; the preset element identifier is used to identify the element value of a target component element in the second component; and use the second component as the component to be updated.

[0023] In an exemplary embodiment, the update information synchronization unit is further configured to send the updated element value of the preset element identifier to the first client and the second client; the first client is used to display the updated component corresponding to the component to be updated according to the updated element value of the preset element identifier; the second client is used to obtain component update information for updating the component to be updated to the updated component according to the updated element value of the preset element identifier.

[0024] In an exemplary embodiment, the component update device also includes: an update component preview unit, configured to execute in response to the component update request, display a component information update page; the component information update page carries a preview control for previewing the updated component; in response to a trigger operation on the preview control, display the updated component corresponding to the component to be updated according to the element update information.

[0025] In an exemplary embodiment, the target component element includes a color element; the element update information includes the updated color value of the component to be updated; and the updated component preview unit is further configured to display the color of the updated component according to the updated color value.

[0026] In an exemplary embodiment, there are multiple component states of the updated component; the updated component preview unit is further configured to execute acquisition of a color scale sorting preset for each component state; acquisition of multiple color scale values ​​corresponding to the updated color value, and screening out a target color scale value matching the color scale sorting from the multiple color scale values; and displaying each component state of the updated component according to the target color scale value.

[0027] In an exemplary embodiment, according to the third aspect of an embodiment of the present disclosure, an electronic device is provided, comprising: a processor; a memory for storing instructions executable by the processor; wherein the processor is configured to execute the instructions to implement a component update method as described in any one of the embodiments in the first aspect.

[0028] In an exemplary embodiment, according to the fourth aspect of the embodiments of the present disclosure, a computer-readable storage medium is provided. When the instructions in the computer-readable storage medium are executed by a processor of an electronic device, the electronic device is enabled to execute the component update method as described in any one of the embodiments in the first aspect.

[0029] In an exemplary embodiment, according to the fifth aspect of the embodiments of the present disclosure, a computer program product is provided, wherein the computer program product includes instructions, and when the instructions are executed by a processor of an electronic device, the electronic device is able to execute the component update method as described in any one of the embodiments in the first aspect.

[0030] The technical solution provided by the embodiments of the present disclosure brings at least the following beneficial effects:

[0031] By responding to a component update request, element update information for a target component element is obtained; according to the element update information, a corresponding component to be updated is determined; in response to an element information synchronization request, the element update information is sent to a first client and a second client; the first client is used to display an updated component corresponding to the component to be updated according to the element update information; the second client is used to obtain component update information for updating the component to be updated to an updated component according to the element update information. The present disclosure obtains element update information for a target component element, and after determining the component to be updated based on the element update information, the element update information is sent to a first client that provides a component update style, and a second client that is developed based on the update style, wherein the first client may be an updated component obtained by updating the update component according to the element update information, and the second client may obtain component update information for updating based on the element update information, thereby ensuring that the style design matches the component update information and improving the update efficiency of the component style.

[0032] It is to be understood that the foregoing general description and the following detailed description are exemplary and explanatory only and are not restrictive of the present disclosure. BRIEF DESCRIPTION OF THE DRAWINGS

[0033] The drawings herein are incorporated into and constitute a part of the specification, illustrate embodiments consistent with the present disclosure, and together with the description are used to explain the principles of the present disclosure, and do not constitute improper limitations on the present disclosure.

[0034] Figure 1 The present invention is an application environment diagram showing a component updating method according to an exemplary embodiment.

[0035] Figure 2 The figure is a flowchart of a component updating method according to an exemplary embodiment.

[0036] Figure 3 The invention is a flowchart of determining a component to be updated according to an exemplary embodiment.

[0037] Figure 4 is a schematic diagram showing color updating of a second component according to an exemplary embodiment.

[0038] Figure 5 The figure is a flowchart of previewing an updated component according to an exemplary embodiment.

[0039] Figure 6 The figure is an interface diagram of a component information update page according to an exemplary embodiment.

[0040] Figure 7 The flowchart of showing the color of an updated component according to an exemplary embodiment is shown.

[0041] Figure 8 is a schematic diagram of a design system upgrade according to an exemplary embodiment.

[0042] Fig. 9 The figure is a schematic diagram showing how to find common elements according to an exemplary embodiment.

[0043] Fig.10 The figure is a block diagram of a component updating device according to an exemplary embodiment.

[0044] Fig.11 It is a block diagram of an electronic device according to an exemplary embodiment. DETAILED DESCRIPTION

[0045] In order to enable ordinary persons in the art to better understand the technical solutions of the present disclosure, the technical solutions in the embodiments of the present disclosure will be clearly and completely described below in conjunction with the accompanying drawings.

[0046] It should be noted that the terms "first", "second", etc. in the specification and claims of the present disclosure and the above-mentioned drawings are used to distinguish similar objects, and are not necessarily used to describe a specific order or sequence. It should be understood that the data used in this way can be interchanged where appropriate, so that the embodiments of the present disclosure described herein can be implemented in an order other than those illustrated or described herein. The embodiments described in the following exemplary embodiments do not represent all embodiments consistent with the present disclosure. Instead, they are merely examples of devices and methods consistent with some aspects of the present disclosure as detailed in the appended claims.

[0047] It should also be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for display, data for analysis, etc.) involved in this disclosure are all information and data authorized by the user or fully authorized by all parties.

[0048] The component updating method provided in the present disclosure can be applied to Figure 1 In the application environment shown. Among them, the terminal 101, the first client 103 and the second client 104 interact with the server 102 through the network. Specifically, when the user updates the component style, the component update request for the component style can be triggered through the terminal 101, and the element update information for updating a certain component element forming the component style can be input through the terminal 101. The terminal can respond to the request, and after obtaining the element update information, determine the component to be updated that needs to be updated in style. At the same time, the user can also send the element update information to the server 102 by triggering the element information synchronization request, and the server 102 will synchronously send the element update information to the first client 103 and the second client 104. At this time, the first client 103 can display the updated component obtained after updating the component to be updated according to the element update information, and the second client 104 can generate component update information for updating the component to be updated according to the above element update information. The terminal 101, the first client 103 and the second client 104 may be, but are not limited to, various personal computers, laptops, smart phones, tablet computers and portable wearable devices, and the server 102 may be implemented as an independent server or a server cluster consisting of multiple servers.

[0049] Figure 2 is a flowchart of a component updating method according to an exemplary embodiment. Figure 2 As shown, the component updating method is used in the terminal 101 and includes the following steps.

[0050] In step S201, in response to a component update request, element update information for a target component element is obtained.

[0051] Among them, the component update request refers to a request for updating the component style of a certain component triggered by the user through the terminal 101. For example, when the user needs to update the component style of a certain component, the component update request can be triggered through the terminal 101, and the component update request can carry element update information for updating the target component element. In this embodiment, the component style can be composed of component elements of multiple different dimensions, and the target component element refers to the component element that needs to be updated through the element update information. For example, the component style of a certain component can include component elements of the following dimensions: color elements, shape elements, or font elements, etc. If the user needs to update the color of the component, then the target component element can be a color element, and if the user needs to update the shape of the component, then the target component element can be a shape element.

[0052] Specifically, when the user needs to update the component style, he can trigger a component update request for updating the component style through his terminal 101, and enter the update information for the target component element through his terminal 101. Terminal 101 can respond to the update request and obtain the element update information input by the user.

[0053] In step S202, the corresponding component to be updated is determined according to the element update information.

[0054] The component to be updated refers to the component that needs to perform element update. The element update information may carry information used to characterize the component that needs to perform style update, that is, the component to be updated. For example, the components include component A, component B, and component C, and the element update information represents an update to the color of component A. In this case, the component to be updated may be component A. Alternatively, the element update information represents an update to the colors of component A and component B. In this case, the components to be updated may be component A and component B.

[0055] In step S203, in response to the element information synchronization request, the element update information is sent to the first client 103 and the second client 104; the first client 103 is used to display the updated component corresponding to the component to be updated according to the element update information; the second client is used to obtain the code information used to update the component to be updated to the updated component according to the element update information.

[0056] The element information synchronization request is triggered by the user, and is used to synchronize the element update information to the first client 103 and the second client 104, so as to ensure the synchronization of the element update information between the first client 103 and the second client 104, and the first client 103 may be a user end that provides an update solution for component styles, and the second client 104 may be a user end that is developed according to the update solution. After the user completes editing the element update information, the user may trigger the element information synchronization request by clicking the trigger control for synchronizing the element update information. The terminal 101 may respond to the request and send the element update information to the first client 103 and the second client 104, or the terminal 101 may send the element update information to the server 102, and the server 102 may synchronize the element update information to the first client 103 and the second client 104.

[0057] The updated component refers to the component obtained after the target component element in the style of the component to be updated is updated according to the element update information. For example, if the color of the component to be updated is red, if the element update information indicates that the color of the component is converted to blue, then the updated component is the component formed after the color of the component to be updated is updated from red to blue; or if the shape of the component to be updated is a circle, if the element update information indicates that the shape of the component is converted to a square, then the updated component is the component formed after the shape of the component to be updated is updated from a circle to a square.

[0058] After the first client 103 obtains the element update information, the updated component obtained after the component to be updated is updated according to the element update information can be displayed on the first client 103, thereby ensuring the synchronous update of the component style at the user end that provides the component style update solution. At the same time, after the second client 104 obtains the element update information, component update information for updating the component to be updated to the updated component can be generated according to the above element update information. For example, the component update information can be code information for updating the component to be updated to the updated component, so as to ensure the synchronous update of the code information of the component style at the user end that is developed according to the update solution.

[0059] In the above-mentioned component update method, by responding to a component update request, element update information for the target component element is obtained; according to the element update information, the corresponding component to be updated is determined; in response to the element information synchronization request, the element update information is sent to the first client and the second client; the first client is used to display the updated component corresponding to the component to be updated according to the element update information; the second client is used to obtain component update information for updating the component to be updated to the updated component according to the element update information. The present disclosure obtains element update information for the target component element, and after determining the component to be updated based on the element update information, the element update information is sent to the first client that provides the component update style, and the second client that is developed according to the update style, wherein the first client can be the updated component obtained by updating the update component according to the element update information, and the second client can obtain the component update information for updating based on the element update information, thereby ensuring the matching of the style design with the component update information and improving the updating efficiency of the component style.

[0060] In an exemplary embodiment, if Figure 3 As shown, step S202 may further include:

[0061] In step S301, the information type represented by the element update information is obtained.

[0062] In this embodiment, element update information of different information types can be used to represent different ways of updating the components to be updated. For example, the element update information can be used to represent the update of several components, or it can be used to represent the update of several types of components at the same time. After the terminal 101 determines the element update information, it can further determine the information type of the element update information, that is, determine which type of component the element update information needs to update.

[0063] In step S302, the component to be updated is determined based on the information type.

[0064] After determining the information type of the element update information in step S301, the terminal 101 can further determine the component to be updated that needs to perform target component element update from multiple components according to the information type.

[0065] In this embodiment, the terminal 101 can determine different components to be updated according to different information types of the element update information, so that the user can input element update information of different information types to implement different updates for the components to be updated, thereby providing more diverse ways to implement component style updates.

[0066] Furthermore, step S302 may further include: if the information type is a first type representing updating of an element value of a target component element in the first component, taking the first component as a component to be updated.

[0067] The first type refers to the information type for updating the element value of the target component element of a specific component, and the first component refers to the component whose element value needs to be modified. In this embodiment, if the information type of the element update information is the first type, the terminal 101 can use the first component as the component to be updated that needs to implement component style update. For example, the target component element can be a color element. If the element update information represents that the color of component A is updated from element value A representing red to element value B representing blue, then the first component is component A. At this time, the terminal 101 can use component A as the component to be updated that needs to perform component style update, thereby realizing separate adjustment of each component.

[0068] In this embodiment, the user can update the component style of a single specific component by using the first type of element update information, thereby ensuring the accuracy of the component style update.

[0069] In addition, step S302 may further include: if the information type is a second type representing an update of an element value of a preset element identifier, obtaining a second component associated with the preset element identifier; the preset element identifier is used to identify the element value of the target component element in the second component; and using the second component as the component to be updated.

[0070] A preset element identifier refers to an identifier used to represent an element value of a certain type of component element. In this embodiment, if it is necessary to uniformly update components of the same type in order to maintain update consistency of multiple components and improve update efficiency, in this embodiment, the unified update of components of this type can be achieved by setting associated element identifiers for components of the same type, that is, by updating the element value represented by the element identifier, the second component associated with the element identifier is updated, that is, all components associated with the element identifier are treated as components to be updated that need to be updated.

[0071] For example, for the colors of components A, B, and C, if the user needs to change the colors of the other components accordingly when the color of one component changes, that is, the colors of components B and C can be changed simultaneously when the color of component A is changed, the user can associate the above components A, B, and C with a preset identifier in advance through the terminal 101. If the identifier represents the element value A of red, then the colors of components A, B, and C can all be red. If the element update information represents the second type of updating the element value of the element identifier, that is, the element update information can represent updating the element value of the element identifier from element value A to element value B representing blue, then the colors of components A, B, and C can all be updated from red to blue, thereby realizing the modification of the component colors of multiple components.

[0072] like Figure 4 As shown, the preset element identifier can be "background color", wherein the initial background colors of component A, component B and component C can all be blue. At this time, in order to facilitate the modification of the background color of any component, the background colors of the remaining components can also be modified accordingly, the writing method of "component A: blue, component B: blue, and component C: blue" can be modified to "component A: @background color, component B: @background color, component C: @background color, and background color: blue". Then, when the element update information representation modifies the element value of the element identifier, for example, when the element update information representation updates "background color: blue" to "background color: red", the background colors of component A, component B and component C can be modified synchronously.

[0073] In this embodiment, the element identifier and the second component can be associated in advance. If the element update information represents an update to the element value of the element identifier, the second component associated with the element update information can be uniformly updated at the same time, thereby improving the efficiency of component update.

[0074] Furthermore, step S203 may further include: sending the updated element value of the preset element identifier to the first client 103 and the second client 104; the first client 103 is used to display the updated component corresponding to the component to be updated according to the updated element value of the preset element identifier; the second client 104 is used to obtain component update information for updating the component to be updated to the updated component according to the updated element value of the preset element identifier.

[0075] After the terminal determines the updated element value of the preset element identifier, it can further send the updated element value to the server 102, and the server 102 can send the updated element value of the preset element identifier to the first client 103 and the second client 104. At this time, the first client 103 can display the component to be updated associated with the element identifier according to the updated element value of the element identifier. At the same time, in the second client 104, corresponding component update information can also be generated according to the updated element value of the element identifier, as component update information for updating the component to be updated to the updated component.

[0076] In this embodiment, the terminal 101 can also synchronize the updated element value of the preset element identifier to the first client 103 and the second client 104, so that after the user updates the element value of the preset element identifier, the components associated with the preset element identifier can also be synchronously updated in the first client 103 and the second client 104, thereby ensuring that when the preset element identifier is updated and multiple components are updated, the style design of multiple components matches the component update information.

[0077] In an exemplary embodiment, if Figure 5 As shown, the component updating method may further include:

[0078] In step S501, in response to a component update request, a component information update page is displayed; the component information update page carries a preview control for previewing the updated component.

[0079] The component information update page refers to a display interface displayed in the terminal 101 for updating the style of the component. The display page can be as follows: Figure 6 As shown, the display page may display controls for updating component elements constituting the component, such as element A, element B, element C, element D, element E and other component elements, wherein element A may represent the color element of the component, element B represents the font style element of the component, element C represents the shape of the component, and so on. If the user needs to modify the color element of the component, the color element can be used as the target component element by clicking the control of the color element, and the updated color can be used as the element update information. At the same time, the page also displays a "preview" control, which can be used by the user to preview the component to be updated after the component information is updated, that is, the updated component, in the terminal 101 after completing the component information update for the component to be updated.

[0080] In step S502, in response to a trigger operation on the preview control, an updated component corresponding to the component to be updated is displayed according to the element update information.

[0081] If the user needs to preview the updated component on terminal 101, he can trigger the trigger operation for the preview control by clicking the "Preview" control. At this time, terminal 101 can respond to the trigger operation, so that after the component to be updated is updated according to the element update information on terminal 101, the updated component is displayed, thereby realizing the preview of the updated component.

[0082] In this embodiment, the user can also trigger the preview control displayed in the component information update page to display the updated component on the terminal 101, thereby realizing a preview of the updated component, reducing the number of component update modifications and improving the efficiency of the component update.

[0083] Further, the target component element includes a color element; the element update information includes the updated color value of the component to be updated; step S302 may further include: displaying the color of the updated component according to the updated color value.

[0084] In this embodiment, the element of the component style that needs to be updated can be a color element. The user can modify the color value matched by the color element of the component. The color value can be the color code of a certain color, that is, the color number. The user can modify the color number matched by the component to be updated, and the terminal 101 can use the modified color number as the updated color value of the component to be updated, and can display the corresponding color of the updated component according to the above updated color value.

[0085] For example, the updated color value of component A may be color number A, and the color represented by color number A may be blue. Then terminal 101 may display the color of the component according to the color represented by color number A, that is, by displaying the component in blue.

[0086] In this embodiment, if the target component element is a color element, the element update information can be the color value number after the color is updated, so that the terminal 101 can display the updated component according to the color corresponding to the color value, thereby realizing the update of the color of the component to be updated, and the update accuracy of the color update can be guaranteed by the color value.

[0087] Furthermore, the component state of the updated component is multiple; Figure 7 As shown, displaying the color of the updated component according to the updated color value may further include:

[0088] In step S701, a color scale order preset for each component state is obtained.

[0089] Color scale refers to the index standard of image brightness, which is used to characterize the brightness of color. In this embodiment, the same component can include multiple component states. For example, for component A, it can include a default state, a triggered state when triggered, and a suspended state when idle, etc., and in order to distinguish the various states of the component, the corresponding relationship between each component state and the color scale order can be pre-set respectively. For the default state of the component, the order can be set to 6, for the triggered state of the component, the color scale order can be set to 7, and for the suspended state of the component, the color scale order can be set to 5. At this time, it can be ensured that the brightness of the component in the default state is higher than the brightness of the component in the suspended state, and the brightness of the component in the triggered state can be higher than the brightness of the component in the default state. The corresponding relationship between each component state and the color scale order can be pre-set in the terminal 101, so that the color scale order pre-set for each component state can be obtained.

[0090] In step S702, a plurality of color scale values ​​corresponding to the updated color value are obtained, and a target color scale value matching the color scale order is selected from the plurality of color scale values;

[0091] In step S703, the status of each component of the updated component is displayed according to the target color level value.

[0092] At the same time, for the color value of each color, the corresponding relationship between the color value and multiple color scale values ​​can also be pre-set, for example, the corresponding relationship between the color value and color scale value 1 is corresponding relationship 1, the corresponding relationship between the color value and color scale value 2 is corresponding relationship 2, and the corresponding relationship between the color value and color scale value 3 is corresponding relationship 3, etc., and the corresponding relationship can be characterized by a function. After the terminal 101 determines the updated color value, it can obtain multiple color scale values ​​corresponding to the color value based on the above-mentioned corresponding relationship, and filter out the color scale value that matches the color scale order of each component status from the multiple color scale values ​​as the target color scale value. And after determining each target color scale value, each component status of the updated component can be displayed according to the target color scale value.

[0093] For example, terminal 101 pre-sets 10 correspondences between color values ​​and 10 different color scale values. After terminal 101 obtains the updated color value of component A, which may be color value A, 10 color scale values ​​corresponding to color value A can be obtained based on the above correspondences. At the same time, since terminal 101 pre-sets the color scale ranking corresponding to the default state of the component as 6, then the color scale value with a color scale ranking of 6 can be selected from the 10 color scale values ​​corresponding to color value A as the target color scale value corresponding to the default state, so that when component A is in the default state, it is displayed with a color scale value with a color scale ranking of 6. Since the color scale ranking corresponding to the triggered state of the component is 7, then the color scale value with a color scale ranking of 7 can be selected from the 10 color scale values ​​corresponding to color value A as the target color scale value corresponding to the trigger state, so that when component A is in the triggered state, it is displayed with a color scale value with a color scale ranking of 7.

[0094] Through this embodiment, it is possible to display different states of a component with different color scale values. At the same time, the correspondence between the color value and multiple color scale values ​​in this embodiment can be realized through a function. Only one color value needs to be input, and multiple color scale values ​​can be obtained according to the correspondence. Therefore, when the color value represents that the component is a gradient color, multiple color scale values ​​can also be obtained through the above correspondence to display different component states, thereby optimizing the display method of different component states and improving the intelligence of the color display of different component states.

[0095] In an exemplary embodiment, a component update method is also provided. When the design system needs to be upgraded, the management terminal summarizes the upgrade plan into five dimensions: element A, element B, element C, element D, and element E. In the theme customization tool, a first client that provides an update plan for the component style and a second client that provides an update plan for the component style reach a consensus on the variable code and reference rules, and adjust the styles of the five dimensions of the component element A, element B, element C, element D, and element E. After the adjustment is completed, the design files of the first client and the codes of the second client can be synchronized, such as Figure 8 As shown, the consistency of style design and component update information adjustment can be ensured, while reducing the collaboration time of multiple users when the design is converted into code, greatly reducing the workload of both parties.

[0096] For example, when the system is upgraded, the theme color needs to be changed from blue to purple. After the management terminal receives the plan, it modifies the component color through the theme tool. After the setting is completed, it is synchronously updated to the design file of the first client and the code of the second client, so that multiple user terminals can benefit from the new theme at the same time, avoiding the problem of version misalignment.

[0097] At the same time, in order to maintain the consistency of the design, the constituent elements of different components need to be consistent. The constituent elements can be divided into 5 dimensions, and the common elements are found and assigned a code. The front-end references this code when writing code. In this way, multiple components can be changed synchronously by changing one element, such as Fig. 9 shown.

[0098] For example, the elements that make up multiple components such as buttons, multiple selection boxes, and drop-down box components all have color number A. This color number is assigned a code: background color. The previous code writing method (background: color number A) is changed to (background: @background color). In this way, as long as the color number of the background color is changed, the colors of multiple components that reference this code can be modified.

[0099] After that, after the management terminal has modified the theme and clicked synchronization, the code value of the component style will be uploaded to the database, and the component library files of the first client and the second client are read from the database, thereby ensuring the uniformity of modifications made by multiple users.

[0100] The second client downloads the corresponding code value content from the download function provided by the theme customization tool, and directly imports the downloaded code value content to complete the modification of the component style. This reduces the code coverage work of the second client and the collaboration cost between the first client and the second client.

[0101] In addition, when you adjust variables in the theme customization tool and click Preview, you can preview the content in real time. What you see is what you get, which optimizes the theme setting experience and improves setting efficiency.

[0102] At the same time, the color picking logic is optimized and gradient colors are added to meet the needs of special design scenarios, solving the problem of gradient colors being difficult to restore in the second client.

[0103] The underlying function of the color picking logic supports inputting 1 color number and calculating 10 color levels from light to dark (the input color number is the 6th color level). During the actual interaction of components, the default color / suspended color / clicked color of the component needs to be of the same hue with slight differences, so the default color of the component is the 6th color level, the suspended color is the 5th color level, and the clicked color is the 7th color level. In this way, as long as the color of the default state is modified, the color of other states can be modified through the calculation function. Compared with the original method, this color picking function can support the calculation of gradient colors. After optimization, it supports the calculation of 10 color levels of gradient colors and applies them to the effects of each state of the component.

[0104] Through the above embodiment, after the theme setting is completed, it can be synchronized to the first client and the second client, which greatly reduces the labor cost, and manages the correspondence between the code and the basic variables on the theme customization tool. By modifying the basic element value corresponding to the code, it is possible to synchronously modify multiple components that reference the changed code, greatly improving the operating efficiency. At the same time, real-time preview can be achieved, the efficiency of setting component updates is improved, and the color picking logic is optimized to support the use of gradient colors in various component states.

[0105] It should be understood that, although the various steps in the flowchart of the present disclosure are displayed in sequence according to the indication of the arrows, these steps are not necessarily executed in sequence in the order indicated by the arrows. Unless there is a clear description in this article, the execution of these steps is not strictly limited in order, and these steps can be executed in other orders. Moreover, at least a portion of the steps in the figure may include multiple steps or multiple stages, and these steps or stages are not necessarily executed at the same time, but can be executed at different times, and the execution order of these steps or stages is not necessarily to be carried out in sequence, but can be executed in turn or alternately with other steps or at least a portion of the steps or stages in other steps.

[0106] It can be understood that the same / similar parts between the various embodiments of the above method in this specification can refer to each other, and each embodiment focuses on the differences from other embodiments. For related points, please refer to the description of other method embodiments.

[0107] Fig.10 is a block diagram of a component updating device according to an exemplary embodiment. Fig.10 The device includes an update information acquisition unit 1001, an update component determination unit 1002 and an update information synchronization unit 1003.

[0108] The update information acquisition unit 1001 is configured to execute, in response to a component update request, acquiring element update information for a target component element;

[0109] The update component determination unit 1002 is configured to determine the corresponding component to be updated according to the element update information;

[0110] The update information synchronization unit 1003 is configured to execute in response to an element information synchronization request and send element update information to the first client and the second client; the first client is used to display the updated component corresponding to the component to be updated according to the element update information; the second client is used to obtain component update information for updating the component to be updated to the updated component according to the element update information.

[0111] In an exemplary embodiment, the update component determination unit 1002 is further configured to execute the acquisition of the information type represented by the element update information; and determine the component to be updated based on the information type.

[0112] In an exemplary embodiment, the update component determination unit 1002 is further configured to execute, if the information type is a first type representing updating of an element value of a target component element in the first component, then taking the first component as a component to be updated.

[0113] In an exemplary embodiment, the update component determination unit 1002 is further configured to execute if the information type is a second type representing an update of an element value of a preset element identifier, then obtain a second component associated with the preset element identifier; the preset element identifier is used to identify the element value of the target component element in the second component; and use the second component as the component to be updated.

[0114] In an exemplary embodiment, the update information synchronization unit 1003 is further configured to send the updated element value of the preset element identifier to the first client and the second client; the first client is used to display the updated component corresponding to the component to be updated according to the updated element value of the preset element identifier; the second client is used to obtain component update information for updating the component to be updated to the updated component according to the updated element value of the preset element identifier.

[0115] In an exemplary embodiment, the component update device also includes: an update component preview unit, which is configured to execute a response to a component update request and display a component information update page; the component information update page carries a preview control for previewing the updated component; in response to a trigger operation on the preview control, the updated component corresponding to the component to be updated is displayed according to the element update information.

[0116] In an exemplary embodiment, the target component element includes a color element; the element update information includes an updated color value of the component to be updated; and the updated component preview unit is further configured to display the color of the updated component according to the updated color value.

[0117] In an exemplary embodiment, there are multiple component states of the updated component; the updated component preview unit is further configured to execute acquisition of a color scale sorting preset for each component state; acquisition of multiple color scale values ​​corresponding to the updated color value, and selection of a target color scale value matching the color scale sorting from the multiple color scale values; and display of each component state of the updated component according to the target color scale value.

[0118] Regarding the device in the above embodiment, the specific manner in which each module performs operations has been described in detail in the embodiment of the method, and will not be elaborated here.

[0119] Fig.11 1 is a block diagram of an electronic device 1100 for component updating according to an exemplary embodiment. For example, the electronic device 1100 may be a mobile phone, a computer, a digital broadcast terminal, a messaging device, a game console, a tablet device, a medical device, a fitness device, a personal digital assistant, etc.

[0120] Reference Fig.11 , the electronic device 1100 may include one or more of the following components: a processing component 1102 , a memory 1104 , a power component 1106 , a multimedia component 1108 , an audio component 1110 , an input / output (I / O) interface 1112 , a sensor component 1114 , and a communication component 1116 .

[0121] The processing component 1102 generally controls the overall operation of the electronic device 1100, such as operations associated with display, phone calls, data communications, camera operations, and recording operations. The processing component 1102 may include one or more processors 1120 to execute instructions to complete all or part of the steps of the above-mentioned method. In addition, the processing component 1102 may include one or more modules to facilitate the interaction between the processing component 1102 and other components. For example, the processing component 1102 may include a multimedia module to facilitate the interaction between the multimedia component 1108 and the processing component 1102.

[0122] The memory 1104 is configured to store various types of data to support operations on the electronic device 1100. Examples of such data include instructions for any application or method operating on the electronic device 1100, contact data, phone book data, messages, pictures, videos, etc. The memory 1104 may be implemented by any type of volatile or non-volatile storage device or a combination thereof, such as a static random access memory (SRAM), an electrically erasable programmable read-only memory (EEPROM), an erasable programmable read-only memory (EPROM), a programmable read-only memory (PROM), a read-only memory (ROM), a magnetic memory, a flash memory, a magnetic disk, an optical disk, or a graphene memory.

[0123] The power supply component 1106 provides power to various components of the electronic device 1100. The power supply component 1106 may include a power management system, one or more power supplies, and other components associated with generating, managing, and distributing power to the electronic device 1100.

[0124] The multimedia component 1108 includes a screen that provides an output interface between the electronic device 1100 and the user. In some embodiments, the screen may include a liquid crystal display (LCD) and a touch panel (TP). If the screen includes a touch panel, the screen may be implemented as a touch screen to receive input signals from the user. The touch panel includes one or more touch sensors to sense touch, slide, and gestures on the touch panel. The touch sensor may not only sense the boundaries of the touch or slide action, but also detect the duration and pressure associated with the touch or slide operation. In some embodiments, the multimedia component 1108 includes a front camera and / or a rear camera. When the electronic device 1100 is in an operating mode, such as a shooting mode or a video mode, the front camera and / or the rear camera may receive external multimedia data. Each front camera and rear camera may be a fixed optical lens system or have a focal length and optical zoom capability.

[0125] The audio component 1110 is configured to output and / or input audio signals. For example, the audio component 1110 includes a microphone (MIC), and when the electronic device 1100 is in an operating mode, such as a call mode, a recording mode, and a voice recognition mode, the microphone is configured to receive an external audio signal. The received audio signal can be further stored in the memory 1104 or sent via the communication component 1116. In some embodiments, the audio component 1110 also includes a speaker for outputting an audio signal.

[0126] I / O interface 1112 provides an interface between processing component 1102 and peripheral interface modules, which may be keyboards, click wheels, buttons, etc. These buttons may include but are not limited to: a home button, a volume button, a start button, and a lock button.

[0127] The sensor assembly 1114 includes one or more sensors for providing various aspects of status assessment for the electronic device 1100. For example, the sensor assembly 1114 can detect the open / closed state of the electronic device 1100, the relative positioning of the components, such as the display and keypad of the electronic device 1100, and the sensor assembly 1114 can also detect the position change of the electronic device 1100 or the components of the electronic device 1100, the presence or absence of user contact with the electronic device 1100, the orientation or acceleration / deceleration of the device 1100, and the temperature change of the electronic device 1100. The sensor assembly 1114 may include a proximity sensor configured to detect the presence of nearby objects without any physical contact. The sensor assembly 1114 may also include an optical sensor, such as a CMOS or CCD image sensor, for use in imaging applications. In some embodiments, the sensor assembly 1114 may also include an acceleration sensor, a gyroscope sensor, a magnetic sensor, a pressure sensor, or a temperature sensor.

[0128] The communication component 1116 is configured to facilitate wired or wireless communication between the electronic device 1100 and other devices. The electronic device 1100 can access a wireless network based on a communication standard, such as WiFi, a carrier network (such as 2G, 3G, 4G or 5G), or a combination thereof. In an exemplary embodiment, the communication component 1116 receives a broadcast signal or broadcast-related information from an external broadcast management system via a broadcast channel. In an exemplary embodiment, the communication component 1116 also includes a near field communication (NFC) module to facilitate short-range communication. For example, the NFC module can be implemented based on radio frequency identification (RFID) technology, infrared data association (IrDA) technology, ultra-wideband (UWB) technology, Bluetooth (BT) technology and other technologies.

[0129] In an exemplary embodiment, the electronic device 1100 may be implemented by one or more application-specific integrated circuits (ASICs), digital signal processors (DSPs), digital signal processing devices (DSPDs), programmable logic devices (PLDs), field programmable gate arrays (FPGAs), controllers, microcontrollers, microprocessors, or other electronic components to perform the above methods.

[0130] In an exemplary embodiment, a computer-readable storage medium including instructions is also provided, such as a memory 1104 including instructions, and the above instructions can be executed by the processor 1120 of the electronic device 1100 to complete the above method. For example, the computer-readable storage medium can be a ROM, a random access memory (RAM), a CD-ROM, a magnetic tape, a floppy disk, an optical data storage device, etc.

[0131] In an exemplary embodiment, a computer program product is further provided. The computer program product includes instructions. The instructions can be executed by the processor 1120 of the electronic device 1100 to complete the above method.

[0132] It should be noted that the above-mentioned devices, electronic devices, computer-readable storage media, computer program products, etc. may also include other implementation methods according to the description of the method embodiments. The specific implementation methods can refer to the description of the relevant method embodiments, which will not be described one by one here.

[0133] Those skilled in the art will readily appreciate other embodiments of the present disclosure after considering the specification and practicing the invention disclosed herein. The present disclosure is intended to cover any variations, uses or adaptations of the present disclosure that follow the general principles of the present disclosure and include common knowledge or customary techniques in the art that are not disclosed in the present disclosure. The description and examples are to be considered exemplary only, and the true scope and spirit of the present disclosure are indicated by the claims.

[0134] It should be understood that the present disclosure is not limited to the exact structures that have been described above and shown in the drawings, and that various modifications and changes may be made without departing from the scope thereof. The scope of the present disclosure is limited only by the appended claims.

Claims

1. A component updating method, characterized in that: Applicable to management terminals, including: In response to a component update request, obtaining element update information for a target component element; the component update request is used to update a component style of the component; Determine the corresponding component to be updated according to the element update information; In response to an element information synchronization request, the element update information is sent to a first client and a second client; the first client is a user end that provides a component style update solution, and is used to display an updated component corresponding to the component to be updated according to the element update information, so as to ensure the synchronous update of the component style in the first client; the second client is a client developed according to the update solution, and is used to obtain component update information for updating the component to be updated to the updated component according to the element update information, and the component update information includes code information, so as to ensure the synchronous update of the code information of the component style in the second client; the element information synchronization request is triggered by clicking a trigger control for synchronizing element update information.

2. The method according to claim 1, characterized in that: The determining, according to the element update information, a corresponding component to be updated includes: Obtaining the information type represented by the element update information; Based on the information type, the component to be updated is determined.

3. The method according to claim 2, characterized in that The determining the component to be updated based on the information type includes: If the information type is a first type representing updating of an element value of a target component element in a first component, the first component is used as the component to be updated.

4. The method according to claim 2, characterized in that: The determining the component to be updated based on the information type includes: If the information type is the second type representing updating the element value of the preset element identifier, obtaining a second component associated with the preset element identifier; the preset element identifier is used to identify the element value of the target component element in the second component; The second component is used as the component to be updated.

5. The method according to claim 4, characterized in that The sending the element update information to the first client and the second client includes: The updated element value of the preset element identifier is sent to the first client and the second client; the first client is used to display the updated component corresponding to the component to be updated according to the updated element value of the preset element identifier; the second client is used to obtain component update information for updating the component to be updated to the updated component according to the updated element value of the preset element identifier.

6. The method according to claim 1, characterized in that Also includes: In response to the component update request, displaying a component information update page; the component information update page carries a preview control for previewing the updated component; In response to a trigger operation on the preview control, an updated component corresponding to the component to be updated is displayed according to the element update information.

7. The method according to claim 6, characterized in that The target component element includes a color element; the element update information includes the updated color value of the component to be updated; The displaying the updated component corresponding to the component to be updated according to the element update information includes: The color of the updated component is displayed according to the updated color value.

8. The method according to claim 7, characterized in that The component state of the updated component is multiple; The displaying the color of the updated component according to the updated color value includes: Get the color scale sorting preset for each component status; Acquire multiple color scale values ​​corresponding to the updated color value, and select a target color scale value matching the color scale order from the multiple color scale values; The states of each component of the updated component are displayed according to the target color scale value.

9. A component updating device, characterized in that: Applicable to management terminals, including: An update information acquisition unit is configured to execute, in response to a component update request, acquiring element update information for a target component element; the component update request is used to update a component style of the component; An update component determination unit, configured to determine a corresponding component to be updated according to the element update information; An update information synchronization unit is configured to execute in response to an element information synchronization request and send the element update information to a first client and a second client; the first client is a user end that provides an update solution for a component style, and is used to display an updated component corresponding to the component to be updated according to the element update information, so as to ensure the synchronous update of the component style in the first client; the second client is a client developed according to the update solution, and is used to obtain component update information for updating the component to be updated to the updated component according to the element update information, and the component update information includes code information, so as to ensure the synchronous update of the code information of the component style in the second client; the element information synchronization request is triggered by clicking a trigger control for synchronizing element update information.

10. The device according to claim 9, characterized in that The update component determination unit is further configured to obtain an information type represented by the element update information; and determine the component to be updated based on the information type.

11. The device according to claim 10, characterized in that The update component determination unit is further configured to execute, if the information type is a first type representing updating an element value of a target component element in a first component, taking the first component as the component to be updated.

12. The device according to claim 10, characterized in that The update component determination unit is further configured to execute, if the information type is a second type representing updating an element value of a preset element identifier, obtaining a second component associated with the preset element identifier; the preset element identifier is used to identify the element value of a target component element in the second component; The second component is used as the component to be updated.

13. The device according to claim 12, characterized in that The update information synchronization unit is further configured to send the updated element value of the preset element identifier to the first client and the second client; the first client is used to display the updated component corresponding to the component to be updated according to the updated element value of the preset element identifier; The second client is used to obtain component update information for updating the component to be updated to the updated component according to the updated element value of the preset element identifier.

14. The device according to claim 9, characterized in that Also includes: The update component preview unit is configured to execute in response to the component update request, display a component information update page; the component information update page carries a preview control for previewing the updated component; in response to a trigger operation on the preview control, display the updated component corresponding to the component to be updated according to the element update information.

15. The device according to claim 14, characterized in that The target component element includes a color element; the element update information includes the updated color value of the component to be updated; the updated component preview unit is further configured to display the color of the updated component according to the updated color value.

16. The device according to claim 15, characterized in that There are multiple component states of the updated component; the updated component preview unit is further configured to execute acquisition of a color scale sorting preset for each component state; acquisition of multiple color scale values ​​corresponding to the updated color value, and screening out a target color scale value matching the color scale sorting from the multiple color scale values; and displaying each component state of the updated component according to the target color scale value.

17. An electronic device, characterized in that: include: processor; a memory for storing instructions executable by the processor; The processor is configured to execute the instructions to implement the component updating method according to any one of claims 1 to 8.

18. A computer-readable storage medium, characterized in that: When the instructions in the computer-readable storage medium are executed by a processor of an electronic device, the electronic device is enabled to execute the component updating method according to any one of claims 1 to 8.

19. A computer program product, comprising instructions, characterized in that: When the instruction is executed by a processor of an electronic device, the electronic device is enabled to execute the component updating method as described in any one of claims 1 to 8.

Images