JPH09114621A - Gui picture design support method - Google Patents

Abstract

PROBLEM TO BE SOLVED: To exclude the variance among plural developers to generate a consistent GUI picture by setting a relational information table between window area attributes and control parts attributes and an attribute monitor program. SOLUTION: A new attribute monitor program 109 retrieves 'form color' and 'form size' in a relational information storage table 110 based on a stuck control type and attribute information and the mode which are set to the form stored in a form attribute information storage table 112 and extracts the color and the size to be set to stuck control parts and stores extracted attribute information in an object attribute information table 111. Further, the program 109 sets attributes to control parts on the form based on this retrieval. Thus, it is unnecessary to set a GUI design with trial and error, and the design can be standardized even in development by plural developers.

Description

Detailed Description of the Invention

[0001]

TECHNICAL FIELD The present invention relates to a software development support method.

[0002]

2. Description of the Related Art A conventional GUI screen realization method is to display and use push buttons, text boxes, list boxes, etc. called windows and controls corresponding to GUI screens according to a language called a third generation language (3GL). I was programming the process description for the user's operation. And recently, a language called software simple development support tool (4GL) has appeared, and a tool that can realize a GUI screen by a very simple operation of pasting a control to a window area called a form or a sheet with a mouse operation has become available. It has become popular. However, these tools paste the standard controls provided by each software easy development support tool in the window area by mouse operation, and set the attribute value (color, size) for each pasted control in the window area. , Font, etc.). For each control, the developer must examine and set an appropriate value for each control while checking it against the attribute of the window area.

When the attribute value color of the window area is changed after the GUI is created, the attribute values of all controls developed in the window area are changed by the user. Also, in business system development by multiple developers, in order to unify the GUI designs among the developers, a standard document is created based on the guide created by a GUI design expert, and synchronization among the developers is performed. I am taking it.

Some software easy development support tools can create user-specific controls in addition to standard controls. However, the work of the user is still required to set the optimum attribute value corresponding to the window area.

[0005]

In the above technique, the user sets the attribute value of the control by trial and error for all the controls by the user's judgment in a manner corresponding to the attribute value of the window area. It had to be done and was a burden on the user. Moreover, it was necessary to request the user to have a sense of design. In addition, in business system development by multiple developers, it is essential that all developers follow the same design, and the developers always need to synchronize with other developers. However, it is necessary to create and manage a standard document based on a guide created by a GUI design expert, and there is a problem that a consistent design cannot be created among users unless a standard is created. INDUSTRIAL APPLICABILITY The present invention reduces the work for users, does not require the need for design sense regardless of which user is used, and eliminates variations among a plurality of developers.
It is an object to provide a means for enabling creation of a consistent GUI screen.

[0006]

According to the present invention, as means for achieving the above object, a software simple development support tool capable of generating a GUI screen by a mouse operation, a window area attribute called a form or sheet corresponding to the screen,
A related information table of control component attributes developed in the window area and an attribute monitoring program are set.
In the related information table, the optimum attribute value to be set by each control is held for each control type in a form corresponding to the window area attribute value. When the user pastes the control parts in the window area with the mouse, or changes the window area attributes when changing the already created GUI screen, they are used as triggers,
Start the attribute monitoring program, recognize the attribute value set in the window area, and the control type that is expanded or is about to be expanded in the window area, and based on the recognized information, display the related information table. It searches and recognizes the attribute information to be set in each control, and sets the attribute information in each control component.

By keeping the optimum values in the table format for the attribute values of the window area called a form or sheet corresponding to the screen and the attribute values of each control component expanded on the window area, It is not necessary for the developer to set the attribute value to be set in the control of, by trial and error, so that the work efficiency can be improved and the design accuracy can be improved. Further, the work of responding to the design change after creating the GUI screen can be significantly reduced. Furthermore, G by multiple developers
It is possible to reduce the width of UI design variation.

[0008]

