JPH04284534A - Programming device - Google Patents

Abstract

PURPOSE:To provide a programming device capable of generating interactively and visually a program source code to regenerate a user interface. CONSTITUTION:When the specified user interface is laid out by a lay out means 121, a data extracting means 122A extracts data necessitated for regenerating said specified user interface from information related to this laid out specified user interface. Then, a program source code generating means 122B synthesizes the data extracted by the data extracting means 122A and a program for regenerating the prescribed user interface, and generates the program source code to regenerate the specified user interface.

Description

[Detailed description of the invention]

0001

BACKGROUND OF THE INVENTION 1. Field of the Invention The present invention relates to a programming device that displays a user interface on a display screen.

0002

2. Description of the Related Art In recent years, interactive computer systems have been widely used to perform various tasks in an interactive manner. This interactive computer system consists of a personal computer,
A central processing unit that stores data and performs necessary processing, a display device that displays processing results on a display screen, and a keyboard and mouse that input data and instructions necessary for data processing. (pointing device), a printing device that outputs a hard copy of data as needed, an external storage device that stores data, etc.

In such an interactive computer system, when a necessary instruction is given using the keyboard or mouse, the response to this instruction is immediately reflected on the display screen of the display device, and a new instruction is issued in response to this response. By repeating the process one after another, the user can obtain the processing result that he or she is seeking.

[0004] In such an interactive computer system, it is necessary to form a user interface equipped with a desired input/output mechanism in order to ensure interactivity, operability, and speedy and accurate communication of intentions with the user. can.

