Graphics Interface Kit/2 Brings Ease to Creating GUIs

From EDM2
Jump to: navigation, search

By Stacey Miller

IBM (Vienna, Austria) recently announced the IBM Graphics Interface Kit/2 (GIK/2) product. GIK/2 is a product that lets programmers focus on application logic, rather than graphic programming.

With the advent of GUI-based integrated environments, such as IBM's OS/2 Presentation Manager (PM), market demand has increased for products providing graphical front-ends. Many tools on the market let you develop standard GUI interfaces. The GIK/2 product is different - it is a toolkit that assists you in creating abstract graphical front-ends for applications. An example of an abstract front-end is shown in figure 1.


Figure 1. Abstract GUI front-end

Previously when a programming shop wanted to implement GUIs in their applications, they had to make a substantial financial and personnel commitment. Today, with the help of IBM GIK/2, you can rapidly develop prototypes of your data objects and create skeleton C-language files. GIK/2 also provides you with an interface to 300+ functions, which links the prototype to your application code. These functions consists of event and action handlers, as well as API calls.

This article describes creating a GUI application using GIK/2.

Development Overview

For most of your development, you will use GIK/2's easy-to-use, menu-driven design tool. The design tool lets you create a design program quickly, by letting you define the parameters that characterize your GUI. Then, GIK/2 generates a source-code skeleton for your customizing C code, based on these parameters. All of the parameters are saved in the .DF file; your custom C program uses them during runtime.

Defining Symbol Types

Symbols are the application building blocks. GIK/2 defines two kinds of symbols - nodes and links. Nodes are the objects that the end-user can manipulate; links are the relationship connecting either other links or nodes. Symbols can consist of different parts, just as a car consists of an engine, tires, and wheels. The symbol part is the smallest unit that can be acted on.

In addition to defining multiple forms for each symbol, GIK/2 lets you define multiple shapes for each form. While you must specify a standard shape, you also optionally can specify a palette or drag shape.

Whether you define one or many symbol parts and forms, GIK/2 uses the same application code for each single symbol.

Symbols can take on many shapes. Use the GIK/2 shape definition window to develop the shape's graphical elements. Associate one or more elements with each symbol part. The shape definition window is a WYSIWYG editor. In addition to drawing polylines, arcs, or boxes, GIK/2 lets you import icons, bit maps, and pointers.

Defining the Rest of Your Interface

Use the GIK/2 graphics editor to define the look of your windows. For example:

  • Define symbol palettes
  • Customize menu bars
  • Specify overview windows
  • Specify colors
  • Define context-sensitive help panels

After you specify how the windows look, specify the things you will let the end-user to do to the object, called editing characteristics. For example, you might restrict the actions on some objects.

Finally, tell the GIK/2 design tool to generate skeleton files for customizing code. Customizing code consists of action and event handlers. GIK/2 generates the following files:

  • Include files
  • Action handlers
  • Event handlers
  • Definition files
  • Make files

Runtime Overview

The runtime component of GIK/2 contains a small starter program, as well as DLLs having over 300 APIs, events, and actions. Running GIK/2's starter program gives you access to a powerful and generic graphics editor. This editor provides you with a set of windows, menus, and supporting features. The characteristics of the graphics editor are dependent on the definitions in your .DF file and can be customized using either the design tool or by writing customizing code. During runtime, the design file populates the interface with symbols, the customizing code synchronizes the interface with the application, and the help library provides context-sensitive help.

The runtime window is where the action takes place... it is where you check to see whether or not your objects do what they're supposed to do. Use the runtime window to see if symbols can be moved, added, or deleted as planned.


The GIK/2 program comes with approximately 50 standard, generic actions. Even though they are functional, you must write customizing code to conform them to your specific needs.

Explicit actions are actions that you invoke from the menu bar. Implicit actions are actions that you invoke using the mouse. The association between a menu choice and an explicit action must be defined in the design file.

If, however, you want to add your own actions invoked from the menu bar, you must associate these menu choices with action handlers (a C function that is called when the user selects one of these menu choices). Each action handler contains a switch statement; while each menu choice associated with that action handler consists of a case statement.


Events are predefined points in GIK/2 processing where you can define user-exit routines, called event handlers, which let you customize the behavior of the graphic interface and link the graphics interface to the application code.

Event handler functions provide the key link between the graphic created with the GIK/2 design tool and the application data. When you register each event handler in the design tool, GIK/2 creates code templates for each handler.

Graphics Library Functions

With the GIK/2 program, you get 300+ high-level graphics functions. Call these functions within your C-language program to change the default behavior of GIK/2. Functions are available to connect graphical symbols to the application code that they represent, initialize and quit GIK/2 windows from the application main code, and process events.

Again, the purpose of using a GUI programming tool remains clear. Instead of concentrating on graphic programming and associations, you are now free to concentrate on your application logic.

Customizing with C Code

After using the GIK/2 design tool to create your design and register your event handlers, you are finally ready to work on the customizing code to build a running application. Your customizing code adds the application logic that links the application data to your graphical interface. The collection of event and action handlers is your customized C code and will reside in an OS/2 DLL.


So there you have it... all the necessary components of the complete graphics programming toolkit:

  • A graphics editor with all the basic features needed by any graphics interface.
  • A design tool that enables you to quickly adapt the graphics editor to specific application needs A powerful graphics library that allows you to link your graphics interface to your application code.

Now that you've read about it, use it! Your accompanying Developer Connection CD-ROM contains a demo version of the GIK/2 product. Use the demo to create your own GUI applications, and find out how easy using the GIK/2 product really is.

Related Information

This article was based on the paper Graphics Interface Kit/2 A toolkit for graphical visualization and Manipulation of Data by Sylvia Hansjakob (Manager of the GIK/2 Development Team) and Roland Hatschka (GIK/2 team programmer). It was edited for this publication by Stacey Miller, the Editor of The Developer Connection News.

Reprint Courtesy of International Business Machines Corporation, © International Business Machines Corporation