BEST MODE FOR CARRYING OUT THE INVENTION An embodiment of the present invention will be described below with reference to FIGS. In FIG. 1, G handled in this embodiment
1 shows a system configuration of a UI screen design support system.

This system comprises the following devices. 1
Reference numeral 03 is an input device for inputting character information and the like.

Reference numeral 102 is a mouse for assisting the input of the input device (103). Reference numeral 101 denotes an execution unit that realizes the present invention. When developing software having a GUI screen, when a control component is pasted with a mouse (102) on a window area corresponding to a screen called a sheet or form, Depending on the attribute information of the window area,
It is a processing device for setting the attribute information of the control component to be developed on it.

A display screen 104 serves as a user interface for displaying the processing result of the processing device (101). Reference numeral 106 is a GUI for easily developing software having a conventional GUI screen by operating a mouse.
It is a screen creation support program. Reference numeral 105 denotes a creation support program storage file for storing the GUI screen creation support program (106).

Reference numeral 107 is a mode designation execution program for displaying a mode selection screen for designating in what mode the attribute of the control component is set.

Reference numeral 110 is a related information storage table which holds the relationship between the attribute information of the window area corresponding to the screen and the attribute information of the control parts pasted on the window area. When a new screen is created, 109 recognizes the attributes of the window area when pasting a control component on the window area corresponding to the screen, and holds the related information of the attributes of the window area and the attributes of the control. Related information storage table (11
0) is searched by using the recognized window area attribute information as a key, and the information to be set in the control component is extracted according to the type of the control component to be pasted on the window region and pasted in the window region. Immediately after,
It is a new attribute monitoring program that sets the extracted attributes in the control component.

Reference numeral 108 monitors the attribute information of the window area when some control parts are pasted on the window area corresponding to the screen and the attribute information has already been set for the control parts. When the attribute of the window area is changed, the related information storage table (110) holding the related information of the attribute of the window area and the attribute of the control is searched, and all the controls pasted in the window area are searched. It is a change attribute monitoring program for resetting the attribute information of parts.

Reference numeral 112 is a form attribute information storage table that holds the attribute information of the window area defined by the user. Reference numeral 111 is an object attribute information storage table that holds attribute information of control parts pasted in the window area by the user. Reference numeral 113 is a related information storage file that stores the related information storage table (110). An object attribute storage file 114 stores the object attribute information storage table (111) and the form attribute information storage table (112).

FIG. 2 shows a processing flow of the present invention. When a user starts the work of creating software having a GUI screen, the following processing is performed. In the following, the window area corresponding to the screen will be described as a form.

First, a GUI screen creation support program (106) for supporting software development having a conventional GUI screen is activated. (Step 201) Next, a mode selection window (107a) for allowing the user to select the mode of the attribute of the control component to be pasted on the form is displayed. Possible modes include a mode in which the control text is emphasized with respect to the form color, and a mode in which the colors of the form and the control are used in a color that is easy on the eyes.

The mode selection window (107a) has 30
The mode description texts shown in 1 to 304 and mode selection buttons (305 to 308) are included. The mode explanation texts (301 to 304) respectively explain what each mode is like. Let the user refer to the description and select the optimum mode with the mode selection button (305-3
08). The selected mode is stored in the form attribute information storage table (112a). 112a
FIG. 4 is a detailed explanatory diagram of a form attribute information storage table (112). The form attribute storage table (112a) is
With the form name (601) as a key, the mode (60
2), form color (603), form position and size information such as left position (604), upper position (605), width (606), and height (607). Although it has attributes of color, position, and size here, it is possible to add form attribute information as a column. The values of the left position (604), the upper position (605), the width (606), and the height (607) correspond to the values 604a to 607a shown in 701. The mode setting information is stored in the form attribute information storage table (1
12a). (Step 202) Next, the form creation screen (106a) is displayed, and the user sets the attribute information of the form from the attribute setting box (402). The set attribute information is stored in the same record as the mode information set in step 202 in the form attribute information storage table (112a). (Step 20
3) Next, the form creation screen (106b) having the component box (501) for selecting the control component to be pasted on the form and the attribute setting box (502) is displayed, and the user needs from the component box (501). Select a control part and click the form (50
3) Stick the control part on top of it at the optimum position. (Step 204) Then, the control type to which the new attribute monitoring program (109) is pasted and the attribute information (603 to 607) set in the form (503) stored in the form attribute information storage table (112a). And mode (6
02), based on the related information storage table "form color"
(110a), the related information storage table "form size" (110b) is searched, and the color and size to be set in the attached control component are extracted, and the extracted attribute information is the object attribute information storage table (111a).
To be stored. Further, based on the search information, attributes are set to the control parts on the form.

