CN114003226A

CN114003226A - Layered distributed graphic design system

Info

Publication number: CN114003226A
Application number: CN202111294385.3A
Authority: CN
Inventors: 张小平
Original assignee: Individual
Current assignee: Individual
Priority date: 2021-11-03
Filing date: 2021-11-03
Publication date: 2022-02-01

Abstract

The invention discloses a layered distributed graphic design system, and relates to the technical field of graphic design. The system comprises a layered primitive module, a hierarchical file module and a graphic element processing module, wherein the layered primitive module is used for establishing and drawing graphic elements according to layered syntax and generating a primitive file; the human-computer interaction module is used for butting the graphic elements with the processing objects and inputting object functions to realize human-computer interaction; the distributed storage module is used for storing the graph element file in a distributed storage mode; the primitive style module is used for setting a primitive style, generating and importing a style file into the primitive file, and performing style adjustment on each graphic element in the primitive file; and the mathematical function module is used for inputting mathematical symbols and introducing a formula editor to realize function drawing. The invention greatly simplifies the design difficulty of the graphical interaction interface.

Description

Layered distributed graphic design system

Technical Field

The invention relates to the technical field of graphic design, in particular to a layered and distributed graphic design system.

Background

The current graphical interactive interface design mostly uses object-oriented program libraries, such as Swing library of Java, VCL library of Delphi, WPF library of C #, and the like, each graphical library provides multiple graphical control classes, there is inheritance relationship between the classes, and programmers directly use the encapsulated classes to create control objects and design graphical interfaces. The development environments of Delphi, Visual C #. Net/WPF, QT creator and the like also provide Visual design tools, and programmers design graphical interfaces by a method of dragging controls through a mouse.

The use interface provided by the operating system to the programmer is a collection of functions and data structures; windows provides the programmer with the use of functions and data structures, called Windows APIs, the API to create Windows is CreateWindow/CreateWindowEX, a Windows window (with title bar, maximize, minimize, close button in the upper right corner) must call the function. Other various controls all correspond to an API, the API is quite complex, the number of parameters is even more than 10, the possible values of each parameter are all five doors, and the control is difficult to master.

On Linux, a graphics system is in a client-Server structure, the graphics system operates as a service process alone, the process is called as X Server (translated into "X Server"), and a programmer writes a graphics interface program and needs to call X Lib (similar to Windows API) to communicate with the X Server, and then draws graphics by X Server; this call is much like a programmer calling MySQL C Lib to communicate with a MySQL Server, transmitting data over a network, and accessing data records by a MySQL Server. Both the X Lib and Windows APIs are C language function libraries and data structures. The cross-platform C language graphics library GTK will eventually call Windows API or X Lib to draw Windows and various graphics controls.

Both the procedural graphic programming interfaces Windows API, X Lib and GTK and the object-oriented graphic libraries QT, C # WPF and Java Swing are quite complex, the design difficulty of the graphic interactive interface is high, and the use experience of a user is poor.

Disclosure of Invention

In order to overcome the above problems or at least partially solve the above problems, embodiments of the present invention provide a hierarchical distributed graphic design system, which greatly simplifies the design difficulty of a graphic interactive interface.

The embodiment of the invention is realized by the following steps:

the embodiment of the invention provides a layered distributed graphic design system, which comprises a layered primitive module, a man-machine interaction module, a distributed storage module, a primitive style module and a mathematical function module, wherein:

the layered primitive module is used for establishing and drawing graphic elements according to layered syntax to generate a primitive file;

the human-computer interaction module is used for butting the graphic elements with the processing objects and inputting object functions to realize human-computer interaction;

the distributed storage module is used for storing the graph element file in a distributed storage mode;

the primitive style module is used for setting a primitive style, generating and importing a style file into the primitive file, and performing style adjustment on each graphic element in the primitive file;

and the mathematical function module is used for inputting mathematical symbols and introducing a formula editor to realize function drawing.

