The AS/400 makes interactive applications shine, SDA makes designing screens quick and painless.

Brief: The Screen Design Aid utility is part of the AS/400 Application Development Tools licensed program. SDA's three main functions allow you to design screens or menus and to test display files. This article focuses on using SDA to design screens. If you're new to SDA, I have given you enough information to get started. If you are an experienced SDA user, keep reading for some techniques you might have never tried before.

You can design screens on the AS/400 by manually keying in source code but then you can't really see the sum of all the parts until the work is complete. It also requires an intimate knowledge of DDS syntax. Display files allow more variation and more special keywords than any other type of AS/400 file.

But it doesn't have to be difficult! The AS/400 Application Development Tools licensed program includes the Screen Design Aid (SDA) utility. SDA makes designing screens seem like a walk in the park. You get complete interactive WYSIWYG capabilities and correct DDS syntax by simply choosing items from a list. Whether you're new to the prospect of screen design or you're a veteran of the old school, you'll want to investigate some of the many advantages SDA offers.

On the AS/400, you describe physical, logical, printer and display files with Data Description Specifications (DDS) which, like RPG specifications, are column-dependent. Coding DDS is fairly simple for physical and logical files, but becomes more complicated with printer and display files. Fortunately, keywords are available to make describing many of the attributes and functions of the file easier. They are used to describe the file, the file's records and the record's fields. Learning the extensive set of keywords for display files is no small task, especially when you add the fact that many of the keywords affect other keywords when used together. (I would like to meet the programmer that knows them all.) The good news is that SDA greatly simplifies such matters when it's used to design a display file.

Why Use SDA?

The main advantages in using SDA to design screens are that it allows you to see the screen as you work on it, and it generates the DDS code for you when you have finished designing your screens. The resulting code is much less likely to contain errors than code which has been keyed in manually. You do not need an extensive knowledge of DDS in order to use SDA; however, a basic understanding of display files is helpful.

As mentioned, display files frequently contain many DDS keywords-some can be used only at certain levels. SDA allows you to select keywords at the file, record and field levels and only those which are allowed at each level are available for selection. Furthermore, SDA groups them by function to make the selection process even easier. When selecting keywords, you not only see the actual keyword but also a brief description; and cursor-sensitive help text is available for each keyword.

Getting Started

There are two ways to start SDA. You can use the Start SDA (STR-SDA) command, or you can use Option 17 in the Programming Development Manager (PDM) from the Work with Members panel. The STRSDA command presents a menu of SDA's three main functions: Design Screens, Design Menus and Test Display Files. In this article, we'll only be dealing with the Design Screens option. To design screens, select Option 1. You will then be prompted for the source file and member to work with. If you use PDM to start SDA, then you are automatically taken to the Work with Display Records panel (see 1) with the existing source file and member already selected. You cannot use PDM to create a new screen source member.

There are two ways to start SDA. You can use the Start SDA (STR-SDA) command, or you can use Option 17 in the Programming Development Manager (PDM) from the Work with Members panel. The STRSDA command presents a menu of SDA's three main functions: Design Screens, Design Menus and Test Display Files. In this article, we'll only be dealing with the Design Screens option. To design screens, select Option 1. You will then be prompted for the source file and member to work with. If you use PDM to start SDA, then you are automatically taken to the Work with Display Records panel (see Figure 1) with the existing source file and member already selected. You cannot use PDM to create a new screen source member.

Designing a New Panel

From the Work with Display Records screen, you can access all three levels of a display file: the file level, record level and field level. Pressing F14 lets you change or add file level keywords. Option 8 allows you to maintain record level keywords for a given record. Option 1 or Option 12 takes you to the Design Image Work Screen, where you actually design your screens. From here, you gain access to the field level.

This article deals almost exclusively with the field level, the actual nuts and bolts of screen design. The Design Image Work Screen helps you lay out your screen by allowing you to manipulate several types of fields. A database field references an already-existing field in a physical or logical file. A user-defined field, on the other hand, is explicitly defined in the display file. A constant field, a value on the screen which the user does not intend to change, is a special case of a user-defined field. Data fields (whether user-defined or defined by a database reference) can be used for input, output, or both.

