Skip to main content
Email Password   helpLost your password?
Screenshot - GLUI_Window_Template.jpg

Contents

Introduction

This article describes in detail how to create your first GLUI window with some basic controls inside it, and provides you with a template for your OpenGL applications.

This article can be used in the following ways:

Make sure you read the GLUT Window Template article as a prerequisite to this article. One important thing to note is that GLUI is a C++ library, which means that your code must be written in files with CPP extension rather than C, otherwise the linker will complain.

What is GLUI?

GLUI is a C++ GUI library, built entirely on top of GLUT, to provide GUI controls such as buttons, checkboxes, radio buttons, labels, panels, text fields and spinners to OpenGL applications. It is window-system independent, relying on GLUT to handle all system-dependent issues, such as window, keyboard, joystick and mouse management. The GLUI API is very simple, allowing us to create new GLUI windows and add controls inside them with a single line of code. To add to its simplicity, GLUI automatically positions and sizes controls when placed on their window.

How Does GLUI Look Like?

Here's an example GLUI window taken from the GLUI Manual, showing the different controls. This window is rendered entirely in OpenGL. It therefore looks the same on PCs, Macs, SGIs, and other UNIXes, using either SGI's implementation of OpenGL, Microsoft's, or Mesa's.

GLUI_Window_Template_1.jpg

In addition to the above controls, GLUI has seen some additional controls after its new 2.35 version release in July 2006. You can see below the new scroll bar, text area, file browser, tree, tree panel and list.

GLUI 3.2 new controls

Why Have a GLUI Window Template?

When OpenGL applications get more complex, we need something more than a GLUT mouse, keyboard, and/or popup menus to interact with our OpenGL objects drawn on the window. GLUI gives us more flexibility by allowing us to add GUI components to interact with our OpenGL objects, such as buttons, check boxes, radio buttons, spinners, list boxes, lists, trees, file browsers, text fields, text areas, and the special controls: rotation and translation.

To avoid having to write the same code every time you want to create an OpenGL graphical application with GUI components, this program code can be used as a template to get you directly started.

Usage

Running the Program

In order to run the program, three dynamic link libraries (DLLs) are required: opengl32.dll, glu32.dll, glut32.dll. The opengl32.dll and glu32.dll already come with your Windows OS and are found in the system folder. To run the executable, you have to download the glut32.dll and copy it into your system folder. You can find all the DLL files in the attached zip file GLUI_Window_Template_dll.zip under Visual C++\dll.

Compiling the Code with Microsoft Visual C++

In order to write a C++ OpenGL application with GLUI using Microsoft Visual Studio on a Windows platform, you need the following files:

You can find all the header files and lib files in the attached zip file GLUI_Window_Template_dll.zip under Visual C++\include\GL and Visual C++\lib respectively.

Microsoft Visual C++ 6

To use the code under a Visual C++ 6.0 environment, perform the following steps:

Using the Code

The source code is intended to be used as a template for your OpenGL applications. To use it in your new application, you can simply rename the CPP file and add it to your Visual Studio project.

Note

Please note that GLUI is a C++ library, and thus doesn't work with C. So if you're obtaining linkage errors while trying to build a GLUI program, just check that all file extensions are CPP and not C.

Explaining the Code

Knowing that GLUI is built on top of GLUT, it requires very little change to integrate GLUI components with an existing GLUT application. Thus, we will start with the GLUT Window Template and apply changes to it until we create our GLUI Window Template.

1- Include

First, we start by including the header file for GLUI using the following include directive:

#include <GL/glui.h>

There is no need to include <GL/gl.h>, <GL/glu.h>, or <GL/glut.h> since <GL/glui.h> already includes them.

2- GLUT Window

After creating our GLUT window, we need to make sure that we keep track of the window id so that GLUI can interact with it and send it redisplay events.

main_window = glutCreateWindow (window_title);

3- Callback Functions

GLUT 'callback' functions are registered as usual, except for the Idle function.

// Set the callback functions
glutDisplayFunc (display);
glutReshapeFunc  (reshape);
glutMouseFunc (mouse);
glutMotionFunc (motion);
glutPassiveMotionFunc (pmotion);
glutKeyboardFunc (keyboard);
glutSpecialFunc (special);
glutEntryFunc (entry);

4- Idle Callback Function

An idle callback function is called whenever an idle state is reached. An idle state is a state where no system events are received for processing as callbacks. The glutIdleFunc sets the idle callback function, which is continuously called as long as there are no events received. This means that we should minimize the amount of computation and rendering in the idle function to have a more interactive application. Passing NULL to glutIdleFunc disables the generation of the idle callback.

