CN109213528A - Web front end interface integrating method and web front end interface integrating device - Google Patents
Web front end interface integrating method and web front end interface integrating device Download PDFInfo
- Publication number
- CN109213528A CN109213528A CN201710545475.2A CN201710545475A CN109213528A CN 109213528 A CN109213528 A CN 109213528A CN 201710545475 A CN201710545475 A CN 201710545475A CN 109213528 A CN109213528 A CN 109213528A
- Authority
- CN
- China
- Prior art keywords
- web
- end interface
- information
- web front
- configuration information
- 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.)
- Pending
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation 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)
- User Interface Of Digital Computer (AREA)
Abstract
The present invention provides a kind of web front end interface integrating methods and web front end interface integrating device, wherein web front end interface integrating method includes: to generate initial web front end interface according to the initial configuration information preset in Web configuration file；Obtain the configuration item modification information for including in the modification instruction of user's input；The initial configuration information in default Web configuration file is revised as target configuration information according to configuration item modification information；Initial web front end interface is adjusted to target web front end interface according to target configuration information.According to the technical solution of the present invention, the customizable exploitation for realizing web front end interface simplifies adjustment work of the developer to web front end interface, reduces workload and the working time of developer, to improve development efficiency and reduce development cost.
Description
Technical field
The present invention relates to Web technical field of software development, before web front end interface integrating method and Web
Hold interface integrating device.
Background technique
Traditional system interface exploitation based on Web (World Wide Web, global wide area network) is usually according to project
The GUI code of similar project or product carries out interface sample before the difference of business voluntarily writes GUI code or modification
The adjustment of formula or interface colour system involves the front-end interface code write excessive in this way, and is easy error, and work difficulty is invisible
Increase, and also increase engineering construction cost, it more difficult to be when user needs to adjust styles or interface colour system, it is past
Code is rewritten toward Items in order group to meet user's requirement.
Currently, the specific steps that the system interface based on Web is developed generally comprise:
Step (1) draws UI (User Interface, user interface) prototype according to user demand, identifies interface
Whole style and colour system.
The art designing personnel of step (2), project team cut figure according to UI prototype and write CSS (Cascading Style
Sheets, cascading style sheets) pattern, draw out simple static interfaces file.
Step (3), what the engineering construction personnel of project team can run further according to user demand and the formation of static interfaces file
The web system page.
Step (4), the programming personnel of project team need to write the code of actual motion line by line according to static interfaces file, this
Need to be familiar with the model code of art designing and understand the technical system of project is opposite, this process need repeatedly with art designing people
Member is linked up, and can be only achieved desired effect.
Step (5), the styles or picture that possible art designing personnel write during this can not adapt to current item
Mesh, thus needing to do over again re-starts styles design.
Step (6) needs weight if needing to adjust interface integral layout and colour system during exchanging project with user
Multiple above-mentioned steps (1) to (5), centre is likely to various mistakes occur, it is difficult to guarantee construction quality.
So being not difficult to find out from the development process at above-mentioned Web system interface, tune of the entire project to styles and style
The whole invisible workload and cost for increasing the project implementation of meeting.
Summary of the invention
The present invention is based on above-mentioned technical problem, a kind of new web front end interface Integrated Solution is proposed, in needs pair
When layout, the pattern etc. at generated web front end interface are adjusted, only need developer to the configuration in Web configuration file
Information, which carries out correspondingly modification, can be realized, and avoid the complicated work conversion between the developer of different work posts, not only real
The customizable exploitation to web front end interface is showed, has also simplified adjustment work of the developer to web front end interface, reduce
The workload of developer and working time, to improve development efficiency and reduce development cost.
In view of this, first aspect of the present invention it is proposed a kind of web front end interface integrating method, comprising: according to default
Initial configuration information in Web configuration file generates initial web front end interface；It obtains in the modification instruction of user's input and includes
Configuration item modification information；The initial configuration information in default Web configuration file is revised as target according to configuration item modification information
Configuration information；Initial web front end interface is adjusted to target web front end interface according to target configuration information.
In the technical scheme, when according to initial web front end circle of initial configuration information generation preset in Web configuration file
Behind face, what can be inputted according to user includes that the modification of configuration item modification information instructs initial configuration information being revised as target
Configuration information exists so as to which initial web front end interface is adjusted to target web front end interface according to target configuration information
When needing to be adjusted layout, the pattern etc. at generated web front end interface, only need developer in Web configuration file
Configuration information carry out correspondingly modification can be realized, avoid between the developer of different work posts complicated work conversion,
The customizable exploitation to web front end interface is not only realized, adjustment work of the developer to web front end interface is also simplified,
Workload and the working time of user are reduced, to improve development efficiency and reduce development cost.
Particularly, user can repeatedly input different modification instructions and be adjusted to web front end interface, until target
Web front end interface meets the actual demand of user.
In the above-mentioned technical solutions, it is preferable that the configuration information in default Web configuration file includes in web front end interface
Each region configuration information, wherein region includes: Web system logging zone, Web system function menu region, Web system
Feature operation region, Web system attribute display area.
In the technical scheme, presetting the configuration information in Web configuration file includes each region in web front end interface
Configuration information, it is corresponding to need to each region at least after the configuration item modification information in the modification instruction for obtaining user's input
One initial configuration information is modified, and initial web front end interface is adjusted to target web front end interface.
Wherein, the region in web front end interface includes: Web system logging zone, the user account etc. comprising login system
Relevant information is generally in interface top；Web system function menu region refers to region locating for guide menu bar mesh, generally presses
Multilevel menu is divided into according to tree structure；Web system feature operation region refers to that user clicks Web system function menu region
In menu after the operable page area that is presented to the user；Web system attribute display area is generally in interface bottom use
In the display systems information such as all rights reserved.
In any of the above-described technical solution, it is preferable that obtain the screen ruler of the display equipment at current presentation web front end interface
Very little information；According to the display scale at least one region of the configuration information in each region and screen size information adjust automatically.
It in the technical scheme, can be according to the current presentation Web when being shown to integrated web front end interface
The screen size information of the display equipment of front-end interface, under the premise of not influencing the display effect in the interface region Zhong Ge, reference
The display scale at least one region of configuration information adjust automatically in each region, to meet in different type equipment and different fields
The demand that web front end interface is shown under scape, promotes user experience.
In any of the above-described technical solution, it is preferable that configuration information includes interface framework layout information, display colour system letter
Breath, zone position information and region size information；And the data format of configuration information uses XML format or JSON format.
In the technical scheme, the configuration information at web front end interface at least may include interface framework layout information, display
Colour system information, zone position information and region size information, in order to be integrated into pair according to the configuration information for meeting user demand
The web front end interface answered carries out effect displaying；It, can be to it and then when modifying initial web front end interface according to subsequent need
Any one of configuration information carry out attribute value modification, to easily complete from initial web front end interface to target web front end
The adjustment at interface is greatly improved the development efficiency at web front end interface.Particularly, the data format of configuration information uses XML
(Extensible Markup Language, extensible markup language) format or JSON format (JavaScript Object
Notation, JavaScript object representation, a kind of data interchange format of lightweight) so that development tool is with optional
Selecting property, scalability is strong, has a wide range of application.
Wherein, the framework type that interface framework layout information includes can be divided into mo(u)ld bottom half, left right model, Flash type, state's word
Type, turning type, cover type and other expansion types can specifically select different frame layouts according to different user demands；
Display colour system information under modification essential attribute value, such as red (red), blue (blue) or rgb color mode by changing
Color-values (256 × 256 × 256) are modified, and can at least modify interface overall color, region local color, frame
Frame color, text color etc.；Zone position information can by modify essential attribute value, as top (top), middle (in
Portion), bottom (bottom), left (left side), right (the right) etc. modify, naturally it is also possible to pass through modifier area coordinate
The mode of value adjusts position of any region in entire web front end interface；Region size information passes through modification size attribute value,
Such as length value, width value or percentages change the size of any region in web front end interface.
In any of the above-described technical solution, it is preferable that default Web configuration file is static state Web file.
In the technical scheme, for configuring the default Web configuration file at integrated web front end interface using static state Web text
The form of part, it can the form of kit copies Web configuration file to corresponding Web tool progress integration exhibition and moves
State adjustment, it is simple and convenient, and using and managing convenient for the work of user's subsequent development.
The second aspect of the present invention proposes a kind of web front end interface integrating device, comprising: generation module is used for basis
Initial configuration information in default Web configuration file generates initial web front end interface；Module is obtained, for obtaining user's input
Modification instruction in include configuration item modification information；Modified module, the configuration item modification letter for being obtained according to module is obtained
Initial configuration information in default Web configuration file is revised as target configuration information by breath；Control module, for according to modification mould
The target configuration information that block obtains, which is controlled, is adjusted to target web front end interface for initial web front end interface.
In the technical scheme, when according to initial web front end circle of initial configuration information generation preset in Web configuration file
Behind face, what can be inputted according to user includes that the modification of configuration item modification information instructs initial configuration information being revised as target
Configuration information exists so as to which initial web front end interface is adjusted to target web front end interface according to target configuration information
When needing to be adjusted layout, the pattern etc. at generated web front end interface, only need developer in Web configuration file
Configuration information carry out correspondingly modification can be realized, avoid between the developer of different work posts complicated work conversion,
The customizable exploitation to web front end interface is not only realized, adjustment work of the developer to web front end interface is also simplified,
Workload and the working time of user are reduced, to improve development efficiency and reduce development cost.
Particularly, user can repeatedly input different modification instructions and be adjusted to web front end interface, until target
Web front end interface meets the actual demand of user.
In the above-mentioned technical solutions, it is preferable that the configuration information in default Web configuration file includes in web front end interface
Each region configuration information, wherein region includes: Web system logging zone, Web system function menu region, Web system
Feature operation region, Web system attribute display area.
In the technical scheme, presetting the configuration information in Web configuration file includes each region in web front end interface
Configuration information, it is corresponding to need to each region at least after the configuration item modification information in the modification instruction for obtaining user's input
One initial configuration information is modified, and initial web front end interface is adjusted to target web front end interface.
Wherein, the region in web front end interface includes: Web system logging zone, the user account etc. comprising login system
Relevant information is generally in interface top；Web system function menu region refers to region locating for guide menu bar mesh, generally presses
Multilevel menu is divided into according to tree structure；Web system feature operation region refers to that user clicks Web system function menu region
In menu after the operable page area that is presented to the user；Web system attribute display area is generally in interface bottom use
In the display systems information such as all rights reserved.
In any of the above-described technical solution, it is preferable that obtain the screen ruler of the display equipment at current presentation web front end interface
Very little information；According to the display scale at least one region of the configuration information in each region and screen size information adjust automatically.
It in the technical scheme, can be according to the current presentation Web when being shown to integrated web front end interface
The screen size information of the display equipment of front-end interface, under the premise of not influencing the display effect in the interface region Zhong Ge, reference
The display scale at least one region of configuration information adjust automatically in each region, to meet in different type equipment and different fields
The demand that web front end interface is shown under scape, promotes user experience.
In any of the above-described technical solution, it is preferable that configuration information includes interface framework layout information, display colour system letter
Breath, zone position information and region size information；And the data format of configuration information uses XML format or JSON format.
In the technical scheme, the configuration information at web front end interface at least may include interface framework layout information, display
Colour system information, zone position information and region size information, in order to be integrated into pair according to the configuration information for meeting user demand
The web front end interface answered carries out effect displaying；It, can be to it and then when modifying initial web front end interface according to subsequent need
Any one of configuration information carry out attribute value modification, to easily complete from initial web front end interface to target web front end
The adjustment at interface is greatly improved the development efficiency at web front end interface.Particularly, the data format of configuration information uses XML
Format or JSON format, so that development tool has alternative, scalability is strong, has a wide range of application.
Wherein, the framework type that interface framework layout information includes can be divided into mo(u)ld bottom half, left right model, Flash type, state's word
Type, turning type, cover type and other expansion types can specifically select different frame layouts according to different user demands；
Display colour system information under modification essential attribute value, such as red (red), blue (blue) or rgb color mode by changing
Color-values (256 × 256 × 256) are modified, and can at least modify interface overall color, region local color, frame
Frame color, text color etc.；Zone position information can by modify essential attribute value, as top (top), middle (in
Portion), bottom (bottom), left (left side), right (the right) etc. modify, naturally it is also possible to pass through modifier area coordinate
The mode of value adjusts position of any region in entire web front end interface；Region size information passes through modification size attribute value,
Such as length value, width value or percentages change the size of any region in web front end interface.
In any of the above-described technical solution, it is preferable that default Web configuration file is static state Web file.
In the technical scheme, for configuring the default Web configuration file at integrated web front end interface using static state Web text
The form of part, it can the form of kit copies Web configuration file to corresponding Web tool progress integration exhibition and moves
State adjustment, it is simple and convenient, and using and managing convenient for the work of user's subsequent development.
According to the technical solution of the present invention, layout, pattern etc. to generated web front end interface is being needed to be adjusted
When, only needing developer to carry out correspondingly modification to the configuration information in Web configuration file can be realized, and avoid different work posts
Developer between complicated work conversion, not only realize the customizable exploitation to web front end interface, also simplify exploitation
Adjustment work of the personnel to web front end interface, reduces workload and the working time of developer, to improve exploitation effect
Rate simultaneously reduces development cost.
Detailed description of the invention
Fig. 1 shows the schematic flow diagram of web front end interface integrating method according to an embodiment of the invention；
Fig. 2 shows the schematic flow diagrams of web front end interface integrating method according to another embodiment of the invention；
Fig. 3 shows the schematic block diagram of web front end interface according to an embodiment of the invention integrating device；
Fig. 4 shows the schematic flow diagram of web front end interface integrating method according to still another embodiment of the invention；
Fig. 5 A shows initial web front end circle of web front end interface integrating method according to an embodiment of the invention
Face schematic diagram；
Fig. 5 B shows target web front end circle of web front end interface integrating method according to an embodiment of the invention
Face schematic diagram.
Specific embodiment
To better understand the objects, features and advantages of the present invention, with reference to the accompanying drawing and specific real
Applying mode, the present invention is further described in detail.It should be noted that in the absence of conflict, the implementation of the application
Feature in example and embodiment can be combined with each other.
In the following description, numerous specific details are set forth in order to facilitate a full understanding of the present invention, still, the present invention may be used also
To be implemented using other than the one described here other modes, therefore, protection scope of the present invention is not by described below
Specific embodiment limitation.
Technical solution of the present invention is described in detail below with reference to Fig. 1 to Fig. 3.
Fig. 1 shows the schematic flow diagram of web front end interface integrating method according to an embodiment of the invention.
As shown in Figure 1, web front end interface integrating method according to an embodiment of the invention, comprising:
Step 102, initial web front end interface is generated according to the initial configuration information in default Web configuration file.
In this step, the configuration information collection that the user demand which can be initial according to generates
At.
Step 104, the configuration item modification information for including in the modification instruction of user's input is obtained；
Step 106, the initial configuration information in default Web configuration file is revised as by target according to configuration item modification information
Configuration information；
Step 108, initial web front end interface is adjusted to by target web front end interface according to target configuration information.
In this embodiment, when according to the initial web front end interface of initial configuration information generation preset in Web configuration file
Afterwards, what can be inputted according to user includes that initial configuration information is revised as target and matches by the modification instruction of configuration item modification information
Confidence breath is needing so as to which initial web front end interface is adjusted to target web front end interface according to target configuration information
Will layout, pattern etc. to generated web front end interface when being adjusted, only need developer in Web configuration file
Configuration information, which carries out correspondingly modification, can be realized, and avoid the complicated work conversion between the developer of different work posts, no
The customizable exploitation to web front end interface is only realized, adjustment work of the developer to web front end interface is also simplified, is contracted
Workload and the working time of user are subtracted, to improve development efficiency and reduce development cost.
Particularly, user can repeatedly input different modification instructions and be adjusted to web front end interface, until target
Web front end interface meets the actual demand of user.
In the above embodiment, it is preferable that the configuration information in default Web configuration file includes in web front end interface
The configuration information in each region, wherein region includes: Web system logging zone, Web system function menu region, Web system function
It can operating area, Web system attribute display area.
In this embodiment, presetting the configuration information in Web configuration file includes matching for each region in web front end interface
Confidence breath, it is corresponding to need to each region at least one after the configuration item modification information in the modification instruction for obtaining user's input
A initial configuration information is modified, and initial web front end interface is adjusted to target web front end interface.
Wherein, the region in web front end interface includes: Web system logging zone, the user account etc. comprising login system
Relevant information is generally in interface top；Web system function menu region refers to region locating for guide menu bar mesh, generally presses
Multilevel menu is divided into according to tree structure；Web system feature operation region refers to that user clicks Web system function menu region
In menu after the operable page area that is presented to the user；Web system attribute display area is generally in interface bottom use
In the display systems information such as all rights reserved.
It further, may include area identification in the configuration information in each region in any of the above-described embodiment, in order to
When modifying initial configuration information according to configuration item modification information, it can be ensured that the accuracy of information adjustment.
Further, in any of the above-described embodiment, integrated web front end interface can be carried out by following examples
It shows, specifically, web front end interface integrating method according to the present invention, on the basis of method flow as shown in Figure 1, such as
Shown in Fig. 2, web front end interface integrating method according to another embodiment of the invention, further includes:
Step 202, the screen size information of the display equipment at current presentation web front end interface is obtained；
Step 204, according to the display at least one region of the configuration information in each region and screen size information adjust automatically
Ratio.
In this embodiment, when being shown to integrated web front end interface, can be according to the current presentation Web before
The screen size information for holding the display equipment at interface, under the premise of not influencing the display effect in the interface region Zhong Ge, referring to each
The display scale at least one region of configuration information adjust automatically in region, to meet in different type equipment and different scenes
The lower demand for showing web front end interface, promotes user experience.
Further, in any of the above-described embodiment, it is preferable that configuration information includes interface framework layout information, display
Colour system information, zone position information and region size information；And the data format of configuration information uses XML format or JSON lattice
Formula.
In the technical scheme, the configuration information at web front end interface at least may include interface framework layout information, display
Colour system information, zone position information and region size information, in order to be integrated into pair according to the configuration information for meeting user demand
The web front end interface answered carries out effect displaying；It, can be to it and then when modifying initial web front end interface according to subsequent need
Any one of configuration information carry out attribute value modification, to easily complete from initial web front end interface to target web front end
The adjustment at interface is greatly improved the development efficiency at web front end interface.Particularly, the data format of configuration information uses XML
Format or JSON format, so that development tool has alternative, scalability is strong, has a wide range of application.
Wherein, the framework type that interface framework layout information includes can be divided into mo(u)ld bottom half, left right model, Flash type, state's word
Type, turning type, cover type and other expansion types can specifically select different frame layouts according to different user demands；
Display colour system information under modification essential attribute value, such as red (red), blue (blue) or rgb color mode by changing
Color-values (256 × 256 × 256) are modified, and can at least modify interface overall color, region local color, frame
Frame color, text color etc.；Zone position information can by modify essential attribute value, as top (top), middle (in
Portion), bottom (bottom), left (left side), right (the right) etc. modify, naturally it is also possible to pass through modifier area coordinate
The mode of value adjusts position of any region in entire web front end interface；Region size information passes through modification size attribute value,
Such as length value, width value or percentages change the size of any region in web front end interface.
Further, in any of the above-described embodiment, it is preferable that default Web configuration file is static state Web file.
In this embodiment, static state Web file is used for configuring the default Web configuration file at integrated web front end interface
Form, it can the form of kit copies Web configuration file to corresponding Web tool and carries out integration exhibition and dynamic
Adjustment, it is simple and convenient, and using and managing convenient for the work of user's subsequent development.
Fig. 3 shows the schematic block diagram of web front end interface according to an embodiment of the invention integrating device.
As shown in figure 3, web front end interface according to an embodiment of the invention integrating device 300, comprising: generate mould
Block 302 obtains module 304, modified module 306 and control module 308.
Wherein, before generation module 302 is used to generate initial Web according to the initial configuration information preset in Web configuration file
Hold interface；It obtains module 304 and is used to obtain the configuration item modification information in the modification instruction that user inputs included；Modified module
306 for modifying the initial configuration information in default Web configuration file according to the configuration item modification information for obtaining module acquisition
For target configuration information；The target configuration information that control module 308 is used to be obtained according to modified module is controlled initial web front end
Interface is adjusted to target web front end interface.
In this embodiment, when according to the initial web front end interface of initial configuration information generation preset in Web configuration file
Afterwards, what can be inputted according to user includes that initial configuration information is revised as target and matches by the modification instruction of configuration item modification information
Confidence breath is needing so as to which initial web front end interface is adjusted to target web front end interface according to target configuration information
Will layout, pattern etc. to generated web front end interface when being adjusted, only need developer in Web configuration file
Configuration information, which carries out correspondingly modification, can be realized, and avoid the complicated work conversion between the developer of different work posts, no
The customizable exploitation to web front end interface is only realized, adjustment work of the developer to web front end interface is also simplified, is contracted
Workload and the working time of user are subtracted, to improve development efficiency and reduce development cost.
Particularly, user can repeatedly input different modification instructions and be adjusted to web front end interface, until target
Web front end interface meets the actual demand of user.
In the above embodiment, it is preferable that the configuration information in default Web configuration file includes in web front end interface
The configuration information in each region, wherein region includes: Web system logging zone, Web system function menu region, Web system function
It can operating area, Web system attribute display area.
In the technical scheme, presetting the configuration information in Web configuration file includes each region in web front end interface
Configuration information, it is corresponding to need to each region at least after the configuration item modification information in the modification instruction for obtaining user's input
One initial configuration information is modified, and initial web front end interface is adjusted to target web front end interface.
Wherein, the region in web front end interface includes: Web system logging zone, the user account etc. comprising login system
Relevant information is generally in interface top；Web system function menu region refers to region locating for guide menu bar mesh, generally presses
Multilevel menu is divided into according to tree structure；Web system feature operation region refers to that user clicks Web system function menu region
In menu after the operable page area that is presented to the user；Web system attribute display area is generally in interface bottom use
In the display systems information such as all rights reserved.
Further, in any of the above-described embodiment, it is preferable that the web front end interface collection of embodiment according to the present invention
At device 300 further include: acquisition module 310 and adjustment module 312.
Wherein, screen size information of the acquisition module 310 for the display equipment at current presentation web front end interface；Adjustment
Module 312 is used for the display scale at least one region of configuration information and screen size information adjust automatically according to each region.
In this embodiment, when being shown to integrated web front end interface, can be according to the current presentation Web before
The screen size information for holding the display equipment at interface, under the premise of not influencing the display effect in the interface region Zhong Ge, referring to each
The display scale at least one region of configuration information adjust automatically in region, to meet in different type equipment and different scenes
The lower demand for showing web front end interface, promotes user experience.
Further, in any of the above-described embodiment, it is preferable that configuration information includes interface framework layout information, display
Colour system information, zone position information and region size information；And the data format of configuration information uses XML format or JSON lattice
Formula.
In this embodiment, the configuration information at web front end interface at least may include interface framework layout information, display color
It is information, zone position information and region size information, in order to be integrated into correspondence according to the configuration information for meeting user demand
Web front end interface carry out effect displaying；It, can be to wherein and then when modifying initial web front end interface according to subsequent need
Any one configuration information carries out the modification of attribute value, to easily complete from initial web front end interface to target web front end circle
The adjustment in face is greatly improved the development efficiency at web front end interface.Particularly, the data format of configuration information uses XML lattice
Formula or JSON format, so that development tool has alternative, scalability is strong, has a wide range of application.
Wherein, the framework type that interface framework layout information includes can be divided into mo(u)ld bottom half, left right model, Flash type, state's word
Type, turning type, cover type and other expansion types can specifically select different frame layouts according to different user demands；
Display colour system information under modification essential attribute value, such as red (red), blue (blue) or rgb color mode by changing
Color-values (256 × 256 × 256) are modified, and can at least modify interface overall color, region local color, frame
Frame color, text color etc.；Zone position information can by modify essential attribute value, as top (top), middle (in
Portion), bottom (bottom), left (left side), right (the right) etc. modify, naturally it is also possible to pass through modifier area coordinate
The mode of value adjusts position of any region in entire web front end interface；Region size information passes through modification size attribute value,
Such as length value, width value or percentages change the size of any region in web front end interface.
In any of the above-described embodiment, it is preferable that default Web configuration file is static state Web file.
In this embodiment, static state Web file is used for configuring the default Web configuration file at integrated web front end interface
Form, it can the form of kit copies Web configuration file to corresponding Web tool and carries out integration exhibition and dynamic
Adjustment, it is simple and convenient, and using and managing convenient for the work of user's subsequent development.
The web front end interface Integrated Solution of the embodiment of the present invention is illustrated below with reference to Fig. 4, Fig. 5 A and Fig. 5 B.
As shown in figure 4, web front end interface integrating method according to still another embodiment of the invention, including following below scheme:
Step 402, copy tool APMB package (default Web configuration file and it includes initial configuration information) arrives Web work
In tool, which provides static Web file, and bibliographic structure is as follows:
By the integration tool APMB package at the web front end interface, the behaviour of the redjustment and modification to web front end interface can simplify
Make.
Step 404, the menu data in integration tool APMB package, to generate initial web front end interface, i.e., by WEB system
Function menu carry out structuring, for example, web front end examples of interfaces as shown in Figure 5A, wherein the structural support of menu data
Two kinds of formats of json and xml, i.e. client and server can be communicated by two kinds of agreements of json and xml, specifically:
(1) menu data json format sample is as follows:
(2) menu data xml format sample is as follows:
Step 406, according to the configuration information in user demand modifiers APMB package, configuration file need to only be modified
Corresponding configuration item information in config.xml can be realized the adjustment to web front end interface, for example pass through modification configuration item
Frameworklayout value and frameworkcolor value can be realized whole to the adjustment interface of interface integral layout switching respectively
Body colour system adjustment, wherein frameworklayout=dd indicates that up-down structure layout, frameworkcolor=blue represent
The whole colour system for being exactly WEB system interface is blue；
Step 408, Web tool run modified tool APMB package (i.e. default Web configuration file and it includes target
Configuration information)；
Step 410, pass through browser accession page (i.e. target web front end interface), web front end interface as shown in Figure 5 B
Example.
In this embodiment, web front end developer obtains preset configuration file by way of copy tool APMB package,
And according to actual items needs, input modification instruction is modified the initial configuration information of configuration file, be can be realized to web front end
The adjustment at interface rewrites code without developer.
Specifically, as fig. 5 a and fig. 5b, only needing to change configuration file configuration item by the integrated system can be real
Shi Genggai Web system interface integral layout, at present layout support up-down structure layout and tiled configuration layout switching, it is so-called on
Flowering structure and tiled configuration are explained as follows:
Head zone (i.e. Web system logging zone), menu area can be generally divided into most of Web system engineerings
Domain (i.e. Web system function menu region), specific detailed functions working region (i.e. Web system feature operation region) and bottom
Portion region (i.e. Web system attribute display area).Head zone generally comprises the letter such as name, department, contact method for logging in people
Breath, system exit button, notice notice information etc., are generally placed in Web page upper area.Function menu region refers to one
Web system guides user to carry out the guide menu of feature operation, generally divides a thicker module, can divide again under module
Submodule is often menu in junior, and the specific page for wanting operation is presented after menu to user when the user clicks, this is specific
The page i.e. function pages region described herein.Bottom section often system information such as all rights reserved.
As shown in Figure 5A, web front end interface integrating method initial interface 500A according to an embodiment of the invention, packet
Include head zone 502A, menu area 504A, working region 506A, bottom section 508A.
As shown in Figure 5 B, web front end interface integrating method target interface 500B according to an embodiment of the invention, packet
Include head zone 502B, menu area 504B, working region 506B, bottom section 508B.
In this embodiment, initialization web front end interface 500A, Web are generated according to the initial configuration information of configuration file
For front end developer according to actual items needs, input includes the instruction of configuration item modification information, wherein configuration item modification letter
Breath, which is included at least, is changed to target (upper mo(u)ld bottom half) page cloth for the left and right page layout of menu area 504A and working region 506A
Office, head layout areas 502A height modify, target menu region and working region width value and height value etc. (such as also
Colour system information is modified, this embodiment wouldn't discuss), after obtaining target configuration information, target web front end will be generated
Interface 500B, as shown in Figure 5 B, it is obvious that head zone 502A is adjusted to head zone 502B, working region 506A
It is changed to page layout up and down with menu area 504A or so page layout, while width value and height value are also adjusted,
As menu area 504B and working region 506B, since bottom section 508A configuration information does not adjust, and bottom zone
Domain 508B display effect is identical.
It is abstract by above- mentioned information region, Web page is integrally divided into several configurable region units, and to region unit
Placement position it is configurable, and these region units adjust corresponding proportion automatically according to screen-sized.
To sum up, by using interface integrating method of the present invention, developer is simplified to web front end interface entirety
The adjustment work of style and pattern etc. makes to need the personnel such as UI design, art designing, programmer to complete work and be converted to only use originally
The switching adjustment of interface whole style and pattern etc. can be realized in the tool APMB package, and project team member is made to focus more on this project
Functional development.
Further, a kind of computer equipment is proposed according to one embodiment of present invention, and specifically, which sets
It is standby including memory, processor and storage on a memory and the computer program that can run on a processor, wherein memory
It can be connected, be realized when processor is for executing the computer program stored in memory as above by bus between processor
Described in any one of embodiment the step of web front end interface integrating method.
Step in the method for the embodiment of the present disclosure can be sequentially adjusted, merged and deleted according to actual needs.
Unit in the web front end interface integrating device and computer equipment of the embodiment of the present disclosure can be according to actual needs
It is combined, divided and deleted.
Further, any process described otherwise above in flow chart or herein or method description it is understood that
To indicate the mould for including the steps that one or more codes for realizing specific logical function or the executable instruction of process
Block, segment or part, and the range of the preferred embodiment of the present invention includes other realization, wherein can not be by shown
Or the sequence discussed, including according to related function by it is basic and meanwhile in the way of or in the opposite order, to execute function, this
It should be understood by the embodiment of the present invention person of ordinary skill in the field.
Expression or logic and/or step described otherwise above herein in flow charts, for example, being considered use
In the order list for the executable instruction for realizing logic function, may be embodied in any computer-readable medium, for
Instruction execution system, device or equipment (such as computer based system, including the system of processor or other can be held from instruction
The instruction fetch of row system, device or equipment and the system executed instruction) it uses, or combine these instruction execution systems, device or set
It is standby and use.For the purpose of this specification, " computer-readable medium ", which can be, any may include, stores, communicates, propagates or pass
Defeated program is for instruction execution system, device or equipment or the dress used in conjunction with these instruction execution systems, device or equipment
It sets.The more specific example (non-exhaustive list) of computer-readable medium include the following: there is the electricity of one or more wirings
Interconnecting piece (electronic device), portable computer diskette box (magnetic device), random access memory (RAM), read-only memory
(ROM), erasable edit read-only storage (EPROM or flash memory), fiber device and portable optic disk is read-only deposits
Reservoir (CDROM).In addition, computer-readable medium can even is that the paper that can print described program on it or other are suitable
Medium, because can then be edited, be interpreted or when necessary with it for example by carrying out optical scanner to paper or other media
His suitable method is handled electronically to obtain described program, is then stored in computer storage.
It should be appreciated that each section of the invention can be realized with hardware, software, firmware or their combination.Above-mentioned
In embodiment, software that multiple steps or method can be executed in memory and by suitable instruction execution system with storage
Or firmware is realized.It, and in another embodiment, can be under well known in the art for example, if realized with hardware
Any one of column technology or their combination are realized: having a logic gates for realizing logic function to data-signal
Discrete logic, with suitable combinational logic gate circuit specific integrated circuit, programmable gate array (PGA), scene
Programmable gate array (FPGA) etc..
Those skilled in the art are understood that realize all or part of step that above-described embodiment method carries
It suddenly is that relevant hardware can be instructed to complete by program, the program can store in a kind of computer-readable storage medium
In matter, which when being executed, includes the steps that one or a combination set of embodiment of the method.
It, can also be in addition, each functional unit in each embodiment of the present invention can integrate in a processing module
It is that each unit physically exists alone, can also be integrated in two or more units in a module.Above-mentioned integrated mould
Block both can take the form of hardware realization, can also be realized in the form of software function module.The integrated module is such as
Fruit is realized and when sold or used as an independent product in the form of software function module, also can store in a computer
In read/write memory medium.
Storage medium mentioned above can be read-only memory, disk or CD etc..
The technical scheme of the present invention has been explained in detail above with reference to the attached drawings, according to the technical solution of the present invention, in needs pair
When layout, the pattern etc. at generated web front end interface are adjusted, only need developer to the configuration in Web configuration file
Information, which carries out correspondingly modification, can be realized, and avoid the complicated work conversion between the developer of different work posts, not only real
The customizable exploitation to web front end interface is showed, has also simplified adjustment work of the developer to web front end interface, reduce
The workload of developer and working time, to improve development efficiency and reduce development cost.
The foregoing is only a preferred embodiment of the present invention, is not intended to restrict the invention, for the skill of this field
For art personnel, the invention may be variously modified and varied.All within the spirits and principles of the present invention, made any to repair
Change, equivalent replacement, improvement etc., should all be included in the protection scope of the present invention.
Claims (10)
1. a kind of web front end interface integrating method characterized by comprising
Initial web front end interface is generated according to the initial configuration information in default Web configuration file；
Obtain the configuration item modification information for including in the modification instruction of user's input；
The initial configuration information in the default Web configuration file is revised as target according to the configuration item modification information
Configuration information；
The initial web front end interface is adjusted to target web front end interface according to the target configuration information.
2. web front end interface integrating method according to claim 1, which is characterized in that
Configuration information in the default Web configuration file includes the configuration information in each region in web front end interface, wherein
The region includes: Web system logging zone, Web system function menu region, Web system feature operation region, Web
System property display area.
3. web front end interface integrating method according to claim 2, which is characterized in that further include:
Obtain the screen size information of the display equipment at current presentation web front end interface；
According to the display scale of the configuration information in each region and at least one region of screen size information adjust automatically.
4. web front end interface integrating method according to claim 2 or 3, which is characterized in that
The configuration information includes interface framework layout information, display colour system information, zone position information and region size information；
And
The data format of the configuration information uses XML format or JSON format.
5. web front end interface integrating method according to any one of claim 1 to 3, which is characterized in that described default
Web configuration file is static state Web file.
6. a kind of web front end interface integrating device characterized by comprising
Generation module, for generating initial web front end interface according to the initial configuration information preset in Web configuration file；
Module is obtained, the configuration item modification information for including in obtaining the modification instruction of user's input；
The default Web is configured text by modified module, the configuration item modification information for being obtained according to the acquisition module
The initial configuration information in part is revised as target configuration information；
Control module, the target configuration information for being obtained according to the modified module are controlled the initial web front end
Interface is adjusted to target web front end interface.
7. web front end interface according to claim 6 integrating device, which is characterized in that
Configuration information in the default Web configuration file includes the configuration information in each region in web front end interface, wherein
The region includes: Web system logging zone, Web system function menu region, Web system feature operation region, Web
System property display area.
8. web front end interface according to claim 7 integrating device, which is characterized in that further include:
Acquisition module, the screen size information of the display equipment for acquiring current presentation web front end interface；
Module is adjusted, for the screen size information according to the configuration information in each region and acquisition module acquisition
The display scale at least one region of adjust automatically.
9. web front end interface according to claim 7 or 8 integrating device, which is characterized in that
The configuration information includes interface framework layout information, display colour system information, zone position information and region size information；
And
The data format of the configuration information uses XML format or JSON format.
10. the web front end interface integrating device according to any one of claim 6 to 8, which is characterized in that described default
Web configuration file is static state Web file.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201710545475.2A CN109213528A (en) | 2017-07-06 | 2017-07-06 | Web front end interface integrating method and web front end interface integrating device |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201710545475.2A CN109213528A (en) | 2017-07-06 | 2017-07-06 | Web front end interface integrating method and web front end interface integrating device |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN109213528A true CN109213528A (en) | 2019-01-15 |
Family
ID=64992904
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201710545475.2A Pending CN109213528A (en) | 2017-07-06 | 2017-07-06 | Web front end interface integrating method and web front end interface integrating device |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN109213528A (en) |
Cited By (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN109783134A (en) * | 2019-01-17 | 2019-05-21 | 无锡华云数据技术服务有限公司 | Front end page configuration method, device and electronic equipment |
| CN110531906A (en) * | 2019-08-29 | 2019-12-03 | 深圳市鼎阳科技有限公司 | A kind of the forms management method and digital oscilloscope of display interface |
| CN112181419A (en) * | 2020-12-03 | 2021-01-05 | 成都极米科技股份有限公司 | Interface generation method and device and storage medium |
| CN112905938A (en) * | 2021-02-24 | 2021-06-04 | 上海二三四五网络科技有限公司 | Control method and device for dynamically adjusting H5 page height |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103164333A (en) * | 2011-12-16 | 2013-06-19 | 京信通信系统（中国）有限公司 | WEB testing method and WEB testing system of embedded device system and WEB server |
| US20130174075A1 (en) * | 2011-12-30 | 2013-07-04 | Industrial Technology Research Institute | Method for acquiring program parameters of component in graphical user interface of equipment and method for operating equipment |
| CN104375818A (en) * | 2013-10-11 | 2015-02-25 | 北京金辉东方科技有限公司 | System and method for achieving general data form inputting through configuration files |
| CN106484394A (en) * | 2016-09-13 | 2017-03-08 | 厦门兆慧网络科技有限公司 | A kind of fast software development system with double engines |
-
2017
- 2017-07-06 CN CN201710545475.2A patent/CN109213528A/en active Pending
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103164333A (en) * | 2011-12-16 | 2013-06-19 | 京信通信系统（中国）有限公司 | WEB testing method and WEB testing system of embedded device system and WEB server |
| US20130174075A1 (en) * | 2011-12-30 | 2013-07-04 | Industrial Technology Research Institute | Method for acquiring program parameters of component in graphical user interface of equipment and method for operating equipment |
| CN104375818A (en) * | 2013-10-11 | 2015-02-25 | 北京金辉东方科技有限公司 | System and method for achieving general data form inputting through configuration files |
| CN106484394A (en) * | 2016-09-13 | 2017-03-08 | 厦门兆慧网络科技有限公司 | A kind of fast software development system with double engines |
Non-Patent Citations (3)
| Title |
|---|
| BEAR.BIBEAULT等: "《jQuery实战 第3版》", 31 July 2016 * |
| 刘竹林: "《软件工程案例开发与实践》", 30 August 2009 * |
| 李晓峰: "Web工程前端性能优化", 《电子科技》 * |
Cited By (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN109783134A (en) * | 2019-01-17 | 2019-05-21 | 无锡华云数据技术服务有限公司 | Front end page configuration method, device and electronic equipment |
| CN110531906A (en) * | 2019-08-29 | 2019-12-03 | 深圳市鼎阳科技有限公司 | A kind of the forms management method and digital oscilloscope of display interface |
| CN110531906B (en) * | 2019-08-29 | 2021-08-03 | 深圳市鼎阳科技股份有限公司 | Window management method for display interface and digital oscilloscope |
| CN112181419A (en) * | 2020-12-03 | 2021-01-05 | 成都极米科技股份有限公司 | Interface generation method and device and storage medium |
| CN112181419B (en) * | 2020-12-03 | 2021-08-31 | 成都极米科技股份有限公司 | Interface generation method and device and storage medium |
| CN112905938A (en) * | 2021-02-24 | 2021-06-04 | 上海二三四五网络科技有限公司 | Control method and device for dynamically adjusting H5 page height |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN109213528A (en) | Web front end interface integrating method and web front end interface integrating device | |
| KR100716084B1 (en) | Layout adjustment method and apparatus | |
| CN103955366B (en) | Producing method of visualized website template | |
| US8578269B2 (en) | Information processing apparatus for performing a layout processing of sub-templates, information processing method and computer-readable medium | |
| JP2020521214A (en) | Form customization method and device | |
| US6668354B1 (en) | Automatic display script and style sheet generation | |
| US20060224607A1 (en) | Method and system for aggregating rules that define values for the same property associated with the same document element | |
| US20080275922A1 (en) | Rollback in a browser | |
| CN110032420A (en) | A kind of front end webpage design system and method | |
| US20070214136A1 (en) | Data mining diagramming | |
| Dwyer et al. | Exploration of networks using overview+ detail with constraint-based cooperative layout | |
| JP2010072927A (en) | Information processing apparatus, information processing method, program, and storage medium | |
| CN110263281A (en) | The adaptive device and method of page resolution in a kind of exploitation of data visualization | |
| CN104978195A (en) | Interface configuration device and method | |
| US20210089619A1 (en) | Methods to create and use responsive forms with externalized configurations and artifacts | |
| CN111158670A (en) | Visual auxiliary software development method and system | |
| JP2006221582A (en) | Information processor, method of controlling the same, and program | |
| KR20210040611A (en) | Method and apparatus for generating web page | |
| CN112652371A (en) | A nursing document designer and generate device for wisdom medical field | |
| EP1895407A1 (en) | HMI development support apparatus, HMI development support method and HMI development support program | |
| Hrabovskyi et al. | The methodology of developing a mobile application design for creating a genealogical tree | |
| US20100269036A1 (en) | System and method for designing and generating online stationery | |
| JPH06251007A (en) | Table data input device | |
| CN101281462B (en) | Report forms generating system and method | |
| JP7049173B2 (en) | Sign language CG translation editing equipment and programs |
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 | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20190115 |
|
| RJ01 | Rejection of invention patent application after publication |