In order to solve the technical problem of high difficulty in designing a graphical interaction interface in the prior art, the system adopts a layered grammar and combines a distributed storage method to design graphical elements, and can be directly butted with a user program design system, so that the design difficulty is effectively simplified, and the design efficiency of the graphical interaction interface is improved. With a hierarchical primitive design, the number at the beginning of each row represents the hierarchy of the graphic element. Closed primitives in the system can be used nested. Pixel positioning and decimal positioning are supported; support for conditional (IF) and LOOP (LOOP) instructions, support for lists, dictionary types, support for object-oriented programming; and the primitive file is stored in a distributed storage mode, so that subsequent calling is facilitated. The style of the graphic elements can be designed in a user-defined manner, and the style of each graphic element in the graphic element file can be adjusted; further improving the design effect. And the system also supports formula editing and inputs mathematical symbols, can easily draw mathematical formulas and meet various drawing requirements. And the graph can be drawn by calling a function, so that the method is simple, convenient and quick.

In some embodiments of the present invention, the layered primitive module includes an annotation sub-module, a syntax definition sub-module, and a primitive design sub-module, wherein:

the grammar restriction submodule is used for inputting and storing annotation data of a programming language;

a grammar definition submodule for setting a hierarchical grammar;

and the primitive design submodule is used for drawing the graphic elements according to the annotation data and the layered grammar of the programming language and generating a primitive file.

In some embodiments of the present invention, the hierarchical primitive module includes a variable submodule configured to set a rendering variable type.

In some embodiments of the present invention, the layered primitive module includes an instruction submodule, configured to interface the conditional instruction and the loop instruction, and draw the graphic element through the instruction.

In some embodiments of the present invention, the graphics elements include closed primitives and open primitives.

In some embodiments of the present invention, the human-computer interaction module includes a keyboard interaction sub-module and a mouse interaction sub-module, wherein:

the keyboard interaction submodule is used for butting the closed type graphic primitive with the keyboard object and inputting a keyboard calling function to realize man-machine interaction;

and the mouse interaction submodule is used for butting the closed type graphic primitive with the mouse object and inputting a mouse calling function to realize man-machine interaction.

In some embodiments of the invention, the hierarchical distributed graphics design system further comprises a positioning module to position a rectangular region of the drawing window based on the pixels and the fractions.

In some embodiments of the present invention, the hierarchical distributed graphic design system further includes a word processing module, configured to set a tag or an attribute to process a word, so as to implement a word processing function.

In some embodiments of the present invention, the hierarchical syntax refers to that each primitive occupies a line of codes, the starting position of each line is a number, and each line of numbers represents the hierarchy of the primitive.

In some embodiments of the present invention, the distributed storage manner includes a local storage and a network server storage.

The embodiment of the invention at least has the following advantages or beneficial effects:

the embodiment of the invention provides a layered distributed graphic design system, which solves the technical problem of high design difficulty of a graphic interaction interface in the prior art, adopts layered grammar and combines a distributed storage method to design graphic elements, can be directly butted with a user program design system, effectively simplifies the design difficulty and improves the design efficiency of the graphic interaction interface. With a hierarchical primitive design, the number at the beginning of each row represents the hierarchy of the graphic element. Closed primitives in the system can be used nested. Pixel positioning and decimal positioning are supported; support for conditional (IF) and LOOP (LOOP) instructions, support for lists, dictionary types, support for object-oriented programming; and the primitive file is stored in a distributed storage mode, so that subsequent calling is facilitated. The style of the graphic elements can be designed in a user-defined manner, and the style of each graphic element in the graphic element file can be adjusted; further improving the design effect. And the system also supports formula editing and inputs mathematical symbols, can easily draw mathematical formulas and meet various drawing requirements. And the graph can be drawn by calling a function, so that the method is simple, convenient and quick.

Drawings

In order to more clearly illustrate the technical solutions of the embodiments of the present invention, the drawings needed to be used in the embodiments will be briefly described below, it should be understood that the following drawings only illustrate some embodiments of the present invention and therefore should not be considered as limiting the scope, and for those skilled in the art, other related drawings can be obtained according to the drawings without inventive efforts.

FIG. 1 is a schematic block diagram of a hierarchical distributed graphic design system according to an embodiment of the present invention;

FIG. 2 is a diagram of a primitive drawing window effect of a hierarchical distributed graphic design system according to an embodiment of the present invention;

FIG. 3 is a combined use design diagram of a hierarchical distributed graphic design system according to an embodiment of the present invention;

fig. 4 is a drawing diagram of the nth power of a hierarchical distributed graphic design system according to an embodiment of the present invention.

Icon: 100. a layered primitive module; 110. an annotation sub-module; 120. a grammar definition submodule; 130. a primitive design submodule; 140. a variable submodule; 150. an instruction submodule; 200. a human-computer interaction module; 210. a keyboard interaction sub-module; 220. a mouse interaction submodule; 300. a distributed storage module; 400. a primitive style module; 500. a mathematical function module; 600. a positioning module; 700. and a word processing module.

Detailed Description

In order to make the objects, technical solutions and advantages of the embodiments of the present invention clearer, the technical solutions in the embodiments of the present invention will be clearly and completely described below with reference to the drawings in the embodiments of the present invention, and it is obvious that the described embodiments are some, but not all, embodiments of the present invention. The components of embodiments of the present invention generally described and illustrated in the figures herein may be arranged and designed in a wide variety of different configurations.

Thus, the following detailed description of the embodiments of the present invention, presented in the figures, is not intended to limit the scope of the invention, as claimed, but is merely representative of selected embodiments of the invention. All other embodiments, which can be derived by a person skilled in the art from the embodiments given herein without making any creative effort, shall fall within the protection scope of the present invention.

It should be noted that: like reference numbers and letters refer to like items in the following figures, and thus, once an item is defined in one figure, it need not be further defined and explained in subsequent figures.

It is noted that, herein, relational terms such as first and second, and the like may be used solely to distinguish one entity or action from another entity or action without necessarily requiring or implying any actual such relationship or order between such entities or actions. Also, the terms "comprises," "comprising," or any other variation thereof, are intended to cover a non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements does not include only those elements but may include other elements not expressly listed or inherent to such process, method, article, or apparatus. Without further limitation, an element defined by the phrase "comprising an … …" does not exclude the presence of other identical elements in a process, method, article, or apparatus that comprises the element.

Examples

As shown in fig. 1, in a first aspect, an embodiment of the present invention provides a hierarchical distributed graphics design system, which includes a hierarchical primitive module 100, a human-computer interaction module 200, a distributed storage module 300, a primitive style module 400, and a mathematical function module 500, where:

the hierarchical primitive module 100 is configured to create and draw a graphic element according to a hierarchical syntax, and generate a primitive file; the hierarchical syntax is that each primitive occupies a line of codes, the starting position of each line is a number, and each line of numbers represents the hierarchy of the primitive.

A basic primitive is drawn first, as follows:

@GUI

1 WINDOW id＝"a"

(ii) a At the beginning of the semicolon is a comment

2 RECTANGLE x＝0.0 y＝0.0 width＝0.5 height＝0.5 sleep＝0fill＝red

3 RECTANGLE x＝0.2 y＝0.2 width＝0.3 height＝0.3 sleep＝0 fill＝red

4 TEXT caption＝"My id is zhang xiao ping..."ml＝off mouse＝mkeyboard＝k

2 RECT x＝0.4 y＝0.4 width＝0.6 height＝0.6 sleep＝0 image＝"D:\test 1.bmp"

3 TEXT caption＝c ml＝on

2 ELIPSE x＝0.5 y＝0.5 width＝0.5 height＝0.5

3 ELIPSE x＝0.5 y＝0.5 width＝0.5 height＝0.5

2 SQUARE x＝0.2 y＝0.6 width＝0.3

