chapter 05_step-by-step instructions for making a gui.ppt

IBM Global Business Services

© IBM Corporation 2013Step-by-Step Instructions for Making a GUI |

Dec-2008

Step-by-Step Instructions for Making a GUI


© IBM Corporation 20132 Dec-2008Step-by-Step Instructions for Making a GUI |

Objectives

The participants will be able to: Use SET PF-STATUS syntax and be able to create a GUI Status.

Assign Function Codes to Function Keys.

Add an Icon to a Function Code.

Create Pushbuttons on the Application Toolbar.

Use The SY-PFKEY System Field.



DATA:WA_LFA1 TYPE LFA1.

START-OF-SELECTION.SELECT * FROM LFA1 INTO WA_LFA1.

WRITE: / WA_LFA1-LIFNR, 30 WA_LFA1-NAME1.ENDSELECT.

SET PF-STATUS ‘TEST1’.

A New ABAP

Reserved Word

SELECT * SY-SUBRCCHECK

Using SET PF-STATUS and Creating a GUI Status

SYNTAX: SET PF-STATUS <status name>.SYNTAX: SET PF-STATUS <status name>.

Coding Example



REPORT YGUI1-XX.

DATA: WA_LFA1 TYPE LFA1.

START-OF-SELECTION.SELECT * FROM LFA1 INTO WA_LFA1.

WRITE: / WA_LFA1-LIFNR, 30 WA_LFA1-NAME1.ENDSELECT.

SET PF-STATUS ‘TEST1’.

Double-click on the word ‘TEST1’.

Double Clicking GUI Status Name

SELECT * SY-SUBRCCHECK



Letting the System Create the GUI Status for You

Choose YES



Entering Administrative Information

Enter Some Descriptive text

Choose “Normal Screen” as Status

Type



Menu Painter Initial Display

You will create that will appear on the Menu Bar of your

GUI status by using these white text

boxes

You create the buttons that will appear on the

Application Toolbar of your GUI status by

using these white text boxes

Function Key assignments for all buttons

are shown here

Use the Drop-down button to get the Function Code



Expanding Menu Painter Display

Application Toolbar in the Menu Painter

Standard Toolbar in the Menu Painter

Standard Toolbar of your program

Application Toolbar of your program



Assigning Function Codes to Function Keys

To create a function code with an To create a function code with an icon associated to it, double-click icon associated to it, double-click on the function code, then choose on the function code, then choose

an icon.an icon.

Click once here. This is where we Click once here. This is where we will define our first function code.will define our first function code.

1st. 1st.

2nd. 2nd.



Choose any icon.

Adding an Icon to a Function Code



Function Code Attributes



Creating Pushbuttons on the Application Toolbar

Type the function codes (RUNX and RUNY) of your buttons into

the next available white text boxes on the application toolbar.

Click SAVE to see the icons appear below the white boxes.



Adding a Menu

Select the first available white text box for the menu bar, now populated with <List> and type “Test Menu”. Double-click on

this menu title to open it up (see next slide).



Adding a Menu Path

TIP: If you wish to create a menu item with a breakout (submenu), leave the entry in the Func. column blank, and type a menu item name in the Name column. Then type a function code in the

breakout menu which appears.

Type RUNX and RUNY here.



Automatic Recognition of Function Codes

The GUI must be activated



Demonstration

Creation of a GUI status with pushbuttons on application toolbar and customized menu.



Practice

Creation of a GUI status with pushbuttons on application toolbar and customized menu.



Using AT USER-COMMAND to Detect Function Codes

AT USER-COMMAND.CASE SY-UCOMM.

WHEN ‘RUNX’.WINDOW STARTING AT 10 4

ENDING AT 77 12.WRITE: / ‘The user chose X’.

WHEN ‘RUNY’.WINDOW STARTING AT 10 4

ENDING AT 77 12.WRITE: / ‘The user chose Y’.

ENDCASE.

Enter this code for the “AT USER-COMMAND” event.