The Design Image Work Screen allows you to add, move, copy and remove fields and change field attributes and colors as well. Most of these tasks are accomplished by placing special characters in the position preceding a field (the attribute byte of the field). These codes can be made up of one, two, and sometimes three characters. SDA recognizes these special characters as control codes and performs the appropriate action. You may find it helpful to use the F18 and F19 keys to tab forward and backward through the fields on your screen. This moves the cursor to the attribute byte of each of the fields. For a complete list of the Design Image Work Screen function keys and the basic control codes, see 2. We'll start by learning how to create a field.

The Design Image Work Screen allows you to add, move, copy and remove fields and change field attributes and colors as well. Most of these tasks are accomplished by placing special characters in the position preceding a field (the attribute byte of the field). These codes can be made up of one, two, and sometimes three characters. SDA recognizes these special characters as control codes and performs the appropriate action. You may find it helpful to use the F18 and F19 keys to tab forward and backward through the fields on your screen. This moves the cursor to the attribute byte of each of the fields. For a complete list of the Design Image Work Screen function keys and the basic control codes, see Figure 2. We'll start by learning how to create a field.

User-defined Fields

A user-defined field is a field which is explicitly defined in the display file, as opposed to defining a field by referencing a field already defined in a physical or logical file. User-defined fields can be defined as character or numeric. In addition, they can also be defined as input, output or both.

To add a character user-defined field to the screen, type a plus sign (+) followed by the field usage: I for input, O for output, or B for both. The I, O or B can be in either uppercase or lowercase. To add a numeric user-defined field, type a plus sign (+) followed by the field usage: 3 for input, 6 for output or 9 for both. The number of characters following the plus sign specifies the length of the field. For example, +OOOO defines a four-byte character output field. You can optionally enter one character after the plus sign followed by the field length in parentheses. For example, +O(4) defines the same four-byte character field. I like the latter approach since it eliminates the need to count characters. Label A in 3 illustrates adding an input/output character field, with a length of 10.

To add a character user-defined field to the screen, type a plus sign (+) followed by the field usage: I for input, O for output, or B for both. The I, O or B can be in either uppercase or lowercase. To add a numeric user-defined field, type a plus sign (+) followed by the field usage: 3 for input, 6 for output or 9 for both. The number of characters following the plus sign specifies the length of the field. For example, +OOOO defines a four-byte character output field. You can optionally enter one character after the plus sign followed by the field length in parentheses. For example, +O(4) defines the same four-byte character field. I like the latter approach since it eliminates the need to count characters. Label A in Figure 3 illustrates adding an input/output character field, with a length of 10.

You cannot change a field from character to numeric or vice versa without deleting the field and then re-entering it. However, you can change a field's usage (i.e., input, output, or both) with ease. For example, suppose you define a field as OOOO (output only), then later decide that you want it to be BBBB (both input and output). Key a B over any portion of the field and press Enter. The field will then be changed from OOOO to BBBB. The same holds true for changing the usage of a numeric field with one slight difference: you have the choice of using I, O, or B or using 3, 6, or 9 to change the field's usage.

Renaming and Resizing User-defined Fields

Each user-defined field added to the SDA work screen is assigned a default name, which starts with the letters FLD followed by a three-digit number. The numbering starts with 001 and is incremented by 1 for each new field added. This default name is usually not what you want your field to be called. So, to rename it, type a question mark (?) in the attribute byte of the field, which is the position immediately preceding the field. The field name is then presented to you on the bottom of the screen along with the field length. From here, you can change both elements. To change the name, type in the new name of the field. To change field lengths for character fields, simply key in the new field length; for numeric fields, enter the field length followed by a comma, then the number of decimal positions.

Constants

A constant is a value on the screen which does not change; for example, the literal Customer number: is a constant. If a constant contains more than one word, you should enclose it in single quotes when entering it on the work screen. If the quotes are omitted, then SDA creates one constant for each word. In this example, Customer would be one constant, while number: would be another unless the entire entry was enclosed in quotes.