2 CIRCLE x＝0.2 y＝0.6 r＝0.3

3 LINE x1＝0.2 y1＝0.6 x2＝0.4 y2＝0.2

2 TRIANGLE x1＝0.2 y1＝0.5 x2＝0.4 y2＝0.6 x3＝0.5 y3＝0.8

2 BEZIER x1＝0.2 y1＝0.5 x2＝0.4 y2＝0.6 x3＝0.5 y3＝0.8

End

The resulting window effect is shown in fig. 2. Each graphic element occupies one line of codes and cannot be disassembled into multiple lines; x is 0.2, and spaces and tabs cannot be added.

The graphics elements include closed primitives and open primitives. The interior of the closed type primitive can be filled, and sub primitives can be added; the openness primitive is not row. If x, y, width and height are not specified, the default value of the closed graphic element is 0,0,1 and 1, which means that the upper rectangular area is occupied; the sleep attribute represents that the next graphic element is drawn after the graphic element is drawn for N microseconds; alpha represents the transparency of the primitive, and the auto attribute of window is "on", which means that when the user drags with a mouse to change the window size, the primitive in the window is recalculated and drawn according to the new window size.

And (3) closed graphics primitives:

WINDOW draws a standard Windows WINDOW with title bar, maximize, minimize and close buttons; RECTANGLE plot a rectangular area with border lines; the RECT is a rectangular area without a sideline and is mainly used for positioning and displaying images; round rectangle with round corner; ELIPSE draws an elliptical area; SQUARE draws SQUARE area; CIRCLE draws a CIRCLE; TRIANGLE drawing by using TRIANGLE;

openness primitive: TEXT draws multi-line, single-line TEXT; color is red text color; size 5 text size; the position points to the position of the current keyboard input character, and if a visible character is input, the character is added at the current position; if the control character is input, deleted, backed and the like, the C + + is used for processing the character string, and the system needs to calculate the position pointed text and add a mark, such as drawing a pointing arrow; -1 means that the current text region is not editable. And ml is off default, which means that a single line is displayed, and n or r \ n is encountered, ignored and no line is changed. And Ml ═ on indicates that multi-line display is started, and when meeting \ n or \ r \ n, line feed display is carried out. In an Ab-on multi-line text mode, when the number of characters in one line is large, the line is automatically changed for display; off indicates that infinite text is expanded to the right (but not displayed beyond the rectangular range) until a linefeed is encountered. LINE drawing a straight LINE; ARC; BEZIER Bessel curve.

The system replaces various graphic controls such as menus, radio boxes, multi-choice boxes, text boxes, multi-line texts, panels and the like in the traditional process-oriented and object-oriented graphic design by combining and using the plane geometric primitives. Note that: n +1 layers of primitives may cover N layers of primitives; and drawing the same layer of graphics primitives in line sequentially.

Examples of combined use:

the MENU bar (MENU) which is common in the drawing software can be obtained by using REGTANGLE and TEXT in combination:

@GUI

1 WINDOW id＝"menutest"

2 RECTANGLE id＝"r1"x＝0.0 y＝0.0 width＝0.1 height＝0.1 sleep＝0 fill＝red

3 TEXT capture ═ File "

2 RECTANGLE id＝"r2"x＝0.0 y＝0.1 width＝0.2 height＝0.1 sleep＝0 fill＝red

3 TEXT capture ═ tool "

2 RECTANGLE id＝"r3"x＝0.0 y＝0.2 width＝0.3 height＝0.1 sleep＝0 fill＝red

3 TEXT capture ═ View "

2 RECTANGLE id＝"r4"x＝0.0 y＝0.3 width＝0.4 height＝0.1 sleep＝0 fill＝red

3 TEXT caption＝"This is A Rect"

End

The final effect of the above design is shown in fig. 3.

According to the hierarchical grammar format, the programming thought is clearer and easier; for analyzing GUI source codes and drawing each primitive (not including variables, statements, functions and the like in a programming language), only 1000 lines of codes are needed, the code scale is reduced by more than 20 times, the code programming amount is greatly reduced, and the efficiency is improved.

Further, the layered primitive module 100 includes an annotation sub-module 110, a syntax definition sub-module 120, and a primitive design sub-module 130, wherein: a grammar definition sub-module 120 for entering and storing annotation data of a programming language; a syntax defining sub-module 120 for setting a hierarchical syntax; and the primitive design submodule 130 is configured to draw the graphic element according to the annotation data and the hierarchical syntax of the programming language, and generate a primitive file.

Almost all programming languages have annotations, and most have both single line annotations and block annotations; block annotations can often be used nested. Gradually annotating away some code and then viewing the program's behavior is a very good debugging method. Almost all programming languages are able to be annotated and printed, but not all programming languages have debugging tools. Also, learning and debugging tools may also require more mental effort. Therefore, the subsequent programming work can be effectively reduced by adopting the annotation mode, and the method is visual and clear. The semicolon starts with a single line comment, and the one starting with @ ZHUSHI is a block comment; block annotation, which can be used nested; ending with END.

For example:

@GUI

1 WINDOW auto＝on

2 RECTANGLE x＝0.0 y＝0.0 width＝0.5 height＝0.5

END

the code draws a window on the Windows desktop, and draws a rectangle in the window.

Further, the hierarchical primitive module 100 includes a variable submodule 140 for setting a rendering variable type. Integer, floating point, string, list, dictionary, mouse, and keyboard type variables are supported.

Further, the layered primitive module 100 includes an instruction submodule 150 configured to interface the conditional instruction and the loop instruction, and draw the graphic element through the instruction.

The system also supports conditional instructions and loop instructions, simplifying code by loop instructions and list variables.

The human-computer interaction module 200 is used for butting the graphic elements with the processing objects and inputting object functions to realize human-computer interaction;

further, the man-machine interaction module 200 includes a keyboard interaction sub-module 210 and a mouse interaction sub-module 220, wherein: the keyboard interaction submodule 210 is used for butting the closed type primitive with a keyboard object and inputting a keyboard calling function to realize man-machine interaction; and the mouse interaction submodule 220 is used for butting the closed type graphic primitive with the mouse object and inputting a mouse calling function to realize man-machine interaction.

In some embodiments of the invention, the closed graphical element may specify a keyboard, mouse, processing object.

One, mouse object

@GUI

1 WINDOW id＝"a"

2 RECTANGLE id＝"JuXing1"x＝0.0 y＝0.0 widht＝0.8 height＝1.0 mouse＝m1

2 RECTANGLE id＝"JuXing2"x＝0.0 y＝0.8 width＝1.0 height＝1.0 mouse＝m2

3 RECTANGLE x＝0.0 y＝0.0 width＝1.0 height＝0.1

4 TEXT id＝“Text1”caption＝"OPEN"

3 RECTANGLE x＝0.1 y＝0.0 width＝1.0 height＝0.2

4 TEXT caption＝"Test"

END

(ii) a The child primitive processing function overrides the parent primitive processing function

@m1.click

a＝1b＝a

(ii) a Checking and modifying

$JuXing1.x＝0.2

(ii) a Adding and deleting

(ii) a Adding a row of nodes for @ gui where a node is to be added after the specified node, the function does not do primitive level checking and may add a third level primitive after the first level primitive. That is, even if the PUSH succeeds, it does not indicate that the window description is correct.

(ii) a When the system draws the graphic primitive, the system checks, and if a third layer child node is arranged behind the first layer graphic primitive node in the tree structure, an error is reported.

#PUSH JuXing2 2RECTANGLE x＝0.1 y＝0.0 width＝1.0 height＝0.2

#DELETE JuXing1

(ii) a The window data structure changes and needs to be redrawn.

#REDRAW

END

Multiple selections can also be made, and the program design is as follows:

the programmer judges whether the rectangular area is selected or not by filling colors of the rectangular area, such as: when the user clicks the rectangular area, the background is filled with red color to indicate that the option is selected; turning blue indicates unselected.

The radio selection can be carried out, and the following design codes realize the functions similar to radio boxes:

in the above, the horizontal single selection is performed, the red rectangle indicates the selection, and the blue rectangle indicates the non-selection. The user may adjust REGTANGLE the values to bring the radio box up.

The function of the mouse object is as follows, as much as possible consistent with the mouse function in javascript:

click: clicking; rclick: right click; dblclick: double clicking; mouusetown: pressing down a mouse; mouseup: lifting the mouse; mouseover: suspending a mouse; mouseout: mouse-out, entry into a child primitive will also call the function. mousemove: moving the mouse; mouseenter: entering a mouse; mouselove: when the mouse leaves, the function is not called when the sub-primitive enters, and the function is called when the sub-primitive leaves the whole region.

Keyboard object:

2 RECTANGLE keyboard＝k

the above rectangle will use object k to process keyboard events, where k is a keyboard object and the designer implements each keyboard response function of object k; similarly, the keyboard processing object of the sub-primitive will overlay the keyboard processing object of the previous layer.

Displaying input text

@GUI

1 WINDOW id ═ text editing "

2 RECTANGLE x＝0.0 y＝0.0 width＝0.8 height＝1.0 keyboard＝k

3 TEXT id is "TEXT area" location "and" position "is 1

END

@k.press

(CALL Flush _ TEXT $ TEXT field)

#REDRAW

END

CALL CALLs a C + + or Java function; the user input may be letters and symbols, or control characters such as del, backspace, etc., and the programmer needs to process different control characters in Flush _ TEXT and add keyboard input characters at corresponding positions.

Also support slide bar positioning:

when TEXT starts a multi-line TEXT mode, many character strings can be generated and exceed a rectangular area; the excess portion is not displayed. Therefore, we need to add a rectangle to control which texts should be displayed. In object-oriented libraries, the control is often referred to as a "scroll bar" or "slider".

We need three REGTANGLE, the third REGTANGLE for positioning; when the user clicks the positioning rectangle, the system judges the horizontal or vertical proportion of the mouse click point segmentation rectangle, so as to display the character string to be displayed:

@GUI

1 WINDOW id＝"a"

2 REGTANGLE id＝”JuXing1”

3 REGTANGLE x＝0.0 y＝0.0 height＝1.0 width＝0.8

4 TEXT id is "TEXT area" location is c

(ii) a The following is a positioning rectangle

3REGTANGLE fill＝blue mouse＝s id＝”Slide”x＝0 y＝0.8 height＝1.0 width＝1.0

END

@S.click

N＝(CALL GET_POSITION)

(ii) a GET _ POSITION is a C + +/Java function implemented by the user to GET the ratio of the height or width of the rectangle occupied by the mouse click POSITION. The resulting N may be 1/2 or 2/3, either of which is less than or equal to 1.

d＝(CALL GET_N c N)

(ii) a GET _ N is also a C + + function and is realized by a user, and substrings of the character string C are obtained according to the proportion N. The two C + + functions can be merged into one function, and the string that should be displayed is returned directly after calling.

Text area, capture ═ d

END

In the above, a positioning rectangle having a function similar to that of the slide bar is simply implemented.

Tab pages may also be supported. The mainstream browser realizes multi-tab browsing, and a user can click different tab pages to switch among different pages. Our system implements the tab page as follows:

note that the difference between PUSH _ BACK and PUSH: the PUSH _ BACK adds a node after the last child of the node specified by the first parameter.

The distributed storage module 300 is used for storing the graph element file in a distributed storage mode; the distributed storage mode comprises local storage and network server storage.

One, use the design file

2REGTANGLE id＝”JuXing1”x＝0.1 y＝＝0.1 height＝0.4 width＝0.4 ref＝FILE://D:/book.gui

