CN110543305B - Method and device for replacing easy UI component - Google Patents

Method and device for replacing easy UI component Download PDF

Info

Publication number
CN110543305B
CN110543305B CN201810533290.4A CN201810533290A CN110543305B CN 110543305 B CN110543305 B CN 110543305B CN 201810533290 A CN201810533290 A CN 201810533290A CN 110543305 B CN110543305 B CN 110543305B
Authority
CN
China
Prior art keywords
component
easy
plug
replacement
style
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Active
Application number
CN201810533290.4A
Other languages
Chinese (zh)
Other versions
CN110543305A (en
Inventor
王静
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Hangzhou Hikvision System Technology Co Ltd
Original Assignee
Hangzhou Hikvision System Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Hangzhou Hikvision System Technology Co Ltd filed Critical Hangzhou Hikvision System Technology Co Ltd
Priority to CN201810533290.4A priority Critical patent/CN110543305B/en
Publication of CN110543305A publication Critical patent/CN110543305A/en
Application granted granted Critical
Publication of CN110543305B publication Critical patent/CN110543305B/en
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/38Creation or generation of source code for implementing user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Stored Programmes (AREA)

Abstract

The invention discloses a method, a device and a storage medium for replacing an easy UI component, and belongs to the technical field of computers. The method comprises the following steps: determining at least one easy ui component in the target application; acquiring at least one replacement component according to the at least one easy UI component, wherein one easy UI component corresponds to one replacement component; packaging the at least one replacement component to obtain a packaged code; when at least one easy UI component in the target application is replaced, the at least one easy UI component is removed and a call address of the target application is set as a storage address of the encapsulation code. According to the embodiment of the invention, the easy UI component can be replaced without recoding the page comprising the easy component, so that the maintenance cost is reduced and the efficiency is improved.

Description

Method and device for replacing easy UI component
Technical Field
The present invention relates to the field of computer technologies, and in particular, to a method and apparatus for replacing an easy ui component.
Background
The easy ui component is a plug-in to the jQuery-based user interface that provides the necessary functionality for creating a modern and interactive JavaScript application. However, since the easy UI component is not free for commercial use, the source code is not open. Thus, the easy ui component in the program code of the application needs to be replaced for specific business needs.
Currently, the process of replacing easy ui components in program code in the application may be: by walking through the code, the developer looks up the page of program code for the application, and thus finds a page that includes the easy ui component. The developer re-encodes each page that includes the easy ui component, replacing the easy ui component in the program code.
In carrying out the invention, the inventors have found that the prior art has at least the following problems:
in the method, a developer is required to recode each page comprising the easy UI component, so that the maintenance cost is high and the efficiency is low.
Disclosure of Invention
In order to solve the problems of the prior art, the invention provides a method and a device for replacing an easy UI component. The technical proposal is as follows:
in a first aspect, an embodiment of the present invention provides a method of replacing an easy ui component, the method comprising:
determining at least one easy ui component in the target application;
acquiring at least one replacement component according to the at least one easy UI component, wherein one easy UI component corresponds to one replacement component;
packaging the at least one replacement component to obtain a packaged code;
When at least one easy UI component in the target application is replaced, the at least one easy UI component is removed and a call address of the target application is set as a storage address of the encapsulation code.
In one possible implementation, the at least one easy ui component is at least one of a form, a tree, a dialog, a layout, or a link button.
In another possible implementation, the obtaining at least one replacement component according to the at least one easyci component includes:
for each easy UI component, obtaining a plug-in matched with the style of the easy UI component, and taking the plug-in matched with the style of the easy UI component as a replacement component of the easy UI component; or alternatively, the process may be performed,
for each easy UI component, receiving an input plug-in code, encapsulating the plug-in code as a replacement component for the easy UI component, the plug-in code for implementing the functionality of the easy UI component.
In another possible implementation, when the easy ui component is a table, the obtaining a plug-in that matches a style of the easy ui component includes:
and selecting a bootstrap table plug-in with an attribute of an open source and an authorized protocol of a specified protocol from plug-ins corresponding to the table, wherein the bootstrap table plug-in is matched with the style of the table.
In another possible implementation, when the easy ui component is a tree, the obtaining a plug-in that matches a style of the easy ui component includes:
and selecting a tree plug-in ztree matched with the tree style from plug-ins corresponding to the tree.
In another possible implementation manner, the encapsulating the at least one replacement component to obtain an encapsulated code includes:
for each replacement component, determining a storage address of an easy UI component corresponding to the replacement component, packaging the replacement component, keeping calling methods of the replacement component and the easy UI component consistent, setting the calling address of the replacement component as the storage address, and obtaining a packaging component;
and uniformly packaging the at least one packaging component to obtain the packaging code.
In another possible implementation, the maintaining the calling methods of the replacement component and the EasyUI component consistent includes:
when the replacement component is inconsistent with the calling parameters of the easy UI component, the calling parameters of the replacement component are modified into the calling parameters of the easy UI component.
In a second aspect, embodiments of the present invention provide an apparatus for replacing an easy ui component, the apparatus comprising:
A determination module for determining at least one easy ui component in the target application;
the acquisition module is used for acquiring at least one replacement component according to the at least one easy UI component, and one easy UI component corresponds to one replacement component;
the packaging module is used for packaging the at least one replacement component to obtain a packaging code;
and the replacing module is used for removing at least one easy UI component in the target application program when replacing the at least one easy UI component, and setting the calling address of the target application program as the storage address of the encapsulation code.
In one possible implementation, the at least one easy ui component is at least one of a form, a tree, a dialog, a layout, or a link button.
In another possible implementation manner, the obtaining module is further configured to obtain, for each easy ui component, a plug-in that matches a style of the easy ui component, and use the plug-in that matches the style of the easy ui component as a replacement component of the easy ui component; or alternatively, the process may be performed,
the acquisition module is further used for receiving the input plug-in codes for each easy UI component, packaging the plug-in codes into replacement components of the easy UI components, and the plug-in codes are used for realizing functions of the easy UI components.
In another possible implementation manner, when the easy ui component is a table, the obtaining module is further configured to select, from plug-ins corresponding to the table, a bootstrap table plug-in whose attribute is an open source and whose authorization protocol is a specified protocol, where the bootstrap table plug-in matches a style of the table.
In another possible implementation, when the easyci component is a tree, the obtaining module is further configured to select a tree plugin ztree that matches a style of the tree from plugins corresponding to the tree.
In another possible implementation manner, the encapsulation module is further configured to determine, for each replacement component, a storage address of an easy ui component corresponding to the replacement component, encapsulate the replacement component, keep the call devices of the replacement component and the easy ui component consistent, and set the call address of the replacement component to the storage address to obtain an encapsulated component;
and the packaging module is also used for uniformly packaging the at least one packaging component to obtain the packaging code.
In another possible implementation, the encapsulation module is further configured to modify the call parameter of the replacement component to the call parameter of the easy ui component when the call parameter of the replacement component is inconsistent with the call parameter of the easy ui component.
In a third aspect, embodiments of the present invention provide an apparatus for replacing an easy ui component, the apparatus comprising:
at least one processor; and
at least one memory;
the at least one memory stores one or more programs configured for execution by the at least one processor, the one or more programs containing instructions for performing the method as described in the first aspect or any of the possible implementations of the first aspect.
In a fourth aspect, embodiments of the present invention provide a non-transitory computer readable storage medium storing a computer program loaded by a processor to execute instructions of a method as described in the first aspect or any possible implementation of the first aspect.
The technical scheme provided by the embodiment of the invention has the beneficial effects that at least: in the embodiment of the invention, at least one replacement component of at least one easy UI component is encapsulated to obtain the encapsulated code, when the at least one easy UI component in the target application program is replaced, the at least one easy UI component is directly removed, and the calling address of the target application program is set as the storage address of the encapsulated code, so that recoding of pages comprising the easy UI component is not needed, and the maintenance cost and the efficiency are reduced.
Drawings
FIG. 1 is a flow chart of a method for replacing an easy UI component provided by an embodiment of the invention;
FIG. 2 is a flow chart of a method for replacing an easy UI component provided by an embodiment of the invention;
FIG. 3 is a schematic diagram of an alternative easy UI component provided by an embodiment of the invention;
FIG. 4 is a schematic diagram of an apparatus for replacing an easy UI component according to an embodiment of the invention;
fig. 5 is a schematic structural diagram of a terminal according to an embodiment of the present invention.
Detailed Description
For the purpose of making the objects, technical solutions and advantages of the present invention more apparent, the embodiments of the present invention will be described in further detail with reference to the accompanying drawings.
An embodiment of the present invention provides a method for replacing an easy ui component, referring to fig. 1, the method includes:
step 101: at least one easy ui component in the target application is determined.
Step 102: and acquiring at least one replacement component according to the at least one easy UI component, wherein one easy UI component corresponds to one replacement component.
Step 103: and packaging the at least one replacement component to obtain a packaged code.
Step 104: when at least one easy UI component in the target application is replaced, the at least one easy UI component is removed and a call address of the target application is set as a storage address of the encapsulation code.
In one possible implementation, the at least one easy ui component is at least one of a form, a tree, a dialog, a layout, or a link button.
In another possible implementation, the obtaining at least one replacement component according to the at least one easyci component includes:
for each easy UI component, obtaining a plug-in matched with the style of the easy UI component, and taking the plug-in matched with the style of the easy UI component as a replacement component of the easy UI component; or alternatively, the process may be performed,
for each easy UI component, receiving an input plug-in code, encapsulating the plug-in code as a replacement component for the easy UI component, the plug-in code for implementing the functionality of the easy UI component.
In another possible implementation, when the easy ui component is a table, the obtaining a plug-in that matches a style of the easy ui component includes:
and selecting a bootstrap table plug-in with an attribute of an open source and an authorized protocol of a specified protocol from plug-ins corresponding to the table, wherein the bootstrap table plug-in is matched with the style of the table.
In another possible implementation, when the easy ui component is a tree, the obtaining a plug-in that matches a style of the easy ui component includes:
And selecting a tree plug-in ztree matched with the tree style from plug-ins corresponding to the tree.
In another possible implementation manner, the encapsulating the at least one replacement component to obtain an encapsulated code includes:
for each replacement component, determining a storage address of an easy UI component corresponding to the replacement component, packaging the replacement component, keeping calling methods of the replacement component and the easy UI component consistent, setting the calling address of the replacement component as the storage address, and obtaining a packaging component;
and uniformly packaging the at least one packaging component to obtain the packaging code.
In another possible implementation, the maintaining the calling methods of the replacement component and the EasyUI component consistent includes:
when the replacement component is inconsistent with the calling parameters of the easy UI component, the calling parameters of the replacement component are modified into the calling parameters of the easy UI component.
In the embodiment of the invention, at least one replacement component of at least one easy UI component is encapsulated to obtain the encapsulated code, when the at least one easy UI component in the target application program is replaced, the at least one easy UI component is directly removed, and the calling address of the target application program is set as the storage address of the encapsulated code, so that recoding of pages comprising the easy UI component is not needed, and the maintenance cost and the efficiency are reduced.
The embodiment of the invention provides a method for replacing an easy UI component, which is applied to a terminal. Referring to fig. 2, the method includes:
step 201: the terminal determines at least one easy ui component in the target application.
The target application may be any application in the terminal. Since the easy UI component is a component in a UI (user interface). Thus, the target application may also be an application that includes a UI interface. The at least one easy ui component may be at least one of a form component, a tree component, a dialog component, a layout component, or a link button component.
In one possible implementation, the program code of the target application is stored in the terminal. Accordingly, the steps may be: the terminal traverses the program code of the target application program to acquire at least one easy UI component in the program code.
In another possible implementation, when the developer finishes writing the program code of the target application, the terminal extracts the easy ui component in the program code and stores the easy ui component in the program code in the first folder. Accordingly, the steps may be: the terminal obtains at least one easy UI component in the program code from the first folder.
In another possible implementation, when the developer finishes writing the program code of the target application program, the terminal extracts all the components of the program code, and stores all the components in the second folder. Accordingly, the steps may be: the terminal selects at least one easy UI component of which component type is easy UI from all components in the second folder.
Step 202: the terminal obtains at least one replacement component according to at least one easy UI component, one easy UI component corresponding to one replacement component.
In one possible implementation, for any easy ui component, the terminal may acquire an existing plug-in as a replacement component for the easy ui component. Accordingly, the steps may be: for each easy UI component, the terminal obtains a plug-in matching the style of the easy UI component, and takes the plug-in matching the style of the easy UI component as a replacement component of the easy UI component.
In another possible implementation, for any easy ui component, the terminal receives the entered plug-in code, encapsulates the plug-in code as a replacement component for the easy ui component, and the plug-in code is used to implement the functionality of the easy ui component.
The easy ui component may be a form, tree, dialog, layout, or link button. When the easy ui component is a form, the step of the terminal acquiring a plug-in matching the form of the form may be implemented by the following (one). When the easy ui component is a tree, the step of the terminal acquiring a plug-in matching the style of the form can be achieved by the following (two). When the easy ui component is a dialog, the step of the terminal acquiring a plug-in matching the style of the form may be achieved by the following (three). When the easy ui component is a layout, the step of the terminal acquiring a plug-in matching the style of the form may be realized by the following (four). When the easy ui component is a link button, the step of the terminal acquiring a plug-in matching the style of the form can be achieved by the following (fifth).
(one): when the easy ui component is a form, the step of the terminal obtaining a plug-in matching the form of the form may be: the terminal selects a bootstrap table plug-in with the attribute of open source and the authorized protocol of the appointed protocol from plug-ins corresponding to the table, and the bootstrap table plug-in is matched with the style of the table.
This step may be achieved by the following steps (1) and (2), comprising:
(1): and the terminal selects at least one table plugin with the attribute of open source and the authorized protocol of the appointed protocol from plugins corresponding to the tables.
A plurality of plug-ins corresponding to the table are stored in the terminal; and each plug-in labels the authorization protocol of the plug-in, as well as attributes, whether the attributes are open source or non-open source. The designated protocol is a protocol meeting the security specification, and can be set and changed according to the need, and in the embodiment of the invention, the designated protocol is not particularly limited; for example, the specified protocol may be an MIT (Massachusetts Institute of Technology, open source software license protocol) protocol.
(2): and the terminal selects a bootstrap table plug-in matched with the style of the table from at least one table plug-in.
Storing the style of each form plug-in the terminal; the terminal respectively determines the matching degree of at least one table plug-in and the style of the table, and selects the bootstrap table plug-in with the highest matching degree from the at least one table plug-in according to the matching degree between the at least one table plug-in and the style of the table.
In one possible implementation, the terminal may not perform the matching filtering, but directly specify or input a bootstrapping table plug-in matching the style of the table by the developer. Correspondingly, the step of the terminal obtaining the plug-in matched with the style of the table may be: the terminal receives the input bootstrap table and encapsulates the bootstrap table into a plug-in matched with the style of the table.
In another possible implementation, the developer may also write a plug-in by himself that matches the style of the form. Correspondingly, the step of the terminal obtaining the plug-in matched with the style of the table may be: the terminal receives the input first plug-in code, and packages the first plug-in code into a plug-in matched with the style of the form; the first plug-in code is used to implement the functionality of the table.
It should be noted that, since the bootstrap table is a completely open source and the authorization protocol is MIT, the bootstrap table meets the security specification, and the bootstrap style is based on the style of the current web interface. Therefore, the bootstrap table is selected to be packaged as the replacement component of the table, so that the difference degree of the web interface before and after replacement can be reduced.
(II): when the easy ui component is a tree, the step of the terminal obtaining a plug-in matching the style of the tree may be: and the terminal selects a tree plug-in ztree matched with the tree style from plug-ins corresponding to the tree.
It should be noted that, the terminal selects the tree plug ztree to be packaged as the replacement component of the tree, so that a developer is not required to encode, and the replacement efficiency is improved.
In one possible implementation, the developer may also implement the replacement component of the tree autonomously; accordingly, the steps may be: and the terminal receives the input second plug-in code, and encapsulates the second plug-in code into a tree plug-in ztree matched with the tree style, wherein the second plug-in code is used for realizing the tree function.
Another point to be described is that the developer can also implement the replacement plug-in of the tree autonomously, so that autonomous development can be implemented, and compatibility is improved.
(III): when the easy ui component is a dialog, the developer can autonomously implement the replacement component of the dialog. Correspondingly, the step of the terminal obtaining the plug-in matched with the style of the dialog box may be: the terminal receives the third plug-in code which is input, and packages the third plug-in code into a plug-in matched with the style of the dialog box. Wherein the third plug-in code is used to implement the functionality of the dialog box. The dialog box may include a message box.
It should be noted that, a developer may implement the replacement component corresponding to the dialog box autonomously, so as to implement autonomous development and improve compatibility. In one possible implementation manner, the terminal can also select the existing dialog box plug-in to be packaged as a plug-in matched with the dialog box style, so that a developer is not required to encode, and the replacement efficiency is improved.
(IV): when the easy UI component is a layout, a developer can realize an interactive function according to the display reverse thrust, so that a replacement component corresponding to the layout is autonomously realized. Correspondingly, the step of the terminal obtaining the plug-in matched with the style of the layout may be: the terminal receives the fourth plug-in code input, and packages the fourth plug-in code into a plug-in matched with the style of the layout. Wherein the fourth plug-in code is for implementing the functionality of the layout. The layout includes a panel and a layout.
It should be noted that, the developer can implement the replacement component of the layout independently, so as to implement independent research and development and improve compatibility. In one possible implementation manner, the terminal can also select an existing layout plug-in to be packaged as a plug-in matched with the style of the layout, so that a developer is not required to encode, and the replacement efficiency is improved.
(fifth): when the easy ui component is a link button, a developer can autonomously implement a replacement component corresponding to the link button. Correspondingly, the step of the terminal obtaining the plug-in matched with the style of the link button may be: and the terminal receives the inputted fifth plug-in code and packages the fifth plug-in code into a replacement component corresponding to the link button. Wherein the fifth plug-in code is used for realizing the function of the link button.
It should be noted that, the developer can implement the replacement component of the link button independently, so as to implement independent research and development and improve compatibility. In one possible implementation manner, the terminal can also select the existing link button plug-in to be packaged as a replacement component corresponding to the link button, so that a developer is not required to encode, and the replacement efficiency is improved.
Step 203: and the terminal encapsulates at least one replacement component to obtain an encapsulated code.
This step may be achieved by the following steps (1) and (2), comprising:
(1): for each replacement component, the terminal determines the storage address of the easy UI component corresponding to the replacement component, encapsulates the replacement component according to the calling method and event of the easy UI component, keeps the calling methods of the replacement component and the easy UI component consistent, and sets the calling address of the replacement component as the storage address to obtain the encapsulated component.
(one): when the replacement component is a replacement component corresponding to a table (datagrid), the replacement component corresponding to the table is a bootstrap table; accordingly, step (1) may be: the terminal introduces a bootstrap table, encapsulates the bootstrap table calling method to $.fn.datagrid according to the datagrid calling method and event, and the page calling method remains unchanged, and the $.fn.datagrid is the storage address of the table, see fig. 3.
For example, the original calling method is $ ("#table"). Datagrid (); the terminal is packaged by a method, and finally refers to a packaging component $el. Bootstrapping table (); the step of the terminal encapsulating the $ ("# table"). Datagrid () into $ el. Bootstrapptable () may be: the terminal determines the current container according to the container identification of the current container storing the $ ("#table"); and the terminal rewrites the load method and the self-adaptive method in the current container according to the calling method and the event of the datagrid to obtain $el. In addition, after replacing the $ ("# table"). Datagrid () with $ el.bootstrapping table (), the terminal may cancel the full selection operation of the $ el.bootstrapping table (), select one row in the $ el.bootstrapping table (), and add a row above or below the selected row.
(II): when the replacement component is a replacement component corresponding to a tree (tree), the replacement component corresponding to the tree is a tree plugin ztree; correspondingly, in the step (1), ztree can be introduced into the terminal, the ztree calling method is packaged to $.fn.Tree according to the tree calling method and the event, the page calling method is kept unchanged, and $.fn.Tree is the storage address of the tree.
(III): when the replacement component is a replacement component corresponding to the dialog box, the terminal autonomously realizes the replacement component corresponding to the dialog box, encapsulates the call address of the dialog box to $.
When the dialog box includes a message box, the terminal also encapsulates the message call address to $.
(IV): the layout includes panel and layout; when the replacement component is a replacement component corresponding to the layout, the terminal autonomously realizes the replacement component corresponding to the layout, the call address of the packaging panel is $.fn.panel, the call address of the packaging layout is $.fn.layout, the page call method is kept unchanged, the $.fn.panel is the memory address of the panel, and the $.fn.layout is the memory address of the layout.
(fifth): when the replacement component is a replacement component corresponding to the link button, the terminal autonomously realizes the replacement component corresponding to the link button, and encapsulates the call address of the link button to $. fn.. The link button, the page call method remains unchanged, $. fn.. The link button is the storage address of the link button.
(2): and uniformly packaging at least one packaging component by the terminal to obtain the packaging code.
For each replacement component, the terminal determines the storage address of the easy UI component corresponding to the replacement component, encapsulates the replacement component according to the method and event of the easy UI component, keeps the calling methods of the replacement component and the easy UI component consistent, and sets the calling address of the replacement component as the storage address to obtain the encapsulation component. And uniformly packaging at least one packaging component corresponding to the at least one replacement component by the terminal to obtain a packaging code.
The step of keeping the calling methods of the replacement component and the easy ui component consistent by the terminal may be: when the replacement component is inconsistent with the call parameters of the easy UI component, the terminal modifies the call parameters of the replacement component into the call parameters of the easy UI component.
For example, like the onClickRow method, the original easy UI invokes both index, data parameters. The item, $element, is called in the bootstrapping table. The two parameters are inconsistent, the terminal changes the bootstrap table source code, the calling parameters are kept always, and the parameter transmission is changed into index/item/element (item, namely data).
The terminal encapsulates a layer of processing code on the outer layer, so that the consistency of calling methods of the replacement component and the easy UI component is kept. Wherein the original easy ui dialog call is $ ("# dialog"). Dialog (); the current form plug-in call is new $g.dlg (parallel, this, id); the terminal realizes the calling of the new plug-in method by the original easy UI dialog through code encapsulation. In addition, the dialog box plug-in is implemented for self-encoding, and other open source plug-ins are not referenced.
It should be noted that steps 201 to 203 are processes of obtaining the encapsulated code, and are only required to be executed once when the easy ui component is replaced, and then step 204 is executed directly when the easy ui component in any application is replaced.
Step 204: when at least one easy ui component in the target application is replaced, the terminal removes the at least one easy ui component.
Upon replacement of at least one easy ui component in the target application, the easy ui component in the program code of the target application is directly deleted.
Step 205: the terminal sets the call address of the target application program as the storage address of the encapsulation code.
The terminal backs up the encapsulation code to a designated storage space, determines a storage address of the designated storage space, and sets a call address of the target application program as the storage address.
In the embodiment of the invention, at least one replacement component of at least one easy UI component is encapsulated to obtain the encapsulated code, when the at least one easy UI component in the target application program is replaced, the at least one easy UI component is directly removed, and the calling address of the target application program is set as the storage address of the encapsulated code, so that recoding of pages comprising the easy UI component is not needed, and the maintenance cost and the efficiency are reduced.
The embodiment of the invention provides a device for replacing an easy UI component, which is applied to a terminal and is used for executing steps executed by the terminal in the method for replacing the easy UI component. Referring to fig. 4, the apparatus includes:
a determination module 401 for determining at least one easy ui component in the target application;
an obtaining module 402, configured to obtain at least one replacement component according to the at least one easy ui component, where one easy ui component corresponds to one replacement component;
a packaging module 403, configured to package the at least one replacement component to obtain a packaged code;
a replacing module 404, configured to remove at least one easy ui component in the target application when replacing the at least one easy ui component, and set a call address of the target application as a storage address of the encapsulation code.
In one possible implementation, the at least one easy ui component is at least one of a form, a tree, a dialog, a layout, or a link button.
In another possible implementation, the obtaining module 402 is further configured to obtain, for each easy ui component, a plug-in that matches the style of the easy ui component, and use the plug-in that matches the style of the easy ui component as a replacement component for the easy ui component; or alternatively, the process may be performed,
The obtaining module 402 is further configured to, for each easy ui component, receive an input plug-in code, and encapsulate the plug-in code into a replacement component of the easy ui component, where the plug-in code is used to implement a function of the easy ui component.
In another possible implementation manner, when the easy ui component is a table, the obtaining module 402 is further configured to select, from plug-ins corresponding to the table, a bootstrap table plug-in whose attribute is an open source, and whose authorization protocol is a specified protocol, and which matches a style of the table.
In another possible implementation, when the easyci component is a tree, the obtaining module 402 is further configured to select a tree plugin ztree that matches the tree style from plugins corresponding to the tree.
In another possible implementation manner, the encapsulation module 403 is further configured to determine, for each replacement component, a storage address of an easy ui component corresponding to the replacement component, encapsulate the replacement component, keep the call devices of the replacement component and the easy ui component consistent, and set the call address of the replacement component to the storage address, to obtain an encapsulated component;
the packaging module 403 is further configured to uniformly package the at least one packaging component to obtain the packaging code.
In another possible implementation, the encapsulation module 403 is further configured to modify the call parameter of the replacement component to the call parameter of the easy ui component when the call parameter of the replacement component is inconsistent with the call parameter of the easy ui component.
In the embodiment of the invention, at least one replacement component of at least one easy UI component is encapsulated to obtain the encapsulated code, when the at least one easy UI component in the target application program is replaced, the at least one easy UI component is directly removed, and the calling address of the target application program is set as the storage address of the encapsulated code, so that recoding of pages comprising the easy UI component is not needed, and the maintenance cost and the efficiency are reduced.
It should be noted that: the device for replacing easy ui components provided in the above embodiment is only exemplified by the division of the above functional modules when replacing easy ui components, and in practical application, the above functional allocation may be performed by different functional modules according to needs, that is, the internal structure of the device is divided into different functional modules to perform all or part of the functions described above. In addition, the device for replacing the easy ui component provided in the above embodiment belongs to the same concept as the method embodiment for replacing the easy ui component, and the specific implementation process of the device is detailed in the method embodiment, which is not described herein again.
Fig. 5 shows a block diagram of a terminal 500 according to an exemplary embodiment of the present invention. The terminal 500 may be: a smart phone, a tablet computer, an MP3 player (Moving Picture Experts GroupAudio Layer III, motion picture expert compression standard audio plane 3), an MP4 (Moving PictureExperts Group Audio Layer IV, motion picture expert compression standard audio plane 4) player, a notebook computer, or a desktop computer. The terminal 500 may also be referred to by other names of user devices, portable terminals, laptop terminals, desktop terminals, etc.
In general, the terminal 500 includes: a processor 501 and a memory 502.
Processor 501 may include one or more processing cores, such as a 4-core processor, an 8-core processor, and the like. The processor 501 may be implemented in at least one hardware form of DSP (Digital Signal Processing ), FPGA (Field-Programmable Gate Array, field programmable gate array), PLA (ProgrammableLogic Array ). The processor 501 may also include a main processor and a coprocessor, the main processor being a processor for processing data in an awake state, also referred to as a CPU (Central Processing Unit ); a coprocessor is a low-power processor for processing data in a standby state. In some embodiments, the processor 501 may integrate a GPU (Graphics Processing Unit, image processor) for rendering and drawing of content required to be displayed by the display screen. In some embodiments, the processor 501 may also include an AI (Artificial Intelligence ) processor for processing computing operations related to machine learning.
Memory 502 may include one or more computer-readable storage media, which may be non-transitory. Memory 502 may also include high-speed random access memory, as well as non-volatile memory, such as one or more magnetic disk storage devices, flash memory storage devices. In some embodiments, a non-transitory computer readable storage medium in memory 502 is used to store at least one instruction for execution by processor 501 to implement the method of replacing easy ui components provided by the method embodiments in the present application.
In some embodiments, the terminal 500 may further optionally include: a peripheral interface 503 and at least one peripheral. The processor 501, memory 502, and peripheral interface 503 may be connected by buses or signal lines. The individual peripheral devices may be connected to the peripheral device interface 503 by buses, signal lines or circuit boards. Specifically, the peripheral device includes: at least one of radio frequency circuitry 504, touch display 505, camera 506, audio circuitry 507, positioning component 508, and power supply 509.
Peripheral interface 503 may be used to connect at least one Input/Output (I/O) related peripheral to processor 501 and memory 502. In some embodiments, processor 501, memory 502, and peripheral interface 503 are integrated on the same chip or circuit board; in some other embodiments, either or both of the processor 501, memory 502, and peripheral interface 503 may be implemented on separate chips or circuit boards, which is not limited in this embodiment.
The Radio Frequency circuit 504 is configured to receive and transmit RF (Radio Frequency) signals, also known as electromagnetic signals. The radio frequency circuitry 504 communicates with a communication network and other communication devices via electromagnetic signals. The radio frequency circuit 504 converts an electrical signal into an electromagnetic signal for transmission, or converts a received electromagnetic signal into an electrical signal. Optionally, the radio frequency circuit 504 includes: antenna systems, RF transceivers, one or more amplifiers, tuners, oscillators, digital signal processors, codec chipsets, subscriber identity module cards, and so forth. The radio frequency circuitry 504 may communicate with other terminals via at least one wireless communication protocol. The wireless communication protocol includes, but is not limited to: metropolitan area networks, various generations of mobile communication networks (2G, 3G, 4G, and 5G), wireless local area networks, and/or WiFi (Wireless Fidelity ) networks. In some embodiments, the radio frequency circuitry 504 may also include NFC (Near Field Communication ) related circuitry, which is not limited in this application.
The display 505 is used to display a UI (User Interface). The UI may include graphics, text, icons, video, and any combination thereof. When the display 505 is a touch display, the display 505 also has the ability to collect touch signals at or above the surface of the display 505. The touch signal may be input as a control signal to the processor 501 for processing. At this time, the display 505 may also be used to provide virtual buttons and/or virtual keyboards, also referred to as soft buttons and/or soft keyboards. In some embodiments, the display 505 may be one, providing a front panel of the terminal 500; in other embodiments, the display 505 may be at least two, respectively disposed on different surfaces of the terminal 500 or in a folded design; in still other embodiments, the display 505 may be a flexible display disposed on a curved surface or a folded surface of the terminal 500. Even more, the display 505 may be arranged in a non-rectangular irregular pattern, i.e., a shaped screen. The display 505 may be made of LCD (Liquid Crystal Display ), OLED (organic light-Emitting Diode) or other materials.
The camera assembly 506 is used to capture images or video. Optionally, the camera assembly 506 includes a front camera and a rear camera. Typically, the front camera is disposed on the front panel of the terminal and the rear camera is disposed on the rear surface of the terminal. In some embodiments, the at least two rear cameras are any one of a main camera, a depth camera, a wide-angle camera and a tele camera, so as to realize that the main camera and the depth camera are fused to realize a background blurring function, and the main camera and the wide-angle camera are fused to realize a panoramic shooting and Virtual Reality (VR) shooting function or other fusion shooting functions. In some embodiments, camera assembly 506 may also include a flash. The flash lamp can be a single-color temperature flash lamp or a double-color temperature flash lamp. The dual-color temperature flash lamp refers to a combination of a warm light flash lamp and a cold light flash lamp, and can be used for light compensation under different color temperatures.
The audio circuitry 507 may include a microphone and a speaker. The microphone is used for collecting sound waves of users and environments, converting the sound waves into electric signals, and inputting the electric signals to the processor 501 for processing, or inputting the electric signals to the radio frequency circuit 504 for voice communication. For the purpose of stereo acquisition or noise reduction, a plurality of microphones may be respectively disposed at different portions of the terminal 500. The microphone may also be an array microphone or an omni-directional pickup microphone. The speaker is used to convert electrical signals from the processor 501 or the radio frequency circuit 504 into sound waves. The speaker may be a conventional thin film speaker or a piezoelectric ceramic speaker. When the speaker is a piezoelectric ceramic speaker, not only the electric signal can be converted into a sound wave audible to humans, but also the electric signal can be converted into a sound wave inaudible to humans for ranging and other purposes. In some embodiments, audio circuitry 507 may also include a headphone jack.
The location component 508 is used to locate the current geographic location of the terminal 500 to enable navigation or LBS (Location Based Service, location-based services). The positioning component 508 may be a positioning component based on the United states GPS (Global Positioning System ), the Beidou system of China, the Granati system of Russia, or the Galileo system of the European Union.
A power supply 509 is used to power the various components in the terminal 500. The power supply 509 may be an alternating current, a direct current, a disposable battery, or a rechargeable battery. When the power supply 509 comprises a rechargeable battery, the rechargeable battery may support wired or wireless charging. The rechargeable battery may also be used to support fast charge technology.
In some embodiments, the terminal 500 further includes one or more sensors 510. The one or more sensors 510 include, but are not limited to: an acceleration sensor 511, a gyro sensor 512, a pressure sensor 513, a fingerprint sensor 514, an optical sensor 515, and a proximity sensor 516.
The acceleration sensor 511 can detect the magnitudes of accelerations on three coordinate axes of the coordinate system established with the terminal 500. For example, the acceleration sensor 511 may be used to detect components of gravitational acceleration on three coordinate axes. The processor 501 may control the touch display 505 to display a user interface in a landscape view or a portrait view according to a gravitational acceleration signal acquired by the acceleration sensor 511. The acceleration sensor 511 may also be used for acquisition of motion data of a game or a user.
The gyro sensor 512 may detect a body direction and a rotation angle of the terminal 500, and the gyro sensor 512 may collect a 3D motion of the user to the terminal 500 in cooperation with the acceleration sensor 511. The processor 501 may implement the following functions based on the data collected by the gyro sensor 512: motion sensing (e.g., changing UI according to a tilting operation by a user), image stabilization at shooting, game control, and inertial navigation.
The pressure sensor 513 may be disposed at a side frame of the terminal 500 and/or at a lower layer of the touch display 505. When the pressure sensor 513 is disposed at a side frame of the terminal 500, a grip signal of the user to the terminal 500 may be detected, and the processor 501 performs left-right hand recognition or quick operation according to the grip signal collected by the pressure sensor 513. When the pressure sensor 513 is disposed at the lower layer of the touch display screen 505, the processor 501 controls the operability control on the UI interface according to the pressure operation of the user on the touch display screen 505. The operability controls include at least one of a button control, a scroll bar control, an icon control, and a menu control.
The fingerprint sensor 514 is used for collecting the fingerprint of the user, and the processor 501 identifies the identity of the user according to the fingerprint collected by the fingerprint sensor 514, or the fingerprint sensor 514 identifies the identity of the user according to the collected fingerprint. Upon recognizing that the user's identity is a trusted identity, the user is authorized by the processor 501 to perform relevant sensitive operations including unlocking the screen, viewing encrypted information, downloading software, paying for and changing settings, etc. The fingerprint sensor 514 may be provided on the front, back or side of the terminal 500. When a physical key or a vendor Logo is provided on the terminal 500, the fingerprint sensor 514 may be integrated with the physical key or the vendor Logo.
The optical sensor 515 is used to collect the ambient light intensity. In one embodiment, the processor 501 may control the display brightness of the touch screen 505 based on the ambient light intensity collected by the optical sensor 515. Specifically, when the intensity of the ambient light is high, the display brightness of the touch display screen 505 is turned up; when the ambient light intensity is low, the display brightness of the touch display screen 505 is turned down. In another embodiment, the processor 501 may also dynamically adjust the shooting parameters of the camera assembly 506 based on the ambient light intensity collected by the optical sensor 515.
A proximity sensor 516, also referred to as a distance sensor, is typically provided on the front panel of the terminal 500. The proximity sensor 516 serves to collect a distance between the user and the front surface of the terminal 500. In one embodiment, when the proximity sensor 516 detects that the distance between the user and the front of the terminal 500 gradually decreases, the processor 501 controls the touch display 505 to switch from the bright screen state to the off screen state; when the proximity sensor 516 detects that the distance between the user and the front surface of the terminal 500 gradually increases, the processor 501 controls the touch display 505 to switch from the off-screen state to the on-screen state.
Those skilled in the art will appreciate that the structure shown in fig. 5 is not limiting and that more or fewer components than shown may be included or certain components may be combined or a different arrangement of components may be employed.
Embodiments of the present invention provide a non-transitory computer readable storage medium storing a computer program loaded by a processor to execute instructions of the above-described method of replacing an easy ui component.
It will be understood by those skilled in the art that all or part of the steps for implementing the above embodiments may be implemented by hardware, or may be implemented by a program for instructing relevant hardware, where the program may be stored in a computer readable storage medium, and the storage medium may be a read-only memory, a magnetic disk or an optical disk, etc.
The foregoing description of the preferred embodiments of the invention is not intended to limit the invention to the precise form disclosed, and any such modifications, equivalents, and alternatives falling within the spirit and scope of the invention are intended to be included within the scope of the invention.

Claims (11)

1. A method of replacing an easyci component, the method comprising:
determining at least one easy ui component in the target application;
acquiring at least one replacement component according to the at least one easy UI component, wherein one easy UI component corresponds to one replacement component;
for each replacement component, determining a storage address of an easy UI component corresponding to the replacement component, packaging the replacement component according to a method and an event of the easy UI component, keeping calling methods of the replacement component and the easy UI component consistent, and setting the calling address of the replacement component as the storage address to obtain a packaged component;
Uniformly packaging at least one packaging component to obtain a packaging code;
when at least one easy UI component in the target application is replaced, the at least one easy UI component is removed and a call address of the target application is set as a storage address of the encapsulation code.
2. The method of claim 1, wherein the at least one easy ui component is at least one of a form, a tree, a dialog, a layout, or a link button.
3. The method of claim 2, wherein the obtaining at least one replacement component from the at least one easy ui component comprises:
for each easy UI component, obtaining a plug-in matched with the style of the easy UI component, and taking the plug-in matched with the style of the easy UI component as a replacement component of the easy UI component; or alternatively, the process may be performed,
for each easy UI component, receiving an input plug-in code, encapsulating the plug-in code as a replacement component for the easy UI component, the plug-in code for implementing the functionality of the easy UI component.
4. The method of claim 3, wherein when the easy ui component is a form, the obtaining a plug-in that matches a style of the easy ui component comprises:
And selecting a bootstrap table plug-in with an attribute of an open source and an authorized protocol of a specified protocol from plug-ins corresponding to the table, wherein the bootstrap table plug-in is matched with the style of the table.
5. The method of claim 3, wherein when the easy ui component is a tree, the obtaining a plug-in that matches a style of the easy ui component comprises:
and selecting a tree plug-in ztree matched with the tree style from plug-ins corresponding to the tree.
6. The method of claim 1, wherein the maintaining the replacement component and the easy ui component call methods consistent comprises:
when the replacement component is inconsistent with the calling parameters of the easy UI component, the calling parameters of the replacement component are modified into the calling parameters of the easy UI component.
7. An apparatus for replacing an easyci component, the apparatus comprising:
a determination module for determining at least one easy ui component in the target application;
the acquisition module is used for acquiring at least one replacement component according to the at least one easy UI component, and one easy UI component corresponds to one replacement component;
the packaging module is used for determining a storage address of an easy UI component corresponding to each replacement component, packaging the replacement components according to the method and the event of the easy UI component, keeping the calling methods of the replacement components and the easy UI component consistent, and setting the calling address of the replacement component as the storage address to obtain a packaging component; uniformly packaging at least one packaging component to obtain a packaging code;
And the replacing module is used for removing at least one easy UI component in the target application program when replacing the at least one easy UI component, and setting the calling address of the target application program as the storage address of the encapsulation code.
8. The apparatus of claim 7, wherein the at least one easy ui component is at least one of a form, a tree, a dialog, a layout, or a link button.
9. The apparatus of claim 8, wherein the device comprises a plurality of sensors,
the acquisition module is further used for acquiring a plug-in matched with the style of the easy UI component for each easy UI component, and taking the plug-in matched with the style of the easy UI component as a replacement component of the easy UI component; or alternatively, the process may be performed,
the acquisition module is further used for receiving the input plug-in codes for each easy UI component, packaging the plug-in codes into replacement components of the easy UI components, and the plug-in codes are used for realizing functions of the easy UI components.
10. The apparatus of claim 9, wherein when the easy ui component is a table, the obtaining module is further configured to select, from plug-ins corresponding to the table, a bootstrapping table plug-in whose attribute is an open source and whose authorization protocol is a specified protocol, and which matches a style of the table.
11. The apparatus of claim 9, wherein when the easy ui component is a tree, the acquisition module is further configured to select a tree plugin ztree from plugins corresponding to the tree that matches a style of the tree.
CN201810533290.4A 2018-05-29 2018-05-29 Method and device for replacing easy UI component Active CN110543305B (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201810533290.4A CN110543305B (en) 2018-05-29 2018-05-29 Method and device for replacing easy UI component

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201810533290.4A CN110543305B (en) 2018-05-29 2018-05-29 Method and device for replacing easy UI component

Publications (2)

Publication Number Publication Date
CN110543305A CN110543305A (en) 2019-12-06
CN110543305B true CN110543305B (en) 2023-05-30

Family

ID=68701042

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201810533290.4A Active CN110543305B (en) 2018-05-29 2018-05-29 Method and device for replacing easy UI component

Country Status (1)

Country Link
CN (1) CN110543305B (en)

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN104461491A (en) * 2013-09-24 2015-03-25 阿里巴巴集团控股有限公司 Running method and system of Hybrid components
CN104731622A (en) * 2015-03-27 2015-06-24 北京奇虎科技有限公司 Application program loading method and device and mobile terminal
CN106126284A (en) * 2016-06-21 2016-11-16 东软集团股份有限公司 The method and device shown for application program UI
CN107291736A (en) * 2016-03-31 2017-10-24 华为技术有限公司 A kind of method and system of edit page
CN107885533A (en) * 2017-11-30 2018-04-06 广州酷狗计算机科技有限公司 The method and device of management assembly code

Family Cites Families (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
DE102012012509B4 (en) * 2012-06-22 2021-02-04 Giesecke+Devrient Mobile Security Gmbh Method and device for replacing the operating system of a resource-limited portable data carrier
US10452428B2 (en) * 2016-03-14 2019-10-22 International Business Machines Corporation Application execution with optimized code for use profiles

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN104461491A (en) * 2013-09-24 2015-03-25 阿里巴巴集团控股有限公司 Running method and system of Hybrid components
CN104731622A (en) * 2015-03-27 2015-06-24 北京奇虎科技有限公司 Application program loading method and device and mobile terminal
CN107291736A (en) * 2016-03-31 2017-10-24 华为技术有限公司 A kind of method and system of edit page
CN106126284A (en) * 2016-06-21 2016-11-16 东软集团股份有限公司 The method and device shown for application program UI
CN107885533A (en) * 2017-11-30 2018-04-06 广州酷狗计算机科技有限公司 The method and device of management assembly code

Also Published As

Publication number Publication date
CN110543305A (en) 2019-12-06

Similar Documents

Publication Publication Date Title
CN111752666B (en) Window display method, device and terminal
CN108132790B (en) Method, apparatus and computer storage medium for detecting a garbage code
CN110362366B (en) Application interface display method and device
CN113127130B (en) Page jump method, device and storage medium
CN108717365B (en) Method and device for executing function in application program
WO2022134632A1 (en) Work processing method and apparatus
CN112749362B (en) Control creation method, device, equipment and storage medium
CN110851823B (en) Data access method, device, terminal and storage medium
CN113409427B (en) Animation playing method and device, electronic equipment and computer readable storage medium
CN114579016A (en) Method for sharing input equipment, electronic equipment and system
CN111399736B (en) Progress bar control method, device and equipment and readable storage medium
CN110968815B (en) Page refreshing method, device, terminal and storage medium
CN110677713B (en) Video image processing method and device and storage medium
CN111666076B (en) Layer adding method, device, terminal and storage medium
CN113538633B (en) Animation playing method and device, electronic equipment and computer readable storage medium
CN112988177B (en) Application installation package release method, application program operation method, server and terminal
CN112163677B (en) Method, device and equipment for applying machine learning model
CN110942426B (en) Image processing method, device, computer equipment and storage medium
CN110543305B (en) Method and device for replacing easy UI component
CN110134393B (en) Method and device for processing operation signal
CN111580892B (en) Method, device, terminal and storage medium for calling service components
CN113076452A (en) Application classification method, device, equipment and computer readable storage medium
CN112231619A (en) Conversion method, conversion device, electronic equipment and storage medium
CN111258673A (en) Fast application display method and terminal equipment
CN113010175A (en) Anonymous function information acquisition method, device, equipment and readable storage medium

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant