CN110554896A - Interface design method based on preset picture pixel anchor point information processing - Google Patents

Interface design method based on preset picture pixel anchor point information processing Download PDF

Info

Publication number
CN110554896A
CN110554896A CN201910709355.0A CN201910709355A CN110554896A CN 110554896 A CN110554896 A CN 110554896A CN 201910709355 A CN201910709355 A CN 201910709355A CN 110554896 A CN110554896 A CN 110554896A
Authority
CN
China
Prior art keywords
interface
control
module
picture
layout
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.)
Granted
Application number
CN201910709355.0A
Other languages
Chinese (zh)
Other versions
CN110554896B (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.)
China Electrical Instruments (anhui) Co Ltd
Original Assignee
China Electrical Instruments (anhui) 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 China Electrical Instruments (anhui) Co Ltd filed Critical China Electrical Instruments (anhui) Co Ltd
Priority to CN201910709355.0A priority Critical patent/CN110554896B/en
Publication of CN110554896A publication Critical patent/CN110554896A/en
Application granted granted Critical
Publication of CN110554896B publication Critical patent/CN110554896B/en
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

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
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Image Generation (AREA)
  • Processing Or Creating Images (AREA)

Abstract

the invention discloses an interface design method based on preset picture pixel anchor point information processing, which belongs to the field of mobile communication instrument software interface design.

Description

Interface design method based on preset picture pixel anchor point information processing
Technical Field
the invention belongs to the field of software interface design of mobile communication instruments, and particularly relates to an interface design method based on preset picture pixel anchor point information processing.
Background
With the explosive growth of mobile communication technology, related fields have also been rapidly developed. The communication test is used as a predecessor of the mobile communication industry, and the role of the test instrument as a key link of the communication test in the continuous updating and iteration is particularly important in promoting the rapid development of the industry. In the process, the software products are also more fiercely updated, the design and development requirements of the communication instrument software are undoubtedly increased, the development period of some test instruments is possibly less than three months from the bottom to the delivery, and the requirements on interface design modules with large workload and heavy tasks are higher. Moreover, with the explosive technical parameter setting interaction requirements brought by the new technology, the software is required to have the interface interaction capability of simple operation and large amount of complex and rich information, which increases the requirements on the complex combined design aspect of the software. In the aspect of comparing foreign instrument software, foreign instruments have rich and complex interface interaction capacity, monopoly bind the operation habit of market users, and complex component module technology cannot catch up and surpass the operation habit of domestic instrument manufacturers in a short time, so that a great barrier effect is formed on the design of instrument interfaces of people, and great pressure is caused. Therefore, how to form a mature interface design method with the characteristics of flexibility, universality, expandability, strong self-adaption and the like in a short time has important significance for occupying the market of instruments and meters.
generally, mainstream interface design integrated development platforms such as VS, QT and the like also support visual view modes to design the UI, but the layout of the mode is fixed, and the effect designed based on the basic control of the platform is limited, which is far from the rich effect of similar instruments abroad. Generally, to realize similar functions, a self-drawing design must be performed from a bottom layer control to achieve a certain visualization effect, but the method has a huge workload, the self-drawing design of the used control module needs to be accumulated over the years, the requirement on developers is high, rapid development of people in different layers is difficult, and self-drawing processing cannot be performed at all due to platform limitations and the like in many scenes. Meanwhile, the control display designed by the method can not be adaptive to the requirements of different instrument screen resolutions, namely, the controls in certain areas can be stacked together under different screen resolutions, and the personalized requirements of dynamic adjustment and the like of displaying each area control on the UI interface can not be supported without compiling in the aspect of expansion. Therefore, how to perform method design processing aiming at the defects is a key point of the whole design method to finally realize interface development with rich effect, strong adaptability, strong expansibility and universality and flexibility.
Disclosure of Invention
aiming at the technical problems in the prior art, the invention provides an interface design method based on preset picture pixel anchor point information processing, which is reasonable in design, overcomes the defects of the prior art and has a good effect.
In order to achieve the purpose, the invention adopts the following technical scheme:
an interface design method based on preset picture pixel anchor point information processing specifically comprises the following steps:
step 1: an interface resource design process; the method specifically comprises the following steps:
Step 1.1: designing a first interface module;
Firstly, designing an interface requirement of a first interface module, designing a related interactive interface module for interactive control in order to realize a set user function, wherein the interface layout is a specific display view for planning the whole display area, and the first interface module is a total interface module which completes the design requirement at the early stage and comprises a main interface module and other sub-interface modules; in a common basic layout of the main interface, further specification is carried out on each area, including the design of a view for displaying a curve, a list box and a button control; in the design of the sub-interface module, a pop-up dialog box design is included;
Step 1.2: designing an interface layout and control decomposition processing module;
The interface layout and control decomposition processing module is configured to decompose the first interface module, and comprises an interface layout module, a module for planning and decomposing sub-controls in the interface and a module for arranging the sub-controls into an order;
the step is to perform related layout arrangement and control use classification further design on the interface schematic diagram designed in the step 1.1, a plurality of interfaces need to be designed in the complex interface design process, the linkage interaction of each interface needs to be further developed and designed from the realization angle, and a design scheme with detailed interface layout and control layout arrangement is formed;
step 1.3: designing a resource presetting processing module;
the resource presetting processing module is configured for presetting the resources for the layout and the control in the classified arrangement;
in the step, each interface in the step 1.2 is independently designed, and the relevance design is carried out aiming at the jump among a plurality of interfaces; when the single interface is designed, the design of a corresponding resource preset processing module is completed by adopting a preset picture anchor point pixel information processing mode according to the layout and the control; the method specifically comprises the following steps: a single interface generates a picture template of a preset picture pixel anchor point, a control information description text and a resource picture file according to a set rule, and the processing process can realize the conversion of a universal interface and the conversion of a complex embedded interface;
step 1.4: designing a resource group module;
after the conversion processing in step 1.3, a plurality of resource group modules are finally generated, wherein each resource group module mainly comprises a group of picture templates of preset picture pixel anchors, a control information description text and a resource picture file, and if the interface module comprises a plurality of interfaces, a plurality of groups of similar picture templates of preset picture pixel anchors, control information description texts and resource picture files exist in the resource group module; the resource group module can be used as a combination unit to be combined randomly and is suitable for transplanting different projects and different platforms;
Step 2: the interface realizes the self-drawing processing process; the method specifically comprises the following steps:
step 2.1: designing a resource group module;
The resource group module comprises a picture template containing preset picture pixel anchor points, a control information description text and related resource pictures;
In the process of realizing self-drawing processing on the interface, firstly, calling and loading a resource group module, namely, extracting and processing the resource of the resource group module;
Step 2.2: designing a resource group driving layer processing module;
The resource group driving layer processing module is configured to perform uniform mapping analysis processing on pictures and texts in the resource group module and convert the pictures and the texts into corresponding interface layout and control information;
The resource group driving layer processing module mainly extracts resources in the step 2.1 module, aims to convert the resources into corresponding interface layout and control information, and can dynamically perform dynamic adjustment and display use of various interface combinations through the abstract processing of the driving layer, and the concrete process comprises the following steps: the method comprises the steps that a picture template of a picture pixel anchor point and a control information description text are preset, reverse processing is carried out according to set rules, the layout and control position parameters of an overall interface are obtained, dynamic loading of a resource picture file path is carried out aiming at a self-drawing control processing process, a resource group driving layer processing module is a universal processing module, once development is completed, all resource group units can be processed, and the resource group driving layer processing module is equivalent to an analyzer for analyzing and executing the resource group units in real time;
step 2.3: designing an interface layout and control position information module;
An interface layout and control information module configured to provide parameter information for a second interface module; providing an area position and a self-drawing background picture path in the interface self-drawing process and an area position and a self-drawing chartlet in the control drawing process for an interface drawing processing module; providing area information of related sub-controls for an interface control response processing module, and assisting in interactive response operation including single click, double click and activation;
step 2.4: designing a second interface module;
the second interface module comprises an interface drawing processing module and an interface control response processing module; wherein the content of the first and second substances,
the interface drawing processing module is configured to perform interface layout drawing and related drawing processing of the self-drawing control on the interface layout and the control information; the interface drawing processing module maintains the self-drawing refreshing work of the whole interface, including the map refreshing operation of each sub-control in the processes of clicking, double clicking and activating;
the interface control response processing module comprises a control interaction monitoring module and a general control response function module, and is configured to perform control interaction response processing according to the interface layout and the control information and respond to an interaction control process comprising a mouse and a keyboard of a user; the interface control response processing module performs unified maintenance processing on the corresponding sub-controls when the user performs single-click, double-click and right-click operations;
the control interaction monitoring module monitors and maintains the interface and the control interaction area in the step 2.3, identifies user interaction response, transmits related parameters to the universal control response function module after the interaction is completed, uniformly manages the area parameters, namely response functions of all the user-defined controls, and associates the area parameters with a specific control response processing process through control numbers of the description texts in the resource group module;
and step 3: and implementing the interactive response design process with the user at the interface.
preferably, in step 1.3, the established rule indicates that parameters including the position and the area size of the interface layout and the interface sub-control are indicated in the template picture in a pixel point marking mode, that is, the upper left corner of the control is positioned as the position of the control, a customized pixel point RGB1 value is marked, after the position is positioned, the point is used as a reference, a plurality of pixel points are moved to the right to mark the right boundary of the control by using an RGB2 value, and similarly, the RGB1 value is used as a reference point, a plurality of pixel points are moved to the lower to mark the lower boundary of the control by using an RGB2 value, once the interface layout and the position and the area rule of the interface sub-control are designed, the area control information description text block is designed according to the relevant specification mode of the area control including the type, the name, the display state, the direction and the used bitmap path.
preferably, in step 1.3, the picture template of the preset picture pixel anchor point contains interface layout and control position area size information; the template is presented in a picture mode, when pixels of the picture template are designed in a traversing mode, the pixels are in two directions, namely, first row, second row and first row, and the two modes can carry out anchor point processing on the pixels of the image, but a mode must be specified in a control information description text, so that the relevant information can be extracted when a later-stage interface realizes self-drawing; the preset picture pixel anchor mainly refers to two anchor pixel points, namely an auxiliary anchor reference pixel point and an auxiliary region reference anchor pixel point, and respectively contains position information and region size information of a control.
preferably, in step 1.3, the control information description text is a text module custom-designed for the layout control designed in the preset picture anchor point picture template, and the text module internally contains the commonly used information parameters for describing the control, including the control type, name, display state, direction and used bitmap path.
preferably, in step 1.3, the resource picture files are mainly an overall layout background picture, multiple self-drawing state pictures of the control and a self-defined LOGO picture used in the layout and control design process, and the picture files exist in an independent picture mode, and the path of the picture files is mapped by being associated to the control information description text control module.
preferably, in step 1.3, the universal interface includes a curve drawing control, a static text control, an edit box control, a check box control and a button control, and the text process can be described by generating a responsive preset picture pixel anchor point picture template and control information according to a predetermined rule.
Preferably, in step 1.3, the complex embedded interface includes a word interface module, the sub-interface module includes a property page control, a wave curve control and a result parameter control, and a corresponding control information description text process of the multi-interface nesting mode are also nested with each other by generating a responsive preset picture pixel anchor point picture template and a control information description text process according to a set rule.
The invention has the following beneficial technical effects:
An interface design method based on preset picture pixel anchor point information processing utilizes a full interface and control mapping self-drawing processing, a preset picture pixel anchor point picture template processing method and a design extensible control response mechanism to complete a resource group abstraction function, separates interface resource design and self-drawing processing, not only realizes strong extensibility, strong self-adaptive adjustment of controls, flexibility, universality and the like of interface design, provides a practical design method for enriching the drawing display design of complex interfaces, is also suitable for other similar interface drawing display systems, and has strong universality and reference.
Drawings
FIG. 1 is a schematic diagram of a conventional main interface according to the present invention.
Fig. 2 is a schematic block diagram of an interface design based on preset picture pixel anchor point information processing according to the present invention.
FIG. 3 is a schematic diagram of the internal association of the resource group module according to the present invention.
Fig. 4 is a control anchor point and control information description mapping diagram in the general layout mode of the present invention.
FIG. 5 is a control anchor point and control information description mapping diagram in the complex interface layout mode of the present invention.
FIG. 6 is a diagram illustrating a general control response processing procedure according to the present invention.
Detailed Description
the invention is described in further detail below with reference to the following figures and detailed description:
In the interface module, a conventional main interface is shown in fig. 1. For the design of an interface module, as shown in fig. 2, the design process mainly includes two major parts, namely an interface resource design process and an interface self-drawing implementation process, and is an interface design schematic block diagram based on preset picture pixel anchor point information processing. The interface resource design process mainly comprises a first interface module, an interface layout and control decomposition processing module, a resource preprocessing module and a resource group module. The interface self-drawing processing process part mainly comprises a second interface module, an interface layout and control information module, a resource group driving layer processing module and a resource group module. The separation of the self-drawing processing process is realized through the interface resource design process and the interface, the interface design process can be realized more flexibly, and the expansion, the self-adaptive adjustment and the complex self-drawing processing capability are supported.
an interface design method based on preset picture pixel anchor point information processing specifically comprises the following steps:
step 1: an interface resource design process; the method specifically comprises the following steps:
step 1.1: designing a first interface module;
firstly, designing an interface requirement of a first interface module, designing a related interactive interface module for interactive control in order to realize a set user function, wherein the interface layout is a specific display view for planning the whole display area, and the first interface module is a total interface module which completes the design requirement at the early stage and comprises a main interface module and other sub-interface modules; in a common basic layout of the main interface, further specification is carried out on each area, including the design of a view for displaying a curve, a list box and a button control; in the design of the sub-interface module, a pop-up dialog box design is included;
step 1.2: designing an interface layout and control decomposition processing module;
The interface layout and control decomposition processing module is configured to decompose the first interface module, and comprises an interface layout module, a module for planning and decomposing sub-controls in the interface and a module for arranging the sub-controls into an order;
the step is to perform related layout arrangement and control use classification further design on the interface schematic diagram designed in the step 1.1, a plurality of interfaces need to be designed in the complex interface design process, the linkage interaction of each interface needs to be further developed and designed from the realization angle, and a design scheme with detailed interface layout and control layout arrangement is formed;
Step 1.3: designing a resource presetting processing module;
The resource presetting processing module is configured for presetting the resources for the layout and the control in the classified arrangement;
in the step, each interface in the step 1.2 is independently designed, and the relevance design is carried out aiming at the jump among a plurality of interfaces; when the single interface is designed, the design of a corresponding resource preset processing module is completed by adopting a preset picture anchor point pixel information processing mode according to the layout and the control; the method specifically comprises the following steps: a single interface generates a picture template of a preset picture pixel anchor point, a control information description text and a resource picture file according to a set rule, and the processing process can realize the conversion of a universal interface and the conversion of a complex embedded interface;
the established rule refers to indicating parameters including interface layout and interface sub-control positions and area sizes in a template picture through a pixel point marking mode, namely positioning the upper left corner of the control as the position of the control, marking with a customized pixel point RGB1 value, after the position is positioned, taking the point as reference, moving a plurality of pixel points to the right to mark the right boundary of the control by using an RGB2 value, and similarly taking an RGB1 value as a reference point, moving a plurality of pixel points to the down to mark the lower boundary of the control by using an RGB2 value, and designing the area control information description text block according to relevant standard modes including control types, names, display states, directions and used bitmap paths aiming at the area control once the interface layout and the position and area rule of the interface sub-control are designed.
Presetting a picture template of a picture pixel anchor point, wherein the picture template comprises interface layout and control position area size information; the template is presented in a picture mode, when pixels of the picture template are designed in a traversing mode, the pixels are in two directions, namely, first row, second row and first row, and the two modes can carry out anchor point processing on the pixels of the image, but a mode must be specified in a control information description text, so that the relevant information can be extracted when a later-stage interface realizes self-drawing; the preset picture pixel anchor mainly refers to two anchor pixel points, namely an auxiliary anchor reference pixel point and an auxiliary region reference anchor pixel point, and respectively contains position information and region size information of a control.
The control information description text is a text module which is designed by self-defining aiming at a layout control designed in a preset picture pixel anchor point picture template, and the text module internally contains common information parameters for describing the control, including the type, name, display state, direction and used bitmap path of the control.
the resource picture files are mainly an overall layout background picture, a plurality of self-drawing state pictures of the control and a self-defined LOGO picture which are used in the layout and control design process, the picture files exist in an independent picture mode, and the path of the picture files is associated to the control information description text control module for mapping.
Fig. 4 is an interface conversion process under a general layout, where a designed interface includes a curve drawing control, a static text control, an edit box control, a check box control, and a button control, and a text process can be described by generating a picture template of a preset picture pixel anchor point and control information in response according to a predetermined rule.
FIG. 5 is an interface conversion process under a complex layout, where a designed interface includes a word interface module, sub-interface modules include property page controls, wave curve controls, and result parameter controls, and a responsive preset picture pixel anchor point picture template and control information description text process can be generated according to established rules, and corresponding control information description text processes are also nested.
step 1.4: designing a resource group module;
After the conversion processing in step 1.3, a plurality of resource group modules are finally generated, wherein each resource group module mainly comprises a group of picture templates of preset picture pixel anchors, a control information description text and a resource picture file, and if the interface module comprises a plurality of interfaces, a plurality of groups of similar picture templates of preset picture pixel anchors, control information description texts and resource picture files exist in the resource group module; the resource group module can be used as a combination unit to be combined randomly and is suitable for transplanting different projects and different platforms;
The incidence relation inside the resource group module of the invention is shown in fig. 3, and a resource group module is formed by combining a template picture, an information text and a resource picture. The control information description text records RGB value information of reference pixel points of a pixel preset anchor point information picture template of the control, and information such as resource picture files used by the control.
step 2: the interface realizes the self-drawing processing process; the method specifically comprises the following steps:
Step 2.1: designing a resource group module;
the resource group module comprises a picture template containing preset picture pixel anchor points, a control information description text and related resource pictures;
in the process of realizing self-drawing processing on the interface, firstly, calling and loading a resource group module, namely, extracting and processing the resource of the resource group module;
Step 2.2: design resource group driving layer processing module
The resource group driving layer processing module is configured to perform uniform mapping analysis processing on pictures and texts in the resource group module and convert the pictures and the texts into corresponding interface layout and control information;
The resource group driving layer processing module mainly extracts resources in the step 2.1 module, aims to convert the resources into corresponding interface layout and control information, and can dynamically perform dynamic adjustment and display use of various interface combinations through the abstract processing of the driving layer, and the concrete process comprises the following steps: the method comprises the steps that a picture template of a picture pixel anchor point and a control information description text are preset, reverse processing is carried out according to set rules, the layout and control position parameters of an overall interface are obtained, dynamic loading of a resource picture file path is carried out aiming at a self-drawing control processing process, a resource group driving layer processing module is a universal processing module, once development is completed, all resource group units can be processed, and the resource group driving layer processing module is equivalent to an analyzer for analyzing and executing the resource group units in real time;
Step 2.3: designing an interface layout and control position information module;
an interface layout and control information module configured to provide parameter information for a second interface module; providing an area position and a self-drawing background picture path in the interface self-drawing process and an area position and a self-drawing chartlet in the control drawing process for an interface drawing processing module; providing area information of related sub-controls for an interface control response processing module, and assisting in interactive response operation including single click, double click and activation;
Step 2.4: designing a second interface module;
the interface module comprises an interface drawing processing module and an interface control response processing module; wherein the content of the first and second substances,
the interface drawing processing module is configured to perform interface layout drawing and related drawing processing of the self-drawing control on the interface layout and the control information; the interface drawing processing module maintains the self-drawing refreshing work of the whole interface, including the map refreshing operation of each sub-control in the processes of clicking, double clicking and activating;
the interface control response processing module comprises a control interaction monitoring module and a general control response function module, and is configured to perform control interaction response processing according to the interface layout and the control information and respond to an interaction control process comprising a mouse and a keyboard of a user; the interface control response processing module performs unified maintenance processing on the corresponding sub-controls when the user performs single-click, double-click and right-click operations;
fig. 6 is a schematic diagram of a designed general control response processing process, which mainly includes a control interaction monitoring module, a general control response processing module, and other processes, where the control interaction monitoring module monitors, maintains, and identifies a user interaction response for an interface and a control interaction region in the module in step (3), and once the interaction is completed, transmits relevant parameters to the general control response function module, the region parameters, i.e., response functions of all custom controls, are uniformly managed, and then a control number describing a text in a resource group can be associated with a specific control response processing process, so that it is ensured that a custom extended function of a user is realized.
and step 3: and implementing the interactive response design process with the user at the interface.
It is to be understood that the above description is not intended to limit the present invention, and the present invention is not limited to the above examples, and those skilled in the art may make modifications, alterations, additions or substitutions within the spirit and scope of the present invention.

Claims (7)

1. an interface design method based on preset picture pixel anchor point information processing is characterized in that: the method specifically comprises the following steps:
step 1: an interface resource design process; the method specifically comprises the following steps:
Step 1.1: designing a first interface module;
Firstly, designing an interface requirement of a first interface module, designing a related interactive interface module for interactive control in order to realize a set user function, wherein the interface layout is a specific display view for planning the whole display area, and the first interface module is a total interface module which completes the design requirement at the early stage and comprises a main interface module and other sub-interface modules; in a common basic layout of the main interface, further specification is carried out on each area, including the design of a view for displaying a curve, a list box and a button control; in the design of the sub-interface module, a pop-up dialog box design is included;
Step 1.2: designing an interface layout and control decomposition processing module;
the interface layout and control decomposition processing module is configured to decompose the first interface module, and comprises an interface layout module, a module for planning and decomposing sub-controls in the interface and a module for arranging the sub-controls into an order;
The step is to perform related layout arrangement and control use classification further design on the interface schematic diagram designed in the step 1.1, a plurality of interfaces need to be designed in the complex interface design process, the linkage interaction of each interface needs to be further developed and designed from the realization angle, and a design scheme with detailed interface layout and control layout arrangement is formed;
step 1.3: designing a resource presetting processing module;
the resource presetting processing module is configured for presetting the resources for the layout and the control in the classified arrangement;
In the step, each interface in the step 1.2 is independently designed, and the relevance design is carried out aiming at the jump among a plurality of interfaces; when the single interface is designed, the design of a corresponding resource preset processing module is completed by adopting a preset picture anchor point pixel information processing mode according to the layout and the control; the method specifically comprises the following steps: a single interface generates a picture template of a preset picture pixel anchor point, a control information description text and a resource picture file according to a set rule, and the processing process can realize the conversion of a universal interface and the conversion of a complex embedded interface;
step 1.4: designing a resource group module;
After the conversion processing in step 1.3, a plurality of resource group modules are finally generated, wherein each resource group module mainly comprises a group of picture templates of preset picture pixel anchors, a control information description text and a resource picture file, and if the interface module comprises a plurality of interfaces, a plurality of groups of similar picture templates of preset picture pixel anchors, control information description texts and resource picture files exist in the resource group module; the resource group module can be used as a combination unit to be combined randomly and is suitable for transplanting different projects and different platforms;
step 2: the interface realizes the self-drawing processing process; the method specifically comprises the following steps:
Step 2.1: designing a resource group module;
the resource group module comprises a picture template containing preset picture pixel anchor points, a control information description text and related resource pictures;
In the process of realizing self-drawing processing on the interface, firstly, calling and loading a resource group module, namely, extracting and processing the resource of the resource group module;
step 2.2: designing a resource group driving layer processing module;
the resource group driving layer processing module is configured to perform uniform mapping analysis processing on pictures and texts in the resource group module and convert the pictures and the texts into corresponding interface layout and control information;
The resource group driving layer processing module mainly extracts resources in the step 2.1 module, aims to convert the resources into corresponding interface layout and control information, and can dynamically perform dynamic adjustment and display use of various interface combinations through the abstract processing of the driving layer, and the concrete process comprises the following steps: the method comprises the steps that a picture template of a picture pixel anchor point and a control information description text are preset, reverse processing is carried out according to set rules, the layout and control position parameters of an overall interface are obtained, dynamic loading of a resource picture file path is carried out aiming at a self-drawing control processing process, a resource group driving layer processing module is a universal processing module, once development is completed, all resource group units can be processed, and the resource group driving layer processing module is equivalent to an analyzer for analyzing and executing the resource group units in real time;
step 2.3: designing an interface layout and control position information module;
an interface layout and control information module configured to provide parameter information for a second interface module; providing an area position and a self-drawing background picture path in the interface self-drawing process and an area position and a self-drawing chartlet in the control drawing process for an interface drawing processing module; providing area information of related sub-controls for an interface control response processing module, and assisting in interactive response operation including single click, double click and activation;
Step 2.4: designing a second interface module;
the second interface module comprises an interface drawing processing module and an interface control response processing module; wherein the content of the first and second substances,
the interface drawing processing module is configured to perform interface layout drawing and related drawing processing of the self-drawing control on the interface layout and the control information; the interface drawing processing module maintains the self-drawing refreshing work of the whole interface, including the map refreshing operation of each sub-control in the processes of clicking, double clicking and activating;
The interface control response processing module comprises a control interaction monitoring module and a general control response function module, and is configured to perform control interaction response processing according to the interface layout and the control information and respond to an interaction control process comprising a mouse and a keyboard of a user; the interface control response processing module performs unified maintenance processing on the corresponding sub-controls when the user performs single-click, double-click and right-click operations;
The control interaction monitoring module monitors and maintains the interface and the control interaction area in the step 2.3, identifies user interaction response, transmits related parameters to the universal control response function module after the interaction is completed, uniformly manages the area parameters, namely response functions of all the user-defined controls, and associates the area parameters with a specific control response processing process through control numbers of the description texts in the resource group module;
and step 3: and implementing the interactive response design process with the user at the interface.
2. the interface design method based on preset picture pixel anchor point information processing according to claim 1, characterized in that: in step 1.3, the established rule indicates that parameters including the interface layout and the position and the area size of the interface sub-control are indicated in a template picture in a pixel point marking mode, namely, the upper left corner of the control is positioned as the position of the control, a customized pixel point RGB1 value is marked, after the position is positioned, the point is taken as a reference, a plurality of pixel points are moved to the right to mark the right boundary of the control by using an RGB2 value, similarly, the RGB1 value is taken as a reference point, a plurality of pixel points are moved downwards to mark the lower boundary of the control by using an RGB2 value, and once the position and the area rule of the interface layout and the interface sub-control are designed, the area control is designed according to a relevant standard mode including the type, the name, the display state, the direction and the used bitmap path.
3. the interface design method based on preset picture pixel anchor point information processing according to claim 1, characterized in that: in step 1.3, the picture template of the preset picture pixel anchor point contains interface layout and control position area size information; the template is presented in a picture mode, when pixels of the picture template are designed in a traversing mode, the pixels are in two directions, namely, first row, second row and first row, and the two modes can carry out anchor point processing on the pixels of the image, but a mode must be specified in a control information description text, so that the relevant information can be extracted when a later-stage interface realizes self-drawing; the preset picture pixel anchor mainly refers to two anchor pixel points, namely an auxiliary anchor reference pixel point and an auxiliary region reference anchor pixel point, and respectively contains position information and region size information of a control.
4. the interface design method based on preset picture pixel anchor point information processing according to claim 1, characterized in that: in step 1.3, the control information description text is a text module custom-designed for the layout control designed in the preset picture pixel anchor point picture template, and contains the commonly used information parameters for describing the control, including the control type, name, display state, direction and used bitmap path.
5. the interface design method based on preset picture pixel anchor point information processing according to claim 1, characterized in that: in step 1.3, the resource picture files are mainly an overall layout background picture, a plurality of self-drawing state pictures of the control and a self-defined LOGO picture used in the layout and control design process, the picture files exist in an independent picture mode, and the path of the picture files is associated to the control information description text control module for mapping.
6. the interface design method based on preset picture pixel anchor point information processing according to claim 1, characterized in that: in step 1.3, the universal interface includes a curve drawing control, a static text control, an edit box control, a check box control and a button control, and the text process can be described by generating a picture template of the anchor point of the preset picture pixel and the control information according to the established rule.
7. The interface design method based on preset picture pixel anchor point information processing according to claim 1, characterized in that: in step 1.3, the complex embedded interface comprises a word interface module, the sub-interface module internally comprises a property page control, a wave curve control and a result parameter control, a corresponding preset picture pixel anchor point picture template and a control information description text process can be generated according to a set rule, and the corresponding control information description text processes of the multi-interface nesting mode are mutually nested.
CN201910709355.0A 2019-08-02 2019-08-02 Interface design method based on preset picture pixel anchor point information processing Active CN110554896B (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201910709355.0A CN110554896B (en) 2019-08-02 2019-08-02 Interface design method based on preset picture pixel anchor point information processing

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201910709355.0A CN110554896B (en) 2019-08-02 2019-08-02 Interface design method based on preset picture pixel anchor point information processing

Publications (2)

Publication Number Publication Date
CN110554896A true CN110554896A (en) 2019-12-10
CN110554896B CN110554896B (en) 2022-09-13

Family

ID=68736891

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201910709355.0A Active CN110554896B (en) 2019-08-02 2019-08-02 Interface design method based on preset picture pixel anchor point information processing

Country Status (1)

Country Link
CN (1) CN110554896B (en)

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN104731584A (en) * 2015-02-26 2015-06-24 武汉爱科唯自动化科技有限公司 Human-machine interface customizable configuration design method for open type numerical control system
JP2015534145A (en) * 2012-08-14 2015-11-26 マイクロソフト テクノロジー ライセンシング,エルエルシー User interface control framework for stamping out controls using declarative templates
CN106569801A (en) * 2016-10-18 2017-04-19 中国运载火箭技术研究院 Complex parameter-based configuration display control system
CN108008871A (en) * 2016-10-27 2018-05-08 阿里巴巴集团控股有限公司 A kind of page generation method and device

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
JP2015534145A (en) * 2012-08-14 2015-11-26 マイクロソフト テクノロジー ライセンシング,エルエルシー User interface control framework for stamping out controls using declarative templates
CN104731584A (en) * 2015-02-26 2015-06-24 武汉爱科唯自动化科技有限公司 Human-machine interface customizable configuration design method for open type numerical control system
CN106569801A (en) * 2016-10-18 2017-04-19 中国运载火箭技术研究院 Complex parameter-based configuration display control system
CN108008871A (en) * 2016-10-27 2018-05-08 阿里巴巴集团控股有限公司 A kind of page generation method and device

Non-Patent Citations (2)

* Cited by examiner, † Cited by third party
Title
SHENG-MING WANG: "Developing Hybrid Internet Broadcast Television user interface base on user experience design principle", 《IEEE》 *
周小舟: "基于用户认知的大数据可视化视觉呈现方法研究", 《中国优秀博士学位论文全文数据库》 *

Also Published As

Publication number Publication date
CN110554896B (en) 2022-09-13

Similar Documents

Publication Publication Date Title
CA2116772C (en) Procedural user interface
Weinand et al. Design and implementation of ET++, a seamless object-oriented application framework
US9892531B2 (en) Chart data-binding design time user experience with dynamic sample generation
US7096454B2 (en) Method for gesture based modeling
US8434019B2 (en) Apparatus and method for positioning windows on a display
CN102221993B (en) The declarative definition of complex user interface Status Change
Davis HIPO (hierarchy plus input-process-output)
DE112008000512T5 (en) Method and system for generating a control system user interface
Weinand et al. ET++-a portable, homogenous class library and application framework
CN101276277A (en) Source code generating device
CN111176642B (en) Interactive visualization processing system based on plane graph and application method
US7239316B1 (en) Method and apparatus for graphically manipulating data tables
Bouchlaghem et al. Integrating product and process information in the construction sector
Tsandilas StructGraphics: Flexible visualization design through data-agnostic and reusable graphical structures
Collignon et al. Model-driven engineering of multi-target plastic user interfaces
CN110554896B (en) Interface design method based on preset picture pixel anchor point information processing
CN112131300A (en) Cross-platform data making method and device based on Flutter
CN101303663A (en) Simulation test method for digital set-top box software development
US20120117496A1 (en) Declarative and multi-mode wizard framework
CN115691772A (en) Operation visualization system and corresponding computer device and storage medium
US10725636B2 (en) Modification, manipulation and rendering of object attributes
US9372844B2 (en) Automatically generating a business process flow GUI using a symbolic annotation language
US10672287B2 (en) Method and system for managing assessments
van den Bos et al. IDECAP interactive pictorial information system for demographic and environmental planning applications
CN115756468A (en) Composite plotting icon design software based on QT graphic framework

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
CB02 Change of applicant information
CB02 Change of applicant information

Address after: 233010 no.1300, Yinghe Road, Yuhui District, Bengbu City, Anhui Province

Applicant after: CLP kesiyi Technology (Anhui) Co.,Ltd.

Address before: 233010 no.1300, Yinghe Road, Yuhui District, Bengbu City, Anhui Province

Applicant before: CETC INSTRUMENTATION (ANHUI) Co.,Ltd.

GR01 Patent grant
GR01 Patent grant