XML file-based human-computer interface system applied to Baifu PLC

Through the human-machine interface system based on XML files, the human-machine interface and programs of Beckhoff PLC are decoupled, and the Javascript driver and TwinCAT communication interface are used to generate a graphical interface, which solves the flexibility and operability of interface design in the existing technology, and improves the maintainability and visual effect of the interface.

CN120255883APending Publication Date: 2025-07-04RUNYANG ENERGY TECH CO LTD
View PDF 0 Cites 0 Cited by

Patent Information

Application Number
CN202410007252.0
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2024-01-03
Publication Date
2025-07-04

AI Technical Summary

Technical Problem

The existing Beckhoff PLC's human-machine interface system is difficult to modify the layout, controls and data display form after design, and is coupled with PLC applications, resulting in low flexibility, high operability and poor visual effects.

Method used

Using a human-machine interface system based on XML files, the interface configuration information is loaded and parsed through Javascript development drivers, single-page application method and data driver mode, combined with TwinCAT communication interface for decoupling, and canvas and svg technology are used to generate graphical interfaces.

Benefits of technology

It realizes decoupling of the interface and the program, reduces the design difficulty, improves the maintainability and operability of the interface, enriches the interface presentation form, and improves the visual effect.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN120255883A_ABST
    Figure CN120255883A_ABST
Patent Text Reader

Abstract

The invention discloses an XML (Extensible Markup Language) file-based human-computer interface system applied to a Baifu PLC (Programmable Logic Controller), which comprises the following steps of: 1, according to an application object and a development target, establishing an XML configuration file containing contents such as an interface layout, a page, a page display form and the like; 2, a driver based on the XML file format is developed, and the configuration information in the step 1 is loaded and analyzed; step 3, carrying out secondary packaging on the TwinCAT Javascript of the Baifu, and mapping the data information loaded in the step 2 to a TwinCAT communication interface; 4, developing a webpage driving program by adopting a single-page application mode and a data driving mode, and rendering and generating an interface by using the configuration information preloaded in the step 2; according to the method, the XML file is adopted to realize interface configuration, so that the difficulty of interface design is reduced, and the maintainability of the interface is improved; based on a Web mode and various components provided by the system, the interface display form is richer, and the sense is more comfortable.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention relates to the technical field of human - machine interface interaction, and particularly to a human - machine interface system based on XML files applied to Beckhoff PLC. Background Art

[0002] Currently, for the human - machine interface of the main control system with Beckhoff (Beifu) PLC as the controller in the wind power industry, the following two implementation methods are usually adopted:

[0003] 1. Using the HMI embedded in Beckhoff (Beifu) PLC as the kernel, and performing screen editing in the visualization editor of the PLC programming software TwinCAT; however, in this method, the screen runs in the PLC as part of the program; the screen layout, individual visualization elements, and the attributes (position, size, style, color) of all visualization objects will be defined in the corresponding configuration dialog box and object property dialog box; all front - end displays (values, characters, colors, etc.) are bound to PLC variables through attribute settings. Any modification of the screen must modify the attributes of its related visualization objects, which is cumbersome and not intuitive; the upgrade of the screen must upgrade the main control program, resulting in problems in the version control of the main control program.

[0004] 2. Using a third - party visualization UI interface design software to edit the screen, and the generated screen system realizes variable interaction with the PLC through communication; although this method makes the screen and the program independent and run independently, it still has the technical problems of Method 1.

[0005] For Method 1 and Method 2, once the screen is designed and produced, without modifying it through its visualization editing software UI (or editor), the screen and the screen object controls cannot be added or deleted; the screen layout and the screen control layout cannot be changed (added, deleted, arrangement order, sub - area size, etc.); the data display form of the screen object and the control - associated variables cannot be modified; the flexibility is low and the operation cost is high. In addition, the visual effect of the screen is poor, and generally does not have the ability to be presented across platforms; it is completely data - driven to ensure the consistency of visual and operation data. Summary of the Invention

[0006] In order to solve the problems of the prior art, the present invention proposes a human - machine interface system based on XML files applied to Beckhoff PLC.

[0007] Specifically, the present application relates to a human - machine interface system based on XML files applied to Beckhoff PLC, including the following steps:

[0008] Step 1: According to the application object and development goal, and in accordance with the XML file design rules, establish an XML configuration file including interface layout, pages, and page presentation forms, etc.

[0009] Step 2: Develop a driver based on the XML file format using Javascript, load and parse the configuration information in Step 1, and form a preloading of interface information;

[0010] Step 3: Re-encapsulate the TwinCAT Javascript of Beckhoff, map the data information loaded in Step 2 to the TwinCAT communication interface, and the TwinCAT communication interface uses the http protocol for polling communication;

[0011] Step 4: Develop a web page driver in the form of a single-page application and a data-driven mode, and use the configuration information preloaded in Step 2 to render and generate an interface;

[0012] Further, the XML configuration file in Step 1 includes an interface system configuration, a data variable point table, a variable value information mapping table, and a page rendering configuration;

[0013] Further, the interface system configuration includes a user configuration sub-tag User Config, a service configuration sub-tag Service Config, and a user list sub-tag Users;

[0014] The data variable point table includes multiple unit position page sub-tags, each unit contains multiple group sub-tags, and each group contains multiple element data sub-tags;

[0015] Each of the variable value information mapping tables includes a name, a Chinese name, an English name, and a variable enumeration value;

[0016] In the page rendering configuration, each page corresponds to a layout, each interface can have multiple sub-pages page, and each sub-page can be divided into several rows row, and each row can be divided into multiple columns col.

[0017] Further, in Step 2, use Javascript to develop a data-driven program to load and parse the elements data, group, unit position, template of the interface configuration file based on the XML file format and their different combined data attributes, so as to realize the preloading of information such as the interface, the composition and layout of the interface, the interface components and the display form.

[0018] Further, load the data variable point table configuration information through the data-driven program; load the variable value information mapping table configuration information through the data-driven program as the display content information of the fault code and the user-defined enumeration class control; load the page rendering configuration information through the data-driven program as the page layout information.

[0019] Further, after loading the element data information in the XML configuration information through the driver program in step 1 in step 3, the mapping between the XML configuration data and the TwinCAT communication interface is directly implemented through the encapsulation interface. The TwinCAT communication interface uses the HTTP protocol to perform polling communication with the TwinCAT ADS WebService.

[0020] Further, after the secondary encapsulation, the communication driver program directly maps the relevant attributes of the elements in the configuration information to the driver interface API, realizing the automatic matching of the custom data attributes of the page configuration and the communication driver API.

[0021] Further, in step 4, the interface is generated by driving with XML pre-loaded data; the graphical interface is generated by using the canvas technology and the svg technology.

[0022] Further, the web driver program renders the configuration information with the pre-loaded page, generates the web page, generates the layout of each page, and generates the page controls and their display forms and display contents.

[0023] The beneficial technical effects of this invention include: This invention fundamentally solves the problem of the coupling between the human-machine interface of the Beckhoff CX series PLC and the PLC application program, realizes the decoupling of the interface and the program, and designs and develops a data driver program by using the Javascript language to realize the loading and parsing of the user configuration XML file (including elements, groups, units, and templates and their different combination forms) containing information such as the UI interface layout, pages, and page display forms and contents; since the UI interface description is located outside the program code that controls the application behavior, the appearance of the application is completely decoupled from the program code that controls the application behavior;

[0024] At the same time, using the XML file to implement the interface configuration greatly reduces the difficulty of interface design and improves the maintainability of the interface; based on the Web method and various components provided by the system, the interface display form is more abundant and the sense is more comfortable. Description of the Drawings

[0025] Figure 1 : System flow framework diagram according to an embodiment of the present invention.

[0026] Figure 2 : System composition framework diagram according to an embodiment of the present invention. Detailed Embodiments

[0027] To make the objectives, technical solutions and advantages of the present invention clearer, the present invention will be further described in detail below with reference to the accompanying drawings. Apparently, the described embodiments are only a part of the embodiments of the present invention, rather than all of them. All other embodiments obtained by those of ordinary skill in the art based on the embodiments of the present invention without creative efforts belong to the scope of protection of the present invention.

[0028] As Figure 1 and 2 shown, a human-machine interface system based on XML files applied to Beckhoff PLC includes the following steps:

[0029] Step 1: According to the application object and development objective, in accordance with the XML file design rules, establish an XML configuration file including interface layout, pages and page display forms, etc., including configuration files of elements data, groups group, units position, templates template and their different combination forms.

[0030] The premise of the present invention is to establish a configuration file, and the premise of establishing the configuration file is to design and establish its rules, which are specifically as follows:

[0031] The XML configuration file includes interface system configuration containing user configuration sub-tags (User Config), service configuration sub-tags (Service Config), and user list sub-tags (Users), which respectively implement the configuration of application object system configuration information, system service configuration information, and logged-in user management information;

[0032] The data variable point table contains multiple unit (position) page sub-tags, each unit contains multiple group sub-tags, and each group contains multiple element (data) sub-tags. A complete element includes data unique identifier, variable type, variable length, data variable element type, master variable name, variable IO type, variable unit, variable Chinese description, variable mapped value, whether it is a control variable, control method, variable numerical scaling ratio, variable numerical retention precision, and whether it is a parameter;

[0033] The XML configuration file includes a variable numerical information mapping table, and each mapping table contains a name, Chinese name, English name, and variable enumeration value.

[0034] Through the variable numerical information mapping table, the custom configuration of the page control component color and component appearance can be established;

[0035] Through the variable numerical information mapping table, the custom configuration of the object system fault code enumeration list can be established;

[0036] Through the variable value information mapping table, a custom configuration of user-defined enumeration quantities can be established.

[0037] The XML configuration file includes page rendering configurations. Each page corresponds to a layout. Each interface can have multiple sub-pages, and each sub-page can be divided into several rows, and each row can be divided into multiple columns.

[0038] Through the page rendering configuration, user-defined page composition can be achieved; through the page rendering configuration, user-defined division of the page can be achieved.

[0039] Step 2: Use Javascript to develop a driver based on the XML file format to load and parse the configuration information in Step 1 to form pre-loaded interface information; use Javascript to develop a data driver to load and parse elements (data, the smallest component unit), groups (group, which consists of several elements), units (position, which consists of several groups), templates (templates, which consists of several units) and their different combined data attribute forms in the interface configuration file based on the XML file format. Achieve pre-loading of information such as interfaces, interface composition and layout, interface components and display forms.

[0040] Through the data driver, the configuration information of the data variable point table can be loaded - data unique identifier, variable type, variable length, data variable element type, master variable name, variable IO type, variable unit, Chinese description of the variable, variable mapping value, whether it is a control variable, control method, variable value scaling ratio, variable value retention precision, whether it is a parameter, as information such as data display form, display content and data communication;

[0041] Through the data driver, the configuration information of the variable value information mapping table can be loaded as the display content information of fault codes and user-defined enumeration class controls;

[0042] Through the data driver, the page rendering configuration information can be loaded as the page layout information.

[0043] Step 3: Re-encapsulate the TwinCAT Javascript of Beckhoff, map the data information loaded in Step 2 to the TwinCAT communication interface, and the TwinCAT communication interface uses the HTTP protocol for polling communication; re-encapsulate the TwinCAT Javascript of Beckhoff, and re-design the communication interface according to the element attributes in Step 1 - that is, after loading the element data information in the XML configuration information through the driver program in Step 1, directly implement the mapping between the XML configuration data and the TwinCAT communication interface through the encapsulated interface, and it uses the HTTP protocol to poll communicate with the TwinCAT ADS WebService.

[0044] Through the re-encapsulated communication driver program, directly map the relevant attributes of the elements in the configuration information to the driver program interface API, and realize the automatic matching of the custom data attributes of the page configuration and the communication driver API.

[0045] Step 4: Develop a web page driver program in the single-page application mode (SAP) and data-driven (MVVM) mode, and use the configuration information pre-loaded in Step 2 to render and generate the interface; the graphical interface uses the canvas technology and svg technology, which can achieve graphic vectorization and no distortion, and maximize the visualization effect.

[0046] Through the web page driver program, achieve a high degree of consistency between the configuration and the page; that is: through the web page driver program, use the pre-loaded page rendering configuration information to generate all pages of the web page; through the web page driver program, use the pre-loaded page rendering configuration information to generate the layout of each page; through the web page driver program, use the pre-loaded page rendering configuration information to generate page controls and their display forms, display contents, etc.

[0047] Embodiment 1

[0048] A human-machine interface system based on an XML file applied to a Beckhoff PLC, and its method flow includes:

[0049] The first step is to design the interface system

[0050] Step 1: According to the application object, design an XML configuration file including elements data, groups group, units position, templates template and their different combination forms;

[0051] Step 2: Develop a data-driven program using JavaScript to achieve the loading and parsing of data attributes of data (element, the smallest component unit of the system), group (composed of several elements), position (unit, composed of several groups), template (composed of several units), and their different combination forms based on the interface configuration file in XML file format;

[0052] Step 3: Re-encapsulate the TwinCAT JavaScript of Beckhoff, and re-design its communication interface according to the element attributes in Step 1 - that is, after loading the element data information in the XML configuration information through the driver in Step 1, directly implement the mapping between the XML configuration data and the communication interface of TwinCAT through the encapsulated interface, and it uses the HTTP protocol to poll and communicate with the TwinCAT ADS WebService;

[0053] Step 4: Develop a web page driver program in the SAP (single-page application) mode and data-driven (MVVM) mode, and use the XML configuration data to drive the interface; the graphical interface uses the canvas and svg technologies, which can achieve graphic vectorization and no distortion, and maximize the visualization effect.

[0054] Second step, deploy the interface system files from Step 1 to Step 4 to the WinCE system of the PLC; the interface system runs as a WinCE process, and realizes data communication with the PLC through the Beckhoff TwinCAT ADS WebService service.

[0055] Third step, the user accesses the interface system in the target PLC through the client browser, and the system web page driver program (Step 4) generates and renders the interface driven by the XML configuration data and displays it on the user browser side; as the user switches pages, different page data and attributes are loaded, presenting the user-defined page content.

[0056] From the above description, it can be seen that the above embodiments of the present invention achieve the following technical effects: The present invention fundamentally solves the problem of the coupling between the human-machine interface of the Beckhoff CX series PLC and the PLC application program, realizes the decoupling of the interface and the program, and realizes the loading and parsing of the user configuration XML file (including elements, groups, units, and templates and their different combination forms) containing UI interface layout, pages, page display forms, content, etc. by designing and developing a data-driven program using the JavaScript language; since the UI interface description is located outside the program code that controls the application behavior, the appearance of the application is completely decoupled from the program code that controls the application behavior;

[0057] Meanwhile, the configuration of the interface is implemented using XML files, which greatly reduces the difficulty of interface design and improves the maintainability of the interface; based on the Web mode and various components provided by the system, the interface display form is more diverse and the sense is more comfortable.

[0058] The embodiments of the present disclosure provide a non-volatile computer storage medium, on which program code is stored; the computer storage medium stores computer-executable instructions, and the computer-executable instructions can execute the method steps as described in the above embodiments.

[0059] It should be noted that the above computer-readable medium in the present disclosure can be a computer-readable signal medium, a computer-readable storage medium, or any combination of the two. A computer-readable storage medium can be an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination of the above. More specific examples of the computer-readable storage medium can include: an electrical connection with one or more wires, a portable computer disk, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above. In the present disclosure, the computer-readable storage medium can be any tangible medium that contains or stores a program, and this program can be used by or in combination with an instruction execution system, apparatus, or device. And in the present disclosure, the computer-readable signal medium can include a data signal propagated in a baseband or as part of a carrier wave, which carries computer-readable program code. Such a propagated data signal can take various forms, including electromagnetic signals, optical signals, or any suitable combination of the above. The computer-readable signal medium can also be any computer-readable medium other than the computer-readable storage medium, and this computer-readable signal medium can send, propagate, or transmit a program for use by or in combination with an instruction execution system, apparatus, or device. The program code contained on the computer-readable medium can be transmitted using any appropriate medium, including: wires, optical cables, RF (radio frequency), etc., or any suitable combination of the above. The above computer-readable medium can be included in the above electronic device; or it can exist separately and not be assembled into the electronic device. The computer program code for performing the operations of the present disclosure can be written in one or more programming languages or a combination thereof. The above programming languages include object-oriented programming languages - such as Java, Smalltalk, C++, and also include conventional procedural programming languages - such as the "C" language or similar programming languages. The program code can be executed entirely on the user's computer, partially on the user's computer, executed as an independent software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In the case of a remote computer, the remote computer can be connected to the user's computer through any type of network, including a local area network (LAN) or a wide area network (WAN), or can be connected to an external computer.

[0060] The flowcharts and block diagrams in the accompanying drawings illustrate the possible architectures, functions, and operations of systems, methods, and computer program products according to various embodiments of the present disclosure. Each block in the flowchart or block diagram may represent a module, a segment of a program, or a part of code that contains one or more executable instructions for implementing a specified logical function. It should also be noted that in some alternative implementations, the functions marked in the blocks may occur in a different order than that marked in the accompanying drawings. For example, two consecutive blocks shown may actually be executed substantially in parallel, and they may sometimes be executed in the reverse order, depending on the functions involved. It should also be noted that each block in the block diagram or flowchart, and the combinations of blocks in the block diagram or flowchart, can be implemented by a dedicated hardware-based system that performs the specified functions or operations, or can be implemented by a combination of dedicated hardware and computer instructions. The units described in the embodiments of the present disclosure can be implemented in software or in hardware. Among them, the name of the unit does not constitute a limitation to the unit itself in some cases.

[0061] The preferred embodiments of the present invention have been described above, aiming to make the spirit of the present invention clearer and easier to understand, rather than to limit the present invention. Any modifications, substitutions, and improvements made within the spirit and principles of the present invention shall be included in the protection scope defined by the appended claims of the present invention.

Claims

1. A human-machine interface system based on XML files applied to Beckhoff PLC, characterized in that, Including: Step 1: According to the application object and development goals, establish an XML configuration file containing interface layout, pages, page display forms, etc. in accordance with the XML file design rules; Step 2: Use Javascript to develop a driver based on the XML file format, load and parse the configuration information in Step 1, and form pre-loaded interface information; Step 3: Re-encapsulate the TwinCAT Javascript of Beckhoff, map the data information loaded in Step 2 to the TwinCAT communication interface, and the TwinCAT communication interface uses the http protocol for polling communication; Step 4: Develop a web driver in the form of a single-page application and data-driven mode, and use the configuration information pre-loaded in Step 2 to render and generate the interface.

2. The human-machine interface system based on XML files applied to Beckhoff PLC according to claim 1, wherein The XML configuration file in Step 1 includes interface system configuration, data variable point table, variable value information mapping table, and page rendering configuration.

3. The human-machine interface system based on XML file applied to Beckhoff PLC according to claim 2, characterized in that The interface system configuration includes a user configuration sub-tag User Config, a service configuration sub-tag ServiceConfig, and a user list sub-tag Users; The data variable point table includes multiple unit position page sub-tags, each unit contains multiple group sub-tags, and each group contains multiple element data sub-tags; Each of the variable value information mapping tables contains a name, a Chinese name, an English name, and a variable enumeration value; In the page rendering configuration, each page corresponds to a layout, each interface can have multiple sub-pages page, and each sub-page can be divided into several rows row, and each row can be divided into multiple columns col.

4. The human-machine interface system based on XML files applied to Beckhoff PLC according to claim 1, characterized in that, In Step 2, use Javascript to develop a data-driven program to load and parse the data attributes of elements data, groups group, units position, templates template and their different combination forms in the interface configuration file based on the XML file format, and realize the pre-loading of information such as the interface, interface composition and layout, interface components and display forms.

5. The human-machine interface system based on XML files applied to Beckhoff PLC according to claim 4, characterized in that, Load the data variable point table configuration information through the data-driven program; load the variable value information mapping table configuration information through the data-driven program as the display content information of fault codes and user-defined enumeration class controls; Load the page rendering configuration information through the data-driven program as the page layout information.

6. The human-machine interface system based on XML files applied to Beckhoff PLC according to claim 1, characterized in that, In Step 3, after loading the element data information in the XML configuration information through the driver in Step 1, directly implement the mapping of the XML configuration data and the TwinCAT communication interface through the encapsulation interface, and the TwinCAT communication interface uses the http protocol to poll communicate with the TwinCAT ADS WebService.

7. The human-machine interface system based on XML files applied to Beckhoff PLC according to claim 6, characterized in that, After the secondary encapsulation, the communication driver directly maps the relevant attributes of the elements in the configuration information to the driver interface API, realizing the automatic matching of the custom data attributes of the page configuration and the communication driver API.

8. The human-machine interface system based on XML files applied to Beckhoff PLC according to claim 1, characterized in that, In step 4, an interface is generated through XML pre-loaded data driving; the interface is graphically presented using canvas technology and svg technology.

9. The human-machine interface system based on XML files applied to Beckhoff PLC according to claim 1, wherein Through the web page driver, the pre-loaded page renders the configuration information to generate a web page, generate the layout of each page, and generate page controls and their presentation forms and presentation content.