[0005] When forming this user interface, for example, XlibProgramming Man
ual Voiume1 (O'Reilly & Asso
12A Complete
When creating a calculator-like user interface on a computer screen, such as the calculator program described in ``Applications'', its functions, display form, size, coordinate position, etc. are described as a program. In other words, the program source code related to the user interface was coded.

For example, the button “+” for addition
When creating a button, the button is displayed as "+" on the screen, and the coordinate position on the screen is set relative to other buttons, for example, X=5, Y=3. In addition, the processing for the mouse of the base window and the functions of the buttons for the mouse are written in program code.

[0007] By displaying the user interface created in this way on the screen and instructing it with a mouse or the like, it is possible to execute the functions set for the user interface.

[0008]

[Problem to be Solved by the Invention] However, in the conventional interactive computer system described above, when changing the user interface described above, it is necessary to change its function, display form, size, coordinate position, etc. It is necessary to directly change the program code related to the part, which makes the editing work complicated and extremely inefficient, and there is an extremely high possibility that an error may occur due to a mistake in changing the program code. Further, when creating a prototype user interface, there is a lot of modification work, and in this case as well, the work of directly modifying the program code as described above had to be repeated.

The present invention has been made in view of the above circumstances, and an object of the present invention is to provide a programming device that can interactively create a program source code for reproducing a user interface.

0010

[Means for Solving the Problems] In order to achieve the above object, the present invention provides a programming device that displays a user interface on a display screen. a layout means for laying out a user interface; a data extraction means for extracting data necessary for reproducing the particular user interface from information regarding the particular user interface laid out by the layout means; The apparatus further includes program source code generating means for synthesizing the data extracted by the extracting means and a program for reproducing a predetermined user interface to generate a program source code for reproducing the specific user interface.

[0011]

[Operation] According to the programming device according to the present invention, when a specific user interface is laid out based on the information regarding the layout of the user interface inputted in an interactive manner, from the information regarding the laid out specific user interface, Data necessary for reproducing the specific user interface (for example, functions, display format, size, coordinate position, etc.) is extracted, and the extracted data and the data required for reproducing the predetermined user interface are extracted. The programs are synthesized to generate a program source code for reproducing the particular user interface.

[0012] Therefore, by simply laying out a user interface interactively and visually, a program source code for reproducing the user interface can be automatically generated.

[0013]

DESCRIPTION OF THE PREFERRED EMBODIMENTS Hereinafter, embodiments of the present invention will be described with reference to the accompanying drawings.

FIG. 1 is a functional block diagram showing an embodiment of a programming device according to the present invention.

[0015] The input unit 11 is for inputting layout information regarding parts constituting the user interface (hereinafter referred to as operation objects), such as information such as the position, size, function, and display form of the window of the operation object. be. This information is given to the user interface generation processing section 12.

The user interface generation processing section 12 generates an operation object based on the input information and provides it to the display section 13, and also runs a program for reproducing the user interface from the user interface made up of the completed operation object group. Generate source code.

In the user interface generation processing section 12, the layout means 121 generates a window for displaying the operation object based on the input position and size data for creating the window, and also generates a window for displaying the input object. An operation object is generated based on layout information related to the operation object. This generated operation object holds information such as the position, size, function, display form, etc. of the window of the operation object, which was set at the time of layout, as internal data.

When the layout of the operation object is completed, the layout means 121 notifies the program source code generation section 122 of this fact.

In the program source code generation section 122, the data extraction means 122A includes the layout means 12
Data necessary for reproducing the operation object is extracted from information regarding the operation object laid out and completed in step 1, and the extracted data is provided to the program source code generation means 122B.

[0020] The data required to reproduce the operation object includes the position and size of the window for displaying the operation object, the position and size of the operation object window, the function, the display form, etc. There is information on.

On the other hand, program source code generation means 1
22B generates a program source code by synthesizing the data extracted by the data extraction means 122A and processing for reproducing a predetermined operation object (processing for developing data).

The process of developing the data consists of a process of creating a window for displaying the operation object and a process of creating the operation object. The user interface is reproduced by passing the data related to the operation object extracted by the data extracting means 122A to the processing for creating the operation object.

In this embodiment, the user interface generation processing unit 12 is configured to execute layout processing of operation objects and program source code generation processing based on a multi-window system 14 that realizes a multi-window function. I have to.

FIG. 2 shows the hardware configuration of a workstation that implements the embodiment shown in FIG.

In FIG. 2, a mouse 21 and a keyboard 22 to which the mouse 21 is connected correspond to the input section 11 in FIG. 1, a bitmap display device 23 corresponding to the display section 13 in FIG. 1, and various programs and data. a hard disk device 24 for storing various input data and instructions, a real memory 25 for storing programs and data loaded from the hard disk device 24, and a central processing unit (hereinafter referred to as CPU) that executes predetermined processing. 26 are connected to a common bus 27. CPU
26 controls each section connected to the common bus 27 via that bus.

In this embodiment, the user interface generation processing unit 12 and multi-window system 14 in FIG. This is achieved by loading and running.

Furthermore, when the user creates a desired operation object, the position, size, function, and display form of the window of the operation object are basically set by operating the mouse 21. Of course, the settings may be made by operating the keyboard 22.

In this embodiment, various pads are provided to facilitate the creation of operation objects using the mouse 21. Next, typical pads and their functions will be explained.

FIG. 3 shows a pad (hereinafter referred to as a logo pad) 31 for calling up other pads. By selecting a desired item on a menu 32 within the logo pad 31, the corresponding pad is displayed on the screen. be done.

[0030] Now, operate the mouse 21 to select menu 3.
When "BVD" is selected from 2, a pad (hereinafter referred to as BVD pad) 41 related to the layout of operation objects, shown in FIG. 4, is displayed on the display screen.

[0031] The BVD pad 41 has 0 to 1 as described below.
It consists of 6 items. Next, the functions of each item will be explained. Note that the item numbers 0 to 16 correspond to the numbers 0 to 16 shown in FIG. 4, respectively.

That is, 0..."BVD": Create a window with a grid. 1..."Init": Sets the specified window as the operation target. 2... "CreateBox": Creates an operation object according to the specified size and position. 3..."WithPad": Makes the operation object an input frame with a numerical input pad. At this time, a window 51 shown in FIG. 5 is displayed on the display screen. 4...“readon”: Makes the operation object an input frame. 5...“Grid”: Specify the grid interval. 6... Interval specification area: Specify the grid interval. At this time, by selecting the numerical value in the numerical value input pad 51 shown in FIG. 5, the actually set numerical value is written in the interval designation area 6, as shown in FIG. 7...“Move”: Move the operation object. 8..."Copy: Copy the operation object. 9..."Beyond": Copy the operation object from another window. 10..."Delete": Delete the operation object. 11..."Specs": Specify the specifications of the operation object. Can be set. 12... “Tools”: Call other pads. 13... “Adjust”: Call other pads. 14... “Setup”: Set the function of the operation object to its initial state. 15... “ing”: Edit Shows the window inside. 16... “Grid”: Displays a grid over the entire window being edited.

Next, if you select W3 from the menu 32 in the logo pad 31 shown in FIG. 3, the display screen will display the font display, background display designation, etc. shown in FIG. pad (hereinafter referred to as W3 pad) 7
1 is displayed.

The W3 pad 71 is composed of parts 71A to 71D as shown in FIG. Next part 7
The functions of 1A to 71D will be explained.

That is, 71A: Specify the display of the frame, font, and background of the operation object. 72B: Specify display regarding the box frame of the operation object. 73C: Specify the display of the font background. 74D: Specify display font.

Furthermore, the part 71A includes a shade specified portion 71A-1 and a frame and font specified portion 71A-2.
It consists of a designated part 71A-1 of the shade.
FIG. 8 shows an enlarged view of the frame and font designated area 71A.
An enlarged view of -2 is shown in FIG.

As shown in FIG. 8, the shade specification part 71A-1 includes a "Fontshadow" part 81 for specifying fonts composed of items 1 to 4, and a part 81 for specifying fonts composed of items 5 to 8. It consists of a "Frameshadow" part 82 for specifying.

Next, the functions of each item in the shade designated portion 71A-1 will be explained. In addition, item number 1~
8 corresponds to the numbers 1 to 8 shown in FIG. 8, respectively.

That is, [Regarding Part 81] 1..."shade": Specifies the back shade of the font. 2...“Invert”: Specify whether to perform inverted display. 3..."X": Specifies the distance between the font and the shadow in the X direction. 4..."Y": Specifies the distance between the font and the shadow in the Y direction. For example, when the content shown in FIG. 10(a) is set, the display state is as shown in FIG. 10(b).

[Regarding Part 82] 5..."Shade": Specifies the shade of the operation object. 6...“Invert”: Specify whether to perform inverted display. 7..."X": Specifies the display of the operation object and the distance in the X direction of the shadow. 8..."Y": Specify the display of the operation object and the distance in the Y direction of the shadow. For example, when the content shown in FIG. 11(a) is set, the display state is as shown in FIG. 11(b).

On the other hand, the frame and font specification portion 71A-2
is composed of items 9 to 13, as shown in FIG. Next, the functions of each item in the font specification section 71A-2 will be explained. In addition, item numbers 9 to 1
3 corresponds to numbers 9 to 13 shown in FIG. 9, respectively.

That is, 9..."Frame": Specifies the display of the frame of the operation object. 10...“Size”: Specify the font size. 11...“Face”: Specify normal, bold, and italic. 12...“Family”: Specifies the type of font. 13..."App": Apply the above specifications 1 to 12 in the A part to the operation object.

Next, part 71B shown in FIG. 7 has item 1 as shown in FIG. 12 which shows an enlarged view of part 71B.
It consists of ~5. Next, the functions of each item will be explained. Note that item numbers 1 to 5 correspond to numbers 1 to 5 shown in FIG. 12. That is, 1..."Normal": The frame is displayed with a width of 1. 2...“Double”: The frame becomes double. 3...“Button”: Displays a button. 4...“None”: The frame disappears. 5...“Ellipse”: The frame becomes an ellipse.

Next, the operating procedure for creating an operation object desired by the user will be explained with reference to the flowchart shown in FIG.

[0045] First, the user determines whether or not to create a new user interface (step 1301), and if so, specifies the position and size of the window on the display screen, sets the grid, A window 1401 to be laid out as shown in FIG. 14 is created (step 1302). Created window 14
01 holds data on the position and size of the set window as internal data. In FIG. 14, 1402 is a grid (represented by "・" in FIG. 14), and 1403 is a bitmap display device 2.
This is the display screen of No. 3.

The grid 142 has the function of making it easier to specify the position and size of the operation object using the mouse 21. By setting this grid, the size of the operation object is created as an integral multiple of the grid size, which simplifies the layout. In addition, the positions are also specified in grid units, which facilitates operations such as arranging the respective operation objects adjacent to each other or arranging them at regular intervals.

Now, after creating the window 1401, specify the position and size of the operation object on the window 1401 (step 1303), and then
Create an operation object 1501 as shown in 5 (
Step 1304). At this time, the operation object 15
01 is positioned based on the grid, and its size matches the grid.

The created operation object holds data on the position and size of the set operation object as internal data. Similarly, data related to display formats and function data, which will be described later, are also held as internal data when they are set.

Next, once the operation object 1501 has been created, display formats such as font type, size, whiteout, presence/absence of shading, and background pattern (shade) are set for the operation object 1501 (step 1305).
). FIG. 16 shows an example of an operation object with a set display format. Like the operation object 1601 shown in FIG. 16, the operation object for which the display format has been set has the specified contents as attributes, and is taken in as data when generating the program source code.