2REGTANGLE id＝”JuXing2”x＝0.1 y＝＝0.1 height＝0.4 width＝0.4 ref＝GUI://www.163.com/book.gui

When ref is specified, indicating that the primitive is a link, a click can be made to jump to another window, like the < A > tag in html. In the above, FILE represents a local FILE, and GUI represents a remote server FILE; gui window will be displayed when the user clicks on JuXing1, JuXing 2.

Note that: when the ref attribute is used, the mouse attribute is invalid.

Secondly, only using the graphic elements in the design file

Several primitives in the remote design file may also be used:

2 REGTANGLE id＝”JuXing1”x＝0.1 y＝＝0.1 height＝0.4 width＝0.4

2 GE ref＝GUI://www.163.com/book.gui id＝"JuXing1"

gui will be drawn here for the primitive named JuXing1 and its children.

III, GET and POST

The most common of the HTTP protocols are probably GET and POST, the former for requesting data from an HTTP server and the latter for submitting form data filled out by a user. Likewise, our system can also fetch or submit data using GET and POST methods. The GET method is used to implement ref attribute retrieval GUI design files, that is, the above mentioned:

2 REGTANGLE id＝”JuXing2”x＝0.1 y＝＝0.1 height＝0.4 width＝0.4ref＝GUI://www.163.com/book.gui

2 GE ref＝GUI://www.163.com/book.gui id＝"JuXing1"

in both cases, a GET command is sent to the GUI server, and the command contents are:

GET GUI://www.163.com/book.gui

GET GE GUI://www.163.com/book.gui JuXing1

gui to the client, which draws the window design file.

The POST method in Html is used in form tags for submitting form data to a server:

Username:<input type＝"text"name＝"user">

</form>

the page submits the data filled by the user to an action _ page.

The system is used as follows:

2 REGTANGLE id＝”JuXing1”x＝0.1 y＝＝0.1 height＝0.4 width＝0.4 ref＝"GUI://www.163.com/action_page1.php"method＝"post"

3INPUTtype＝”Textvalue＝”zhangfei”id＝”name”ref＝"GUI://www.163.com/action_page2.php"method＝"post"

3 INPUT type＝”Text”value＝18 id＝”age”

3 INPUT type ═ submit value ═ submit data "

(ii) a Submitting all INPUT data of the layer

Similarly, the server handler corresponding to the sub-primitive will cover the upper primitive: when the' submit data button is clicked, the data of the $ name is handed to action _ page2.php for processing; other INPUT gets data and processes it by action1_ page1. php.

The primitive style module 400 is configured to set a primitive style, generate and import a style file into a primitive file, and perform style adjustment on each graphic element in the primitive file;

some styles of primitives can be customized, written as follows:

@TEXT

background, # ffffff; v background color +

Red is color; v font color +

END

Meanwhile, this document needs to be cited in the gui design:

#INCLUDE Style.css

and a mathematical function module 500 for inputting mathematical symbols and introducing a formula editor to realize function drawing.

For example:

the power of N:

@GUI

2 RECTANGLE id ═ power function "

3 RECTANGLE id ═ base "width ═ 0.6 mouse ═ m keyboard ═ k

4 TEXT caption＝”X”

3 RECTANGLE x＝0.6 width＝0.4 height＝0.4

4 TEXT caption＝”3”

END

The above code segment will display XⁿThe n-th power of X, the final effect is shown in FIG. 4.

And (4) drawing a function:

all the above procedures can be completed in the conventional text editing software (notepad) in units of lines, and the following codes need to be completed in the mathematical software supporting formula editing described in the previous section.

Rectangular coordinates:

(ii) a A rectangular coordinate system is specified, and 1unit is 10 pixels

COORDINATE 1unit＝10pixs

We can draw multiple functions simultaneously:

COORDINATE 1unit＝10pixs y＝2x y＝x+5

y＝sinθ

we can change, the display rectangle size of the system:

RECTANGLE width＝0.5 height＝0.5