Incidentally, 110a and 110b are detailed explanatory views of the related information storage table (110), and 111a is a detailed explanatory view of the object attribute information storage table (111).

Object attribute information storage table (11
1101 in 1a) is the form name to which the control component is pasted, 1102 stores the name of the control component, that is, the object name, and the form name (1101) + object name (1102) is the object attribute information storage table (111a). ) Key item. Further, 1103 stores the foreground color of the control component attached on the form, and 1104 stores the background color. Foreground color and background color are 1 depending on the type of control
It becomes like 001. 804a is a command button control, 805a is a text control, 806a is an edit box control, 807a is a combo box control, 808a is a rectangular control,
Reference numeral 809a represents the foreground color and background color of each circle control. 1105 stores a left position indicating where the control component is arranged on the form.
Stores the position above it. 1107 stores the width indicating the size of the control, and 1108 stores the height. The left position (1105), the upper position (1106), the width (1107), and the height (1108) are 701a of 604a,
It corresponds to 605a, 606a, and 607a, respectively.

For other attribute information that cannot be set by the new attribute setting monitoring program, the form creation screen (1
A user is made to set an optimal value from the attribute setting box (502) of 06b).

In this embodiment, the related information storage table (11
Although only the color and size attributes are described as 0a) and (110b), similarly, holding related information for each attribute can further improve the simplicity of development.

As an example of the method of extracting the color to be set in the control component, the form attribute information storage table (112
The mode (602) in which the form name (601) is set as the key from a) to the form color (60)
3) is extracted. Then, using the extracted mode (801) and form color (802) as keys, the related information storage table "form color" (110a) is searched to extract records. From the extracted record, a column (804 to 804) corresponding to the type of the pasted control component is further added.
809), the foreground color and the background color of the object attribute (803) to be set in the control component are extracted. The background color and foreground color are 1001 depending on the type of control component.
become that way. 804a is a command button control, 805a is a text control, 806a is an edit box control, 807a is a combo box control, 808a is a rectangular control, and 80
Reference numeral 9a represents the foreground color and background color of each circle control.

As an example of a method of extracting the size to be set in the control component, the form attribute information storage table (1
The mode (602) set in the form is extracted from 12a) using the form name (601) as a key. Then, using the extracted mode (901) and the object type (903) that is the type of the pasted control component as a key, the related information storage table “form size” (1
10b) is searched and records are extracted. Furthermore, the object width ratio (90
4) Based on the value of the object vertical width ratio (905), the size to be set in the control is calculated.

For example, the arithmetic expression is control component vertical size = form width (607) ×
Object width ratio (904) / 100 control part width size = form width (607) x
The size of the control component is calculated as the object vertical width ratio (905) / 100. (Step 205) The form attribute monitoring program (108) monitors the form once defined, and the mode is changed from the mode setting menu (504) of the form creation screen (106b) or the form attribute is changed. To monitor. When the mode change or the change of form attribute is made by the user, the change is used as a trigger, and the change information of the form is used as a key for the control parts on all forms, and the related information storage table "form color"
(110a), the related information storage table "form size" (110b) is searched, the attribute value corresponding to the change attribute is extracted, and the extracted attribute information is stored in the object attribute information storage table (111a). Then, the attribute values stored in the object attribute information storage table (111a) are set to the control parts on all the forms.
(Step 206)