In a normal GLUT application, the idle function is registered as follows:

glutIdleFunc (idle);

However, when GLUI is used, the idle callback function is registered through the GLUI global object, GLUI_Master. The reason for this is that GLUI makes extensive use of idle events. Logically, it does so in order to keep refreshing the GLUI controls and to listen to user's interactions with them.

GLUI_Master.set_glutIdleFunc (idle);

If there is no Idle callback to be used, NULL is passed:

GLUI_Master.set_glutIdleFunc (NULL);

Notes

5- GLUI Window

The GLUI window is created as follows:

//  pointer to a GLUI window
GLUI * glui_window;

//  Create GLUI window
glui_window = GLUI_Master.create_glui ("Options");

Here is the create_glui function definition, as described in the GLUI manual:

GLUI *GLUI_Master_Object::create_glui(char *name, int flags=0, int x=-1,
    int y=-1);
Attribute Description
name Name of new GLUI window
flags Initialization flags. No flags are defined in the current version
x,y Initial location of window. Note that no initial size can be specified, because GLUI automatically resizes Windows to fit all controls

Note that flags, x, and y are optional arguments. If they are not specified, default values will be used. GLUI provides default values for arguments whenever possible. The function returns a pointer to a new GLUI window.

In addition to the function that creates the window, GLUI also supports functions to enable, disable, hide, show, or close a window. Below is the prototype and description of each of these functions, as shown in the GLUI manual:

Name Prototype Description
get_glut_window_id int GLUI::get_glut_window_id( void ); Returns the standard GLUT window ID of a GLUI window
enable, disable void GLUI::enable( void );void GLUI::disable( void ); Enables or disables (grays out) a GLUI window. No controls are active when a GLUI window is disabled
hide void GLUI::hide( void ); Hides a GLUI window or subwindow. A hidden window or subwindow cannot receive any user input
show void GLUI::show( void ); Unhides a previously-hidden GLUI window or subwindow
close void GLUI::close( void ); Cleanly destroys a GLUI window or subwindow
close_all void GLUI_Master_Object::close_all( void ); Cleanly destroys all GLUI windows and subwindows. This function is called by the following example code: GLUI_Master.close_all();

6- Add GUI Controls

Live Variables

GLUI can associate live variables with most types of controls. Live variables are simply C variables that are automatically updated when the user interacts with a GLUI control. If the user directly updates a live variable from the code without using the set method of the control, then we need to call the sync_live () function in order to synchronize the control with the value of the live variable.

For example, let's say we have a checkbox associated with a live variable as follows:

int draw = 0;
glui_window->add_checkbox ( "Draw", &draw );

When the program starts, the Draw checkbox will be un-checked since the value of the draw live variable is 0. If the value of draw was 1, then the Draw checkbox would have appeared as checked. Let's say that after the program loads, the user clicks on the checkbox to make it checked as follows:

GLUI Check Box

When that happens, GLUI automatically updates the value of the draw live variable to 1.

Also, let's assume that somewhere in the code, the programmer updates the value of the draw value back to 0. Doing this will not affect the control, and thus the control and the live variable will become un-synchronized.

draw = 0;

In order to avoid this, we can call the sync_live() method of the current window to update the user interface:

glui_window->sync_live(); 

In case there are multiple windows, we can use the sync_live_all() function of the GLUI Master Object to synchronize live variables and controls in all GLUI windows:

GLUI_Master.sync_live_all();

Otherwise, we should not apply any direct changes to live variables. We can avoid that by directly using the set method(s) of the control:

draw_checkbox.set_int_val ( 0 );

Callbacks

In addition to having live variables to track the values of controls, GLUI can also generate callbacks whenever the value of a control changes. When a control is first created, the user may optionally specify the callback function that will be called whenever the control's value changes, along with an integer ID to identify the calling control. This would mean that multiple controls may call the same callback function, and still be identified through their different IDs passed to the function.

glui_window->add_checkbox ( "Draw", &draw, ID,
    callback_func );

List of Controls

Here is the list of supported control types, their GLUI name, description, accessor functions, live variables and callbacks, as copied from the GLUI Manual:

Control Type Class Name Used for... Set/Get values Live var? Callback?
Panel GLUI_Panel grouping controls into boxes
-
-
N
Column GLUI_Column grouping controls into columns
-
-
N
Rollout GLUI_Rollout grouping controls into collapsible boxes
-
-
N
Button GLUI_Button invoking user actions
-
-
Y
Checkbox GLUI_Checkbox handling booleans
get_int_val
set_int_val
int
Y
Radio Group,
Radio Button
GLUI_RadioGroup, GLUI_RadioButton handling mutually-exclusive options
get_int_val
set_int_val
int
Y
Static Text GLUI_StaticText plain text labels
set_text
-
N
Editable Text GLUI_EditText text that can be edited and optionally interpreted as integers or floats. Upper and lower bounds can be placed on integers and floats

get_int_val
set_int_val
get_float_val
set_float_val
get_text set_text

int
float
text
Y
Rotation GLUI_Rotation Inputting rotation values via an arcball
get_float_array_val
float [16]
Y
Translation GLUI_Translation Inputting X, Y, and Z values
get_x
get_y
get_z
float [1] OR [2]
Y
Listbox GLUI_Listbox Choosing from a list of items
get_int_val
int
Y
Spinner GLUI_Spinner interactively manipulating numeric values. Supports single clicks, click-hold, and click-drag. Upper and lower bounds can be specified
get_int_val
set_int_valget_float_val
set_float_val
int
float
Y
Separator GLUI_Separator separating controls with simple horizontal lines
-
-
N

Common Functions

Knowing that GLUI is implemented through Object Oriented C++, all the GLUI controls inherit from the base class GLUI_Control. There are two functions to create a control: add_control () and add_control_to_panel (), where control is replaced by the type of the control. For example, we can create a checkbox using any of the following two functions:

This function adds a checkbox at the top level of the window.

GLUI_Checkbox *GLUI::add_checkbox( char *name, int *live_var=NULL, int id=-1,
    GLUI_Update_CB callback=NULL);

This function nests the checkbox within a panel.

GLUI_Checkbox *GLUI::add_checkbox_to_panel( GLUI_Panel *panel, char *name,
    int *live_var=NULL, int id=-1, GLUI_Update_CB callback=NULL);

In addition to the common method for creating controls, there are common functions that can be used on most of the controls and are all inherited from the GLUI_Control base class. Here is the list of those methods, copied from the GLUI manual:

Name Prototype Description
set_name

void GLUI_Control::set_name( char *name );

name - New label for control

Sets the label on a button, checkbox, etc.
set_w, set_h

void GLUI_Control::set_w( int new_size );
void GLUI_Control::set_h( int new_size );

new_size - New minimum width or height for control

Sets new minimum width/height for a control. set_w() is especially useful to increase the size of the editable text area in an editable text control or spinner.
get, set int GLUI_Control::get_int_val( void );
float GLUI_Control::get_float_val( void );
void GLUI_Control::get_float_array_val( float float_array_ptr );
char *GLUI_Control::get_text( void );
void GLUI_Control::set_int_val( int int_val );
void GLUI_Control::set_float_val( float float_val );
void GLUI_Control::set_float_array_val( float *float_array_val );
void GLUI_Control::set_text( char *text);
Gets or sets the value of a control. Refer to the individual control descriptions below to see which values can be read and set for each control.
disable, enable void GLUI_Control::enable( void );
void GLUI_Control::disable( void );
Disables (grays out) or enables an individual control. A disabled control cannot be activated or used. Disabling a radio group disables all radio buttons within it, and disabling a panel disables all controls within it (including other panels). Enabling behaves similarly.
set_alignment

void GLUI_Control::set_alignment( int align );

align - New alignment. May be one of GLUI_ALIGN_CENTER, GLUI_ALIGN_RIGHT, or GLUI_ALIGN_LEFT.

Sets the alignment of a control to left-aligned, right-aligned, or centered.

Adding Controls

After describing live variables, callbacks, list of controls, and common functions, now it's time to see how controls are added and how they would interact with our OpenGL application. Below is the list of GLUI function prototypes for every control. For more details about each of the following functions, please check the GLUI manual.

Control add_control \ add_control_to_panel \ Other
Panels
  • GLUI_Panel *GLUI::add_panel( char *name, int type = GLUI_PANEL_EMBOSSED );
  • GLUI_Panel *GLUI::add_panel_to_panel( GLUI_Panel *panel, char *name, int type = GLUI_PANEL_EMBOSSED );
Rollouts
  • GLUI_Rollout *GLUI::add_rollout( char *name, int open = true );
  • GLUI_Rollout *GLUI::add_rollout_to_panel( GLUI_Panel *panel, char *name, int open = true );
Columns
  • void GLUI::add_column( int draw_bar = true );
  • void GLUI::add_column_to_panel( GLUI_Panel *panel, int draw_bar = true );
