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.
2 Graphical User Interface | Dec-2008 © 2005 IBM Corporation
IBM Global Services
Overview
Exit Edit Loop
Menu Painter
Academy Awards Using the Menu Painter, we can add
pushbuttons to the application toolbar
Year 1994 on both screens.
Category PIC
***Important Questions***
Exit Update Where do you set the GUI status/title?
What type of GUI status is used?
Academy Awards
How do you check the function code triggered?
Year 1994 What are the different function types?
Category PIC
Winner Forrest Gump
Notes The Shawshank Redemption should have won.
3 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
Menu bar
Assignments Toolbar Toolbar
4 Graphical User Interface | Dec-2008 © 2005 IBM Corporation
IBM Global Services
Set GUI Status/Title in PBO Module
** MZA05O01 - PBO Modules **
MODULE INITIALIZE OUTPUT.
Screen 9000
IF SY-DYNNR = 9000.
PROCESS BEFORE OUTPUT. SET PF-STATUS ‘FIRST’.
MODULE INITIALIZE. SET TITLEBAR ‘ONE’.
ELSE.
SET PF-STATUS
Screen 9001 ‘SECOND’.
SET TITLEBAR ‘TWO’.
PROCESS BEFORE OUTPUT. ENDIF.
MODULE INITIALIZE. ENDMODULE.
Notice that the call to module Current
“INITIALIZE” in the PBO of each SY-DYNNR = screen
screen refers to the same ABAP number
module.
5 Graphical User Interface | Dec-2008 © 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 GUI status type defined
the Screen Attributes of in the Menu Painter.
the Screen Painter.
6 Graphical User Interface | 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 GUI status type defined
the Screen Attributes of in the Menu Painter.
the Screen Painter.
7 Graphical User Interface | Dec-2008 © 2005 IBM Corporation
IBM Global Services
Checking Function Code Triggered
** MZA05TOP - Top Include ** To check the OK Code of an online
program, you must define this field in
PROGRAM SAPMZA05 MESSAGE-ID
both the screen (Field List) and the
ZA.
program work area (Top Include).
TABLES YMOVIE. Remember that these fields must be
DATA OKCODE(4). given the same name.
8 Graphical User Interface | Dec-2008 © 2005 IBM Corporation
IBM Global Services
Checking Function Code Triggered (Contd.)
** MZA05TOP - Top Include ** To check the OK Code of an online
program, you must define this field in
PROGRAM SAPMZA05 MESSAGE-ID
both the screen (Field List) and the
ZA.
program work area (Top Include).
TABLES YMOVIE. Remember that these fields must be
DATA OKCODE(4). given the same name.
9 Graphical User Interface | 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 CLEAR OKCODE.
ENDMODULE.
Academy Awards
Year 1994 You should “clear out” the
OKCODE before a screen is
Category PIC 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.
from YMOVIE if the user has IF OKCODE = ‘EDIT’.
invoked the ‘EDIT’ function code * code to select record from YMOVIE
(e.g., clicked on the ‘Edit’ ENDIF.
pushbutton). ENDMODULE.
10 Graphical User Interface | Dec-2008 © 2005 IBM Corporation
IBM Global Services
Function Types
Function Code: Function codes of different types
can be created
Type ‘ ’
Type ‘E’ Type ‘S’ Type ‘P’ Type
:Normal : Exit : System : Local GUI ‘T’ :Start
Application Command Function Function Transaction
Function
11 Graphical User Interface | Dec-2008 © 2005 IBM Corporation
IBM Global Services
Function Types (Contd.)
Function Code: Function codes of different types
can be created
Type ‘ ’
Type ‘E’ Type ‘S’ Type ‘P’ Type
: Normal : Exit : System : Local GUI ‘T’ :Start
Application Command Function Function Transaction
Function
12 Graphical User Interface | Dec-2008 © 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 program’s 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