After setting the display format, open a window 1701 for setting functions as shown in FIG.
702, a function activated from the created operation object 1601 is set (step 1306).

For example, the function specification area 17 shown in FIG.
Since the function "BEEP.FUNCTION" is set in 02, when the operation object 1601 is selected with the mouse 21, "BEEP.FUNCTI" is set.
ON" will be executed. In this way, when setting a function, the function is set as the user interface to determine what the operation object selected with the mouse 21 "does."

[0052] The function specified in the function specification area 1702 (
Depending on the function), the operation object can be a button, a menu input frame, a type input frame, an output display frame, a toggle switch, or a slide bar. In this case, the operation object 1601 functions as a button,
The set function “BEEP.FUNCTION” is
Since parameter values are required when the user interface is started, an input area for those values will also be added. This input area is an operation object that holds parameter values, and its function is set as a type input frame.

[0053] Since one operation object has been created through the above operation procedure, check whether it is necessary to create another operation object (step 1).
307).

[0054] If more operation objects are to be created, the process returns to step 1303 and the operations from this step onwards are repeated. FIG. 18 shows an example of the final operation object group created in this way. Figure 18
In the operation object group shown in , “BEEP.
An operation object 1601 to which a function called “FUNCTION” is set, and an operation object 1601 to which a function called “BELL. FUNCTIO
Operation object 1 where a function called “N” is set
801, an operation object 1802 to which a function “GB.CLOSEW” is set, and “GB.MO
An operation object 1803 in which a function called "VEW" is set has been created.