Buttons
  • GLUI_Button *GLUI::add_button( char *name, int id=-1, GLUI_Update_CB callback=NULL);
  • GLUI_Button *GLUI::add_button_to_panel( GLUI_Panel *panel, char *name, int id=-1, GLUI_Update_CB callback=NULL);
Checkboxes
  • GLUI_Checkbox *GLUI::add_checkbox( char *name, int *live_var=NULL, int id=-1, GLUI_Update_CB callback=NULL);
  • GLUI_Checkbox *GLUI::add_checkbox( char *name, int *live_var=NULL, int id=-1, GLUI_Update_CB callback=NULL);
Radio Buttons
  • GLUI_RadioGroup *GLUI::add_radiogroup( int *live_var=NULL, int user_id=-1, GLUI_Update_CB callback=NULL);
  • GLUI_RadioGroup *GLUI::add_radiogroup_to_panel( GLUI_Panel *panel, int *live_var=NULL, int user_id=-1, GLUI_Update_CB callback = NULL );
  • GLUI_RadioButton *GLUI::add_radiobutton_to_group( GLUI_RadioGroup *group, char* name );
Static Text
  • GLUI_StaticText *GLUI::add_statictext( char *name );
  • GLUI_StaticText *GLUI::add_statictext_to_panel( GLUI_Panel *panel, char* name );
Editable Text Boxes
  • GLUI_EditText *GLUI::add_edittext( char *name, int data_type=GLUI_EDITTEXT_TEXT, void *live_var=NULL, int id=-1, GLUI_Update_CB callback = NULL );
  • GLUI_EditText *GLUI::add_edittext_to_panel( GLUI_Panel *panel, char *name, int data_type=GLUI_EDITTEXT_TEXT, void *live_var=NULL, int id=-1, GLUI_Update_CB callback = NULL );
  • void GLUI_EditText::set_int_limits( int low, int high, int limit_type = GLUI_LIMIT_CLAMP );
  • void GLUI_EditText::set_float_limits( float low, float high, int limit_type = GLUI_LIMIT_CLAMP );
Spinners
  • GLUI_Spinner *GLUI::add_spinner( char *name, int data_type=GLUI_SPINNER_INT, void *live_var=NULL, int id=-1, GLUI_Update_CB callback = NULL );
  • GLUI_Spinner *GLUI::add_spinner_to_panel( GLUI_Panel *panel, char *name, int data_type=GLUI_SPINNER_INT, void *live_var=NULL, int id=-1, GLUI_Update_CB callback = NULL );
  • void GLUI_Spinner::set_int_limits( int low, int high, int limit_type = GLUI_LIMIT_CLAMP );
  • void GLUI_Spinner::set_float_limits( float low, float high, int limit_type = GLUI_LIMIT_CLAMP );
  • void GLUI_Spinner::set_speed( float speed );
Separators
  • void GLUI::add_separator( void );
  • void GLUI::add_separator_to_panel( GLUI_Panel *panel );
Rotation Controls
  • GLUI_Rotation *GLUI::add_rotation( char *name, float *live_var=NULL, int id=-1, GLUI_Update_CB callback = NULL );
  • GLUI_Rotation *GLUI::add_rotation_to_panel( GLUI_Panel *panel, char *name, float *live_var=NULL, int id=-1, GLUI_Update_CB callback = NULL );
  • void GLUI_Rotation::get_float_array_val( float *array_ptr );
  • void GLUI_Rotation::set_float_array_val( float *array_ptr );
  • void GLUI_Rotation::set_spin( float damping_factor );
  • void GLUI_Rotation::reset( void );
Translation Controls
  • GLUI_Translation *GLUI::add_translation( char *name, int trans_type, float *live_var=NULL, int id=-1, GLUI_Update_CB callback = NULL );
  • GLUI_Translation *GLUI::add_translation_to_panel( GLUI_Panel *panel, char *name, int trans_type, float *live_var=NULL, int id=-1, GLUI_Update_CB callback = NULL );
  • float GLUI_Translation::get_x( void );
  • float GLUI_Translation::get_y( void );
  • float GLUI_Translation::get_z( void );
  • void GLUI_Translation::set_x( float x );
  • void GLUI_Translation::set_y( float y );
  • void GLUI_Translation::set_z( float z );
  • void GLUI_Translation::set_speed( float speed_factor );