An easy way to tell where a constant begins and ends is to use the F20 key on the Design Image Work Screen. Pressing F20 displays on the screen all constants in reverse image. Pressing F20 again returns the screen to normal. The reverse image is only temporary and is not saved as part of your display file. By using this feature you may discover that some of your constants have been entered incorrectly.

Fortunately, SDA gives us a way to combine multiple constants together into one constant and to split single constants apart into multiple ones. To combine constants, place one pair of single quotes around the outside of the constants you wish to combine. For example, 'Customer number:' would become one constant. To split a single constant apart, place one pair of single quotes around the outside of the constant, and place one or more double quotes where you wish to split it apart. For instance, 'Customer"number:' would become two constants.

One other thing to remember about constants is that if they contain any characters which have a special meaning to SDA, then they must be entered within single quotes. For example, the literal F3=Exit must be entered within single quotes since the equal sign (=) has a special meaning to SDA. Other characters which have a special meaning to SDA include &, +, ?, <, >, ', " and -.

Special Output Constants

Four special output constants are available for use on the Design Image Work Screen (4). The system automatically loads these fields with a value when the program is run. Do not place quotes around these constants when entering them on the screen.

Four special output constants are available for use on the Design Image Work Screen (Figure 4). The system automatically loads these fields with a value when the program is run. Do not place quotes around these constants when entering them on the screen.

Database Fields

A database field references a field in a physical or logical file. To add a database field to the screen, press the F10 key. You are then prompted for the name, library, and record format of the file. You also have the choice of selecting all fields from a file or displaying a list of fields from which to choose. In either case, you must decide whether these fields will be used for input, output or both. Once you have made your database field selection, you return to the Design Image Work Screen and the fields you selected appear along the bottom of the screen. Each field is preceded by a number, starting with 1. These numbers are used to place the fields.

If there are more fields to display than will fit on one line, you will see a plus sign (+) in the lower right-hand corner of the screen. In this case, pressing the roll up (or page down) key shows you the additional fields. To add one of these database fields to the panel, enter an ampersand (&) followed by the number which precedes the field, at the position on the screen where you want the field to be placed.

You can optionally request the field's column heading to be placed on the screen. The column heading can be placed to the left, to the right, or above the field by adding the letter l, r, or c, respectively, following the field number. You can also add the column heading without adding the field by using the letter p. Refer to the chart in 5 for easy reference, where n is the number which precedes the field on the bottom line of the screen.

You can optionally request the field's column heading to be placed on the screen. The column heading can be placed to the left, to the right, or above the field by adding the letter l, r, or c, respectively, following the field number. You can also add the column heading without adding the field by using the letter p. Refer to the chart in Figure 5 for easy reference, where n is the number which precedes the field on the bottom line of the screen.

Moving and Copying Fields

People who are unfamiliar with SDA often try to use the insert and delete keys on the design image screen, but these keys bring about unpredictable results. There are several valid methods of moving and copying information on the Design Image Work Screen. One method is to place a hyphen (-) in the attribute byte of the field you wish to move. Then place an equal sign (=) one position to the left of where you want the field to be moved to, and press Enter. Label B in 3 illustrates a move of the constant '1=Select' from the bottom of the screen to the top of the screen with the = character.

People who are unfamiliar with SDA often try to use the insert and delete keys on the design image screen, but these keys bring about unpredictable results. There are several valid methods of moving and copying information on the Design Image Work Screen. One method is to place a hyphen (-) in the attribute byte of the field you wish to move. Then place an equal sign (=) one position to the left of where you want the field to be moved to, and press Enter. Label B in Figure 3 illustrates a move of the constant '1=Select' from the bottom of the screen to the top of the screen with the = character.

Two equal signs (==) can be used to copy rather than move the field. Place the left equal sign one position to the left of the position you want the field to be copied to. This method works fine if you are only moving or copying one item; however, suppose you need to move or copy a block of information. This can be accomplished by placing one hyphen (-) in the upper left-hand corner of a block and another in the lower right-hand corner of a block. Then place an equal sign (=) where you want the block moved to, and press Enter. Two equal signs (==) can also be used with blocks to copy rather than move information.