In FIG. 18, 1601A is a type input frame (operation object that holds parameter values) as an area for inputting parameter values of the operation object 1601, and 1801A is a type input frame for inputting parameter values of the operation object 1801. This is a type input frame (operation object that holds parameter values) as an area for.

If all the operation objects have been created in the above step 1307, the final layout of the entire operation object can be adjusted by moving the created operation objects on the window 1401 or changing the size and display. Arrange. For example, the operation object group shown in FIG. 18 is arranged into a final overall layout as shown in FIG. 19, for example.

[0057] Further, by specifying margins for the window 1401 and adjusting the size and position of the window 1401, the layout of the entire user interface is adjusted (step 1308). As a result, for example, Figure 2
The final user interface shown at 0 will be obtained. In FIG. 20, the operation object 160
The value “800” is input in the type input frame 1601A of No. 1, and the value “800” can be changed by selecting the operation object 1601 with the mouse 21.
BEEP. This is the parameter value when the function called "FUNCTION" is activated and executed.

Then, as shown in FIG. 21, a program source code input window 2101 is opened, and a desired function name, for example, "BEEP.BELL" is input into a function name specification area 2102. As a result, the program source code generation unit 122 evaluates the specified function name "BEEP.BELL" and generates the same user interface as the original window (
step 1309). Note that the details of the generation of the user interface (generation of the program source code) will be described later.

The processing in steps 1301 to 1309 described above is an operation procedure for creating a new user interface. Next, if a new user interface is not created in step 1301 (step 1301:
No), that is, when changing an already created user interface, for example the user interface shown in FIG. 20, specify the window to be changed (window 1401 in this example) (step 1310), and then The operation objects displayed above (in this example, operation objects 1601, 1801 to
1803), performs an operation to change the target operation object (step 1311). After step 1311 ends, the process advances to step 1308.

[0060] When changing the user interface, the above-mentioned pads can also be used to change the user interface.

Next, the program source code generator 122
Figure 2 shows the program source code generation process using
This will be explained with reference to the flowchart No. 2.

First, when the name of the program source code to be generated, for example "BEEP.BELL" is input (step 2201), the data extraction means 122A
In order to play the base window in the program, extract the window information such as the coordinate position, size, title, and frame thickness of the target window, and give the window information the window name "BEEP.BELL". data is created and saved (step 2202). The same window is created by passing this data to the function that creates the window.

Next, the coordinate position (location on the base window) and size stored as data of the operation object are extracted and stored as data (step 2203). Further, the designation of display items, character type, background pattern (shade), and shape, which are stored as data by the operation object, is extracted and stored as display format data (step 2204). Furthermore, the process set for the operation object (the process started from the operation object) is extracted and saved as data (step 2205). In addition to the coordinate position and size data of the operation object mentioned above, the data saved by the operation object includes the operation object's title, frame thickness, centering flag, display margin, frame coordinate position, There are a process 1 to be activated, a process 2 to be activated, the type of display character, unique data (user data) set to the operation object, an active flag, etc.