[0026]

According to the present invention, when developing software having a GUI screen, it is not necessary to set the GUI design by trial and error, and it is possible to unify the design even in the development by a plurality of developers. . In addition, it is possible to easily create a GUI screen with high design accuracy without requiring the developer to have a sense of design. Furthermore, since the attribute setting work can be simplified, it is possible to improve work efficiency.

[Brief description of the drawings]

FIG. 1 is a system configuration of a GUI screen design system to which an embodiment of the present invention is applied.

FIG. 2 is a flowchart of a GUI screen design system.

FIG. 3 is a sample mode selection window that allows a user to select a mode.

FIG. 4 is a sample form attribute definition window that allows a user to set form attribute information corresponding to a screen.

FIG. 5 is a sample form definition window in which a control component is pasted on a form by a user and attribute information is set in the control component.

FIG. 6 is a detailed diagram of a form attribute information storage table (112).

FIG. 7 is a detailed view of a form attribute information storage table (112
It is a detailed explanatory view of the table item of a).

FIG. 8 is a detailed view of a table for form color attributes of the related information storage table (110).

FIG. 9 is a detailed diagram of a table for form size attributes of the related information storage table (110).

FIG. 10 is a detailed diagram of a table for form color attributes (11
It is a detailed explanatory view of the foreground color and the background color attribute of 0a).

FIG. 11 is an object attribute information storage table (11
It is a detailed view of 1).

[Explanation of symbols]

101 ... Processing device, 102 ... Mouse, 103 ... Input device, 104 ... Display device, 105 ... Creation support program storage file, 106 ... GUI screen creation support program, 107 ... Mode designation execution program, 108 ... Change attribute monitoring program, 109 ... new attribute monitoring program, 110 ... related information storage table, 111 ... object attribute information storage table, 112 ... form attribute information storage table, 113 ... related information storage file,
114 ... Object attribute storage file.

Claims (6)

[Claims] 1. A graphical user interface (GU)
In software development with I), the user pastes control parts such as push buttons, text boxes, and list boxes, which are GUI parts, in the window area called sheet, form, etc. corresponding to the application screen by mouse operation. In order to support GUI screen creation by a software development support tool that creates GUI screens, control is performed for each control component type that is pasted onto the window area in correspondence with attribute information such as the color and size of the window area. Holding the related information table having the optimum related information with the attribute information such as the color and size of the parts, and developing the control parts at the time of newly creating the GUI screen, that is, when the control parts are pasted in the window area. Recognize the attribute information of the window area The attribute information of the window area against the associated table, to extract the information to be set in the control part, GUI screen design creation support method characterized by retaining the new attribute monitoring program to set the attributes of the control part. 2. The attribute information of the window area to which the control component is attached holds the related information table of claim 1 and when the GUI screen is changed, that is, when the control component is already attached to the window area. Holds a change attribute monitor program for the purpose of monitoring the attribute information of the window area and the attribute information of the controls in the window area when changing, and maintaining consistency with the information in the related information table. A GUI screen design creation support method characterized by the above. 3. A GUI screen which holds the related information table of claim 1, holds the new attribute monitoring program of claim 1, and holds the changed attribute monitoring program of claim 2. Design creation support method. 4. A mode-related information table according to claim 1, wherein several modes selectable by a user are set, and a mode-related information table having a window area attribute and a control part attribute-related information is held for each mode. Also, a GUI screen design creation support method characterized by holding the new attribute monitoring program according to claim 1. 5. A GUI screen design creation support method comprising holding the mode-related information table of claim 4 and holding the change attribute monitoring program of claim 2. 6. A GUI characterized by holding a mode related information table according to claim 4, holding a new attribute monitoring program according to claim 1, and holding a changed attribute monitoring program according to claim 2. Screen design creation support method.