Shifting Fields

If you only need to move an item to the left or right of its current position, you can use one or more less than (<) symbols or greater than (>) symbols. The less than (<) symbol is used in front of a field to shift it to the left, while the greater than (>) symbol is used in the first position after the field to shift it to the right. For example, shifting a field three positions to the left might look like this: <<>>. Label C in 3 illustrates moving a constant three positions to the left.

If you only need to move an item to the left or right of its current position, you can use one or more less than (<) symbols or greater than (>) symbols. The less than (<) symbol is used in front of a field to shift it to the left, while the greater than (>) symbol is used in the first position after the field to shift it to the right. For example, shifting a field three positions to the left might look like this: <<>>. Label C in Figure 3 illustrates moving a constant three positions to the left.

Centering Fields

One other way to move a field is to center it on the screen. This is particularly useful for things like screen headings. To center a field, use the ac code starting in the attribute byte of a field (immediately left of the field), and press Enter. Enter the a in the attribute byte, and the c over the first character of the field.

Deleting Information From the Work Screen

The easiest way to delete information from the work screen is to place a d in the attribute byte of a field or constant, and press Enter. An alternate method is to press the space bar over the attribute position and over the entire field or constant, and press Enter. Both of these methods only delete one field or constant at a time. If you want to delete a block of information from the work screen, you can place a d in front of multiple fields on the screen before pressing Enter.

Changing Attributes and Colors

There are two methods of changing the attributes and colors of information on the screen. I recommend that beginning SDA users place an asterisk (*) in the attribute position of a field, press Enter, and then select the attributes and/or colors option from the subsequent menu which is displayed. A shortcut method for more advanced users requires you to enter one of the codes shown in 6 beginning in the attribute position of the field or constant.

There are two methods of changing the attributes and colors of information on the screen. I recommend that beginning SDA users place an asterisk (*) in the attribute position of a field, press Enter, and then select the attributes and/or colors option from the subsequent menu which is displayed. A shortcut method for more advanced users requires you to enter one of the codes shown in Figure 6 beginning in the attribute position of the field or constant.

When entering a code which is more than one character in length, then the first character is entered in the attribute byte and the subsequent one or two characters are placed over the first and second characters of the field. The codes can be entered in either uppercase or lowercase. In most cases, you can perform multiple tasks at once by entering more than one code before pressing the Enter key.

Ending the SDA Design Session

After you are satisfied with your layout, use the F12 key to return to the Work with Display Re-cords panel. Press F12 again and the Save DDS/Create Display File panel (7) is displayed, which allows you to save DDS source code and create the display file. You can save the source without creating the display file, but you cannot create the display file without saving the source. After your choices have been made, press Enter and a message will be returned indicating the member was saved. If you chose to create the display file, the CRTDSPF command is submitted to batch.

After you are satisfied with your layout, use the F12 key to return to the Work with Display Re-cords panel. Press F12 again and the Save DDS/Create Display File panel (Figure 7) is displayed, which allows you to save DDS source code and create the display file. You can save the source without creating the display file, but you cannot create the display file without saving the source. After your choices have been made, press Enter and a message will be returned indicating the member was saved. If you chose to create the display file, the CRTDSPF command is submitted to batch.

There's a Lot More

The material I've covered is by no means all there is to SDA. For

example, you can press F4 from the Work Screen and obtain a list of the fields you have defined. From that list you can select a field, rename it, delete it, change the order of the associated DDS (keeping their screen locations) or even sort the DDS by screen position!

As you can see, the SDA Design Image Work Screen has many powerful features. Each of these features has been designed to make our jobs as programmers a little bit easier. It is up to us to take advantage of these features.

The best way to learn SDA is to use it often. Try to resist the temptation to edit display file DDS source code with SEU. By using SDA every time you need to make a change to a screen, you will become more and more familiar with its many capabilities. Gradually you'll learn to use these capabilities to the fullest extent and become a much more productive programmer.