Next, after extracting the data necessary to reproduce one operation object (part), it is determined whether there are any other operation objects to be reproduced (step 2206). Here, if an operation object exists (step 2206: YES), the process returns to step 2203 and executes the steps after this step to extract data regarding all operation objects.

On the other hand, if it does not exist (step 2206
:NO), the program source code generation means 122B synthesizes the base window data and operation object data, and the function for reproducing the operation object from these data, and uses the set name to synthesize the operation object data. , a program source code is generated and defined as a function (step 2207). The user interface is reproduced by evaluating this defined function.

Next, layout processing of the operation object,
The process of generating source code from a completed operation object will be explained using a LISP processing system as an example.

First, the layout of the operation objects is performed according to the operation procedure shown in FIG. 13 described above. At this time, when setting a function for the operation object, it is written using a LISP function. In this case, if a function has been created in advance or can be specified by function name, specify it by that name. It is also possible to specify the LAMBDA expression (lambda expression) as is.

For example, in the function setting for the operation object 1601 shown in FIG.
A function called "BEEP.FUNCTION" is written in the file.

Next, the extraction of window information and operation object information by the data extraction means 122A will be explained.

(1) Execution of window information retrieval processing For example, as the data held by the window 1401 shown in FIG. 20, "Coordinate position: X=485, Y=588, Horizontal size: 203, Vertical size: 98, Title: None (N
IL shows it), frame thickness: 1, window name: BEEP. BELL,
” as data indicating each.

In this case, the data extraction means 122A (
A) a: Take out each data mentioned above,
(QUOTE((485 588 203 9
8) NIL 1 BEEP. BELL))
...Data (1) related to the window called (1)
Create. b: Next, save the above data (1) internally. (B) After completing the process in (A) of (1) above, create a program (hereinafter referred to as program (1)) that sets the above data (1) in a local variable called Winf.

(2) Execution of the processing for retrieving information of the operation object will be explained here using an operation object called BELL as an example. For example, as the data held by the operation object 1801 shown in FIG. 20, “Title = “BELL”, Coordinate position:
, horizontal size = 79, vertical size = 29, frame thickness = 1, centering flag = T (T = True),
Display margin = 2, frame coordinate position: X = 5, Y = 5, activated process 1 = no setting, activated process 2 = BEEP. FUNCTION, Display character type = HELVETICA 8 point bold, Unique data = BNAME (name of operation object) is initName (default name), BS
HADE (display format such as button) is (23
130NORMAL-2-2 T 0 0 65535
), active flag = T (T = True)
”
Let the data indicate each.

In this case, the data extraction means 122A (
A) a: Take out each data mentioned above,
("BELL" (6 6 79 29) 1 T
2 (5.5) NIL B
EEP. FUNCTION (HELVETICA 8
BRR) (BNAMEinitName BSHAD
E (231
30 NORMAL-2-2 T 0 06535))
T) …(2)
Data (2) related to the operation object is created. b: Next, save the above data (2) internally. (B) If there are a plurality of operation objects, execute the process (A) of (2) above for each operation object. (C) Create a program (hereinafter referred to as program (2)) that collects each data created in the process of (B) in (2) above and sets it in a local variable called Binf.

Finally, the program source code generation process by the program source code generation means 122B will be explained.

First, data related to the window (for example, data (1)) and the above program (1), data related to the operation object (for example, data (2), etc.) and the above program (2), and the data are expanded. Processing (function L
B. EXPAND ) into a single program source code, and then change the set name, for example "BE
EP. BELL” is used to define it as a function. An example of the program source code generated in this way is shown in Figure 2.
It is shown in 3.