GUI Status for Detail Lists

Do you notice the problem with this GUI Do you notice the problem with this GUI Status?Status?



For now just use the control menu box to close this window.

Problem:How does the user exit this window? There should be a button on the bottom of this window that allows the user to go back.

Problem with Detail List GUI Status



Using a Different GUI Status Type for Dialog Boxes

NEW AND IMPROVED: TEST2Dialog box GUI Statuses automatically contain a

red cancel button.



Demonstration

Creation of Dialog boxes with Exit button.



Practice

Creation of Dialog boxes with Exit button.



A Report that Uses more than One GUI Status - Code

Add this line of code. Then double-click on the word ‘TEST2’.


WHEN ‘RUNX’.SET PF-STATUS ‘TEST2’.WINDOW STARTING AT 10 4


WHEN ‘RUNY’.WINDOW STARTING AT 10 4


ENDCASE.



A Report that Uses More than One GUI Status - Administrative

Add some descriptive text, then choose “Dialog box” as the Status Type.



Notice that “Dialog Box” statuses do not have menus or standard toolbars.

A Report that Uses More than One GUI Status - Menu Painter



Function Codes Automatically Recognized by ABAP

Function Code Functionality Associated function key

Button on Toolbar

BACK Back F3

RW Cancel F12

%EX End F15

P-- Scroll to beginning F21

P- Scroll back one page F22

P+ Scroll forward one page

F23

P++ Scroll to end F24




WHEN ‘RUNX’.SET PF-STATUS ‘TEST2’.WINDOW STARTING AT 10 4


WHEN ‘RUNY’.SET PF-STATUS ‘TEST3’.WINDOW STARTING AT 10 4


ENDCASE.

Add this line of code.

Coding Example : A Report that Uses More Than One GUI Status



SY-PFKEY = ‘TEST1’

SY-PFKEY = ‘TEST3’

A New ABAP

System Field

Which status is currently being used?

SYSTEM FIELD: SY-PFKEY

The SY-PFKEY System Field



Demonstration

Use of more than one GUI Status in a program.



Practice

Use of more than one GUI Status in a program.



SYNTAX: SET TITLEBAR <titlebar name>.SYNTAX: SET TITLEBAR <titlebar name>.


WHEN ‘RUNX’.SET PF-STATUS ‘TEST2’.SET TITLEBAR ‘TB2’.WINDOW STARTING AT 10 4


WHEN ‘RUNY’.SET PF-STATUS ‘TEST3’.WINDOW STARTING AT 10 4


ENDCASE.

A New ABAP

Reserved Word

Coding Example: Adding a GUI Title



First

Choose Yes.

Second

Type in the text that youwant to appear on the titlebar

of your GUI Status. Use ampersands (&) if you want to use

variables. Then choose Save.

Adding A GUI Title - Administration



Program’s GUI

Status 1

RUNXRUNYRUNZ

Status 2

RUNX

RUNA

Status 3

RUNC

RUNY

Status 4

RUNB

Function Codesfor Entire GUI

RUNARUNBRUNCRUNXRUNYRUNZ

Graphical User Interface



Summary

GUI status name can be up to 20 characters and must be in Capital letters.

SY-PFKEY contains the name of current GUI status.

‘Dialog Box’ status does not have Menu or a Standard Toolbar.

GUI Title names can be up to 20 characters and must be in Capital letters.

Whenever we create a new window or dialog box, the exit button from the controlmenu must be used. Options to exit must be provided to the user.

A program can have any number of GUI statuses defined.

Function Codes can be defined with a maximum four characters long.



Questions

What are the naming restrictions for a PF status ?

What are the naming restrictions for a GUI title ?

What is the difference between a ‘Normal Screen’ and a ‘Dialog Box’ status ?

What is the problem if the no buttons or Function codes are not included from thecontrol menu in a dialog box ?

How many GUI status can be defined for a program ?

Can we pass parameters to GUI title ?

chapter 05_step-by-step instructions for making a gui.ppt

Documents