SDA's Design Image Work Screen

Figure 1 SDA Work with Display Records panel

 Figure 1: SDA Work with Display Records Panel Work with Display Records File . . . . . . : SOURCE Member . . . . . . : PGM004DF Library . . . . : $SHARIC Source type . . . : DSPF Type options, press Enter. 1=Add 2=Edit comments 3=Copy 4=Delete 7=Rename 8=Select keywords 12=Design image Opt Order Record Type Related Subfile Date DDS Error __ __________ __ 10 JOBSF SFL 04/01/92 __ 20 JOBCTL SFLCTL JOBSF 04/01/92 __ 30 FOOT RECORD 03/31/92 Bottom F3=Exit F12=Cancel F14=File-level keywords F15=File-level comments F17=Subset F24=More keys (C) COPYRIGHT IBM CORP. 1981, 1991. 
 
 SDA's Design Image Work Screen
 
 Figure 2 Design Image work screen function keys/controls
 
 Figure 2: Design Image Work Screen Function Keys and Basic Control Codes Key Use Key Use F3 = Exit F14 = Ruler F4 = Prompt F15 = Subfile prompt F6 = Condition F17 = Print F9 = Select additional records F18 = Tab F10 = Database F19 = Back tab F11 = Non-display selected fields F20 = Reverse image constants F12 = Cancel F21 = Display additional records Control Code Action ? change field name and/or length * change field keywords < move field left > move field right - mark field to move/copy - mark block begin and end = move marked field or block = = copy marked field or block d delete a field + add a user-defined field 
 
 SDA's Design Image Work Screen
 
 Figure 3 Sample "Design Image Work Screen"
 
 Figure 3: Sample "Design Image Work Screen" Active Interactive and Batch Jobs As of: 66/66/66 66:66:66 << 
 SDA's Design Image Work Screen
 
 Figure 4 Special output constants
 
 Figure 4: Special Output Constants Constant Form Results *date DD/DD/DD displays the current system date *time TT:TT:TT displays the current system time *user UUUUUUUUUU displays the current user *system SSSSSSSS displays the system name 
 
 SDA's Design Image Work Screen
 
 Figure 5 Database field placement symbols
 
 Figure 5: Database Field Placement Symbols Symbol Meaning &n Places the field. Does not add the column heading. &nl Places the field. Adds the column heading to the left of the field. &nr Places the field. Adds the column heading to the right of the field. &nc Places the field. Centers the column heading above the field. &np Places the column heading only. n = database field number as defined in the selection list displayed at bottom of the Design Image Work Screen. 
 
 SDA's Design Image Work Screen
 
 Figure 6 SDA design attribute codes
 
 Figure 6: SDA Design Attribute Codes --- Code --- Add Remove Attribute h -h high intensity r -r reverse image s -s column separators b -b blink n -n non display u -u underline -a remove all attributes ---Code --- Add Remove Color cb -cb blue cg -cg green cp -cp pink cr -cr red ct -ct turquoise cw -cw white -ca remove all colors 
 
 SDA's Design Image Work Screen
 
 Figure 7 SDA Save DDS/Create Display File panel
 
 Figure 7: SDA Save DDS/Create Display File Panel Save DDS - Create Display File Type choices, press Enter. Save DDS source . . . . . . . . . . . . Y Y=Yes Source file . . . . . . . . . . . . . SOURCE F4 for list Library . . . . . . . . . . . . . . $SHARIC Name, *LIBL ... Member . . . . . . . . . . . . . . . . PHN001DF F4 for list Text . . . . . . . . . . . . . . . . . Display file DDS for RPG program PHONER1 Create display file . . . . . . . . . . Y Y=Yes Prompt for parameters . . . . . . . . Y=Yes Display file . . . . . . . . . . . . . PHN001DF F4 for list Library . . . . . . . . . . . . . . MC_SQL Name, *CURLIB Replace existing file . . . . . . . . Y=Yes Submit create job in batch . . . . . . . Y Y=Yes Specify additional save or create options . . . . . . . . Y=Yes F3=Exit F4=Prompt F12=Cancel