In FIG. 23, 2301 indicates data related to a window, 2302 a data group related to an operation object, and 2303 a process for expanding the data. Note that the process 2303 for expanding data is (function argument...
(LB.EXPAND WinfBinf
Bindfig). Here, “Win
f” performs the process of creating a window, and “Bi
nf" performs processing to create an operation object.

The program (program source code) synthesized in this way performs processing to reproduce a user interface.

Therefore, the function BEEP. When BELL is evaluated, (a) the above program 1 is executed and data related to the window is set in the local variable Winf.

(b) Furthermore, the above program 2 is executed, and a data group related to the operation object is set in the local variable Binf.

(c) Furthermore, data expansion processing (L
B. EXPAND Winf Binf Bindfi
g) is evaluated. In this evaluation, the function LB.
In EXPAND, set the local variable Winf in (a) above.
and evaluate using the local variable Binf in (b) above as an argument. That is, the window and operation object are created by passing the data set in the local variable Winf to the first argument "Winf" and passing the data set in the local variable Binf to the second argument "Binf". The user interface will be reproduced.

[0081] Note that the operation object reproduction processing section, that is, the data expansion processing (LB.EXPAND), is realized using the functions that have existed in the past and have been prepared for creating operation objects using programs. ing. Note that in the past, the user wrote the data to be passed to such create processing (processing for creating an operation object) in program code, and also individually wrote the processing for creating the operation object based on the data.

According to the above-described embodiment, the user interface is created by specifying the layout, functions, etc. of the operation objects by operating the mouse in an interactive manner while looking at the display screen. Visually and visually, you can create new user interfaces or modify already created user interfaces.

[0083] Furthermore, after the user interface on the display screen is completed, by specifying a function name for the window for displaying the user interface, the program source code for reproducing the user interface can be automatically created. Since the program is generated, the user does not need to write the program source code directly.

In particular, when changing an already created user interface, it is possible to obtain a program source code that reproduces a user interface with a new layout and function without directly changing the algorithm of the program source code.

[0085]

[Effects of the Invention] As explained above, according to the present invention, data necessary for reproducing a user interface created based on information regarding the layout of the user interface inputted in an interactive manner can be obtained. , and then synthesizes that data with a program for reproducing a predetermined user interface to generate a program source code for reproducing the user interface, so when creating a user interface, the user can The user interface can be easily created by simply laying out the user interface interactively and visually without writing program source code.

[0086] Also, when changing the user interface, the program source code can be changed without directly changing it.
Since the layout of the user interface can be changed interactively and visually, errors caused by mistakes in changing the program source code can be minimized.

[Brief explanation of the drawing]

FIG. 1 is a functional block diagram showing an embodiment of a programming device according to the present invention.

FIG. 2 is a diagram showing the hardware configuration of a workstation that implements the embodiment shown in FIG. 1.

FIG. 3 is a diagram showing an example of a pad used when creating parts constituting a user interface.

FIG. 4 is a diagram showing an example of a pad used when creating parts constituting a user interface.

FIG. 5 is a diagram for explaining the pad shown in FIG. 4.

FIG. 6 is a diagram for explaining the pad shown in FIG. 4.

FIG. 7 is a diagram showing an example of a pad used when creating parts constituting a user interface.

FIG. 8 is a diagram for explaining the pad shown in FIG. 7.

FIG. 9 is a diagram for explaining the pad shown in FIG. 7.

FIG. 10 is a diagram for explaining the pad shown in FIG. 7.

FIG. 11 is a diagram for explaining the pad shown in FIG. 7.

FIG. 12 is a diagram for explaining the pad shown in FIG. 7.

FIG. 13 is a flowchart showing an operation procedure for generating and changing a user interface.

FIG. 14 is a diagram for explaining the process of generating a user interface.

FIG. 15 is a diagram for explaining the process of generating a user interface.

FIG. 16 is a diagram for explaining the process of generating a user interface.

FIG. 17 is a diagram for explaining the process of generating a user interface.

FIG. 18 is a diagram for explaining the process of generating a user interface.

FIG. 19 is a diagram for explaining the process of generating a user interface.

FIG. 20 is a diagram for explaining the process of generating a user interface.

FIG. 21 is a diagram showing an example of a window for generating program source code.

FIG. 22 is a flowchart showing a process for generating a program source code for reproducing a user interface.

FIG. 23 is a diagram showing an example of generated program source code.

[Explanation of symbols]

11... Input unit, 12... User interface generation processing unit, 13... Display unit, 14... Multi-window system,
121...Layout means, 122...Program source code generation unit, 122A...Data extraction means, 122B...Program source code generation means.

Claims (1)

[Claims] 1. A programming device that displays a user interface on a display screen, comprising: a layout means for laying out a specific user interface based on information regarding the layout of the user interface input in an interactive manner; data extraction means for extracting data necessary for reproducing the particular user interface from the information regarding the particular user interface that has been retrieved; and data extracted by the data extraction means and reproducing the predetermined user interface. 1. A programming device comprising: program source code generating means for generating a program source code for reproducing the specific user interface by synthesizing the program source code for reproducing the specific user interface.