Listboxes
  • GLUI_Listbox *GLUI::add_listbox( char *name, void *live_var=NULL, int id=-1, GLUI_Update_CB callback = NULL );
  • GLUI_Listbox *GLUI::add_listbox_to_panel( GLUI_Panel *panel, char *name, void *live_var=NULL, int id=-1, GLUI_Update_CB callback = NULL );
  • int GLUI_Listbox::add_item( int id, char *text );
  • int GLUI_Listbox::delete_item( int id );
  • int GLUI_Listbox::delete_item( char *text );
Adding Object Properties
Object Properties GLUI Panel
Adding Object Type
Object Type GLUI Rollout Panel
Rollout Panel
Object Type GLUI Rollout Panel Collapsed
Collapsed Rollout Panel
Adding Transformation
GLUI Transformatoin Panel
GLUI Translation Control XY
GLUI Translation Control X
GLUI Translation Control Y
GLUI Translation Control Z
GLUI_TRANSLATION_XY
GLUI_TRANSLATION_X
GLUI_TRANSLATION_Y
GLUI_TRANSLATION_Z
Adding Quit Button
GLUI Quit Button

Finally, after adding all of the above controls, we add the Quit button as follows:

//  Add the Quit Button
glui_window->add_button ("Quit", QUIT_BUTTON, glui_callback);

When the Quit button is clicked, the glui_callback function is executed with QUIT_BUTTON ID as its parameter and causes the program to exit:

//  Quit Button clicked
case QUIT_BUTTON:
    printf ("Quit Button clicked... Exit!\n");

    exit (1);

break;

7- Merge GLUT & GLUI

After creating the GLUI window and adding controls to it, we need to associate it with the "main graphics window" as follows:

glui_window->set_main_gfx_window (main_window);

When a control in the GLUI window changes value, a redisplay request will be sent to this main graphics window.

8- Main Event Loop

Invoke the standard GLUT main "event loop":

glutMainLoop();

Conclusion

I think this article can significantly help in creating an OpenGL application with graphical user controls, and at the same time, the template can be used to save lots of copy and paste from old projects or the Internet.

In case you find this template useful or have suggestions, please let me know.

References

Revision History

25/09/2007

30/08/2007

16/07/2007

21/07/2005

You must Sign In to use this message board.
 
 
Per page   
 FirstPrevNext
QuestionError : fatal error C1010: unexpected end of file while looking for precompiled header directive Pin
Nila G
14:04 30 Oct '09  
GeneralGlui::close() error Pin
Ronen Veksler
4:42 27 Oct '09  
GeneralRe: Glui::close() error Pin
Ali BaderEddin
15:37 27 Oct '09  
GeneralRe: Glui::close() error Pin
Ronen Veksler
20:27 27 Oct '09  
GeneralRe: Glui::close() error Pin
Ali BaderEddin
6:51 28 Oct '09  
GeneralRe: Glui::close() error Pin
Ali BaderEddin
6:55 28 Oct '09  
GeneralRe: Glui::close() error Pin
Ronen Veksler
9:26 28 Oct '09  
Generalcreate_glui_subwindow and Window Close Button Pin
elfinit
13:41 23 Oct '08  
GeneralInformation for VS 2008 Pin
KarstenK
4:26 4 Aug '08  
GeneralRe: Information for VS 2008 Pin
Ali BaderEddin
15:51 5 Aug '08  
GeneralFull project source Pin
jemmyell
7:21 16 Jun '08  
GeneralRe: Full project source Pin
Ali BaderEddin
8:49 16 Jun '08  
GeneralCan I find GLUI with menu Pin
twzhen
4:24 6 Oct '07  
GeneralRe: Can I find GLUI with menu Pin
Ali BaderEddin
16:21 6 Oct '07  
GeneralCould not Download DLL [modified] Pin
Ranjan.D
15:48 30 Aug '07  
GeneralRe: Could not Download DLL Pin
Ali BaderEddin
21:46 30 Aug '07  
GeneralRe: Could not Download DLL Pin
Ali BaderEddin
4:59 4 Sep '07  
GeneralRe: Could not Download DLL Pin
Ranjan.D
22:29 17 Sep '07  
GeneralRe: Could not Download DLL Pin
Ali BaderEddin
22:39 17 Sep '07  
GeneralRe: Could not Download DLL [modified] Pin
s22781
23:22 29 Sep '07  
GeneralRe: Could not Download DLL Pin
Ali BaderEddin
8:01 30 Sep '07  
GeneralRe: Could not Download DLL Pin
s22781
8:20 30 Sep '07  
GeneralRe: Could not Download DLL Pin
Ali BaderEddin
8:54 30 Sep '07  


Last Updated 31 Jan 2008 | Advertise | Privacy | Terms of Use | Copyright © CodeProject, 1999-2009