IBM Global Services

Graphical User Interface

Graphical User Interface |

Dec-2008

2005 IBM Corporation

IBM Global Services

Objectives
The participants will be able to:
Create a GUI status for online programs.
Set the GUI status in the PBO event.
Check the function codes using the user-defined field OKCODE.

Graphical User Interface |

Dec-2008

2005 IBM Corporation

IBM Global Services

Overview
Exit

Edit

Loop

Academy Awards
Year

1994

Category

PIC

Menu Painter

Using the Menu Painter, we can add

pushbuttons to the application toolbar
on both screens.

***Important Questions***
Exit

Update

Where do you set the GUI status/title?

Academy Awards

What type of GUI status is used?

How do you check the function code triggered?
What are the different function types?

Year

1994

Category

PIC

Winner

Forrest Gump

Notes

The Shawshank Redemption should have won.

Graphical User Interface |

Dec-2008

2005 IBM Corporation

IBM Global Services

Menu Painter

Menu Painter

Create function codes with a 20-character

(maximum) identifier.

Function Key

Standard

Application

Assignments

Toolbar

Toolbar

Graphical User Interface |

Dec-2008

Menu bar

2005 IBM Corporation

IBM Global Services

Set GUI Status/Title in PBO Module

** MZA05O01 - PBO Modules **
Screen 9000
PROCESS BEFORE OUTPUT.
MODULE INITIALIZE.

MODULE INITIALIZE OUTPUT.

IF SY-DYNNR = 9000.
SET PF-STATUS FIRST.
SET TITLEBAR ONE.
ELSE.
SET PF-STATUS

Screen 9001

SECOND.
SET TITLEBAR TWO.

PROCESS BEFORE OUTPUT.

MODULE INITIALIZE.

Notice that the call to module

INITIALIZE in the PBO of each
screen refers to the same ABAP
module.

Graphical User Interface |

ENDIF.
ENDMODULE.

SY-DYNNR =

Dec-2008

Current
screen
number

2005 IBM Corporation

IBM Global Services

GUI Status Type

Screen Type

GUI Status Type

Normal

Normal Screen

Screen Type

GUI Status Type

Modal Dialog Box

Dialog Box

Screen type defined in

the Screen Attributes of
the Screen Painter.
6

Graphical User Interface |

GUI status type defined

in the Menu Painter.
Dec-2008

2005 IBM Corporation

IBM Global Services

GUI Status Type (Contd.)

Screen Type

GUI Status Type

Normal

Normal Screen

Screen Type

GUI Status Type

Modal Dialog Box

Dialog Box

Screen type defined in

the Screen Attributes of
the Screen Painter.
7

Graphical User Interface |

GUI status type defined

in the Menu Painter.
Dec-2008

2005 IBM Corporation

IBM Global Services

Checking Function Code Triggered

** MZA05TOP - Top Include **

PROGRAM SAPMZA05 MESSAGE-ID
ZA.
TABLES YMOVIE.
DATA OKCODE(4).

Graphical User Interface |

To check the OK Code of an online

program, you must define this field in
both the screen (Field List) and the
program work area (Top Include).
Remember that these fields must be
given the same name.

Dec-2008

2005 IBM Corporation

IBM Global Services

Checking Function Code Triggered (Contd.)

** MZA05TOP - Top Include **

PROGRAM SAPMZA05 MESSAGE-ID
ZA.
TABLES YMOVIE.
DATA OKCODE(4).

Graphical User Interface |

To check the OK Code of an online

program, you must define this field in
both the screen (Field List) and the
program work area (Top Include).
Remember that these fields must be
given the same name.

Dec-2008

2005 IBM Corporation

IBM Global Services

Using the OKCODE

** MZA05O01 - PBO Modules **

MODULE INITIALIZE OUTPUT.
* code to set GUI status/title

Exit

Edit

Loop

Academy Awards
Year
Category

CLEAR OKCODE.
ENDMODULE.

1994

You should clear out the

PIC

OKCODE before a screen is

displayed to ensure that
an old value does not remain
if the user presses Enter.
** MZA05I01 - PAI Modules **

We only want to select a record

MODULE SELECT_LISTING INPUT.

IF OKCODE = EDIT.

from YMOVIE if the user has

invoked the EDIT function code
(e.g., clicked on the Edit
pushbutton).

10

Graphical User Interface |

code to select record from YMOVIE

ENDIF.

ENDMODULE.

Dec-2008

2005 IBM Corporation

IBM Global Services

Function Types

Function Code: Function codes of different types

can be created

Type
:Normal
Application
Function

11

Type E
: Exit
Command

Type S
: System
Function

Graphical User Interface |

Type P
: Local GUI
Function

Dec-2008

Type T
:Start
Transaction

2005 IBM Corporation

IBM Global Services

Function Types (Contd.)

Function Code: Function codes of different types

can be created

Type
: Normal
Application
Function

12

Type E
: Exit
Command

Type S
: System
Function

Graphical User Interface |

Type P
: Local GUI
Function

Dec-2008

Type T
:Start
Transaction

2005 IBM Corporation

IBM Global Services

Demonstration
Creation of an online program to display a academy awards screen.
Setting up the GUI status and title of the above screen.
Using OKCODE in the program to process the screen.

13

Graphical User Interface |

Dec-2008

2005 IBM Corporation

IBM Global Services

Practice
Creation of an online program to display a academy awards screen.
Setting up the GUI status and title of the above screen.
Using OKCODE in the program to process the screen.

14

Graphical User Interface |

Dec-2008

2005 IBM Corporation

IBM Global Services

Summary
A programs GUI is created in the Menu Painter.
Each program has a single GUI that contains the defined function codes.
A GUI is made up of one or many statuses. A GUI status can be one of three
types:
Normal Screen
Dialog Box
Context Menu

Another aspect of a GUI is the title bar. You can define any number of title bars
for a particular GUI.

15

Graphical User Interface |

Dec-2008

2005 IBM Corporation

IBM Global Services

Summary (Contd.)
To determine what function code the user invoked during the execution of an
online program, you can check two fields: OK Code and SY-UCOMM. Both of
these fields are updated with the function code invoked by the user. However,
under certain circumstances, SY-UCOMM is not updated. For this
reason, in online programming you should always check the OK Code.
Function codes of different types can be created:
- Program function,
E - Exit command,
S - System function,
P - Local GUI function,
T - Start transaction.

16

Graphical User Interface |

Dec-2008

2005 IBM Corporation

IBM Global Services

Questions
What is the use of the Menu Painter ?
What is a Function Code ?
What are the different types of function codes that can be created ?

17

Graphical User Interface |

Dec-2008

2005 IBM Corporation