note that the present math system is interactive by row, and we do not need to specify a row number. When the user enters the above formula and clicks the "calculate" button, the system will calculate, plot.

Algebraic equations:

SOLVE x+y＝12

here, two function images of the equation are drawn and solved, that is, two coordinates of the intersection of the two function images are obtained.

Polar coordinates are as follows: POLAR 1unit ═ 10pixs ρ ═ 1

Conventionally, polar coordinates are represented by the greek letter (ρ θ), ρ being the distance from the origin, and θ being the angle between the line connecting the origin and the polar axis.

The system can realize the following two function calls:

(fun args 2.) call fun function written by the system user

(CALL fun args 2.) - - -CALL fun function of C + + Java

Keyword, sign before function @ #

For emphasizing the start of a code block, ending with END; macro instructions # define, # ifdef of C/C + +; a variable of Perl; the function parameters of the bash, using $1$2$ #, all do so. In the present system, @ represents a code block or function, # represents an instruction, and $ represents a node of the GUI.

In some embodiments of the present invention, the hierarchical distributed graphics design system further comprises a positioning module 600 for positioning a rectangular region of the drawing window based on pixels and fractions.

The object-oriented library is mostly positioned by pixels, and decimal positioning (percentage positioning) is added in the system, namely positioning can be realized by only specifying the length-width ratio of the upper left corner and the lower right corner of a rectangular region at the upper layer without specifying a specific pixel value.

In some embodiments of the present invention, the hierarchical distributed graphic design system further includes a word processing module 700, configured to set a tag or an attribute to process a word, so as to implement a word processing function.

The user can add functions according to own needs, such as: TEXT displayed by TEXT is relatively monotonous and cannot be compared with Word and html, and various labels or attributes can be added to the system so as to support rich Word processing functions.

The above is only a preferred embodiment of the present invention, and is not intended to limit the present invention, and various modifications and changes will occur to those skilled in the art. Any modification, equivalent replacement, or improvement made within the spirit and principle of the present invention should be included in the protection scope of the present invention.

It will be evident to those skilled in the art that the present application is not limited to the details of the foregoing illustrative embodiments, and that the present application may be embodied in other specific forms without departing from the spirit or essential attributes thereof. The present embodiments are therefore to be considered in all respects as illustrative and not restrictive, the scope of the application being indicated by the appended claims rather than by the foregoing description, and all changes which come within the meaning and range of equivalency of the claims are therefore intended to be embraced therein. Any reference sign in a claim should not be construed as limiting the claim concerned.

Claims

1. The layered distributed graphic design system is characterized by comprising a layered primitive module, a human-computer interaction module, a distributed storage module, a primitive style module and a mathematical function module, wherein:

2. The hierarchically distributed graphics design system of claim 1, wherein said hierarchical primitive module comprises an annotation sub-module, a syntax definition sub-module, and a primitive design sub-module, wherein:

a grammar definition submodule for setting a hierarchical grammar;

3. The system of claim 1, wherein the hierarchical primitive module comprises a variable submodule configured to set a rendering variable type.

4. The system of claim 1, wherein the layered primitive module comprises an instruction submodule configured to interface with a conditional instruction and a loop instruction, and draw the graphic element through the instruction.

5. The system of claim 1, wherein the graphics elements comprise closed primitives and open primitives.

6. The system of claim 5, wherein the human-computer interaction module comprises a keyboard interaction sub-module and a mouse interaction sub-module, and wherein:

7. The system of claim 1, further comprising a positioning module to position a rectangular area of the drawing window based on pixels and fractions.

8. The system of claim 1, further comprising a word processing module configured to set a tag or attribute to process a word to implement a word processing function.

9. The system of claim 1, wherein the hierarchical syntax includes a row of codes for each primitive, the starting position of each row is a number, and each row of numbers represents a hierarchy of the primitive.

10. The system of claim 1, wherein the distributed storage comprises local storage and web server storage.