Menus & toolbars in PHP GTK

In this part of the PHP GTK programming tutorial, we will work with menus & toolbars.

A common part in a GUI application is a menubar. A menubar consists of objects called menus. Top-level menus have their labels on the menubar. The menus have menu items. Menu items are commands that perform a specific action inside the application. Menus can also have submenus, which have their own menu items.

Simple menu

In our first example, we will create a menubar with one file menu. The menu will have only one menu item. By selecting the item the application quits.

<?php

/* 
ZetCode PHP GTK tutorial

This example shows a simple menu.

author: Jan Bodnar
website: www.zetcode.com
last modified: August 2011
*/
 
class Example extends GtkWindow { 
     

    public function __construct() { 

        parent::__construct(); 
         
        $this->init_ui();

    } 

    public function init_ui() {

        $this->set_title('Simple menu');         
        $this->connect_simple('destroy', array('gtk', 'main_quit')); 

        $this->modify_bg(Gtk::STATE_NORMAL, new GdkColor(6400, 6400, 6440));
       
        $mb = new GtkMenuBar();

        $filemenu = new GtkMenu();
        $filemi = new GtkMenuItem("File");
        $filemi->set_submenu($filemenu);
       
        $exitmi = new GtkMenuItem("Exit");
        $exitmi->connect_simple('activate', array('gtk', 'main_quit'));              
        $filemenu->append($exitmi);

        $mb->append($filemi);

        $vbox = new GtkVBox(false, 2);
        $vbox->pack_start($mb, false, false, 0);

        $this->add($vbox);

        $this->set_default_size(250, 200); 
        $this->set_position(GTK::WIN_POS_CENTER);
        $this->show_all();         
    }
} 
     
new Example(); 
Gtk::main();
 
?>

This is a small example with minimal menubar functionality.

$mb = new GtkMenuBar();

The GtkMenuBar widget is created. This is a container for the individual menus.

$filemenu = new GtkMenu();
$filemi = new GtkMenuItem("File");
$filemi->set_submenu($filemenu);

Toplevel GtkMenuItem is created. A menu item represents an action in a GUI application.

$exitmi = new GtkMenuItem("Exit");
$exitmi->connect_simple('activate', array('gtk', 'main_quit'));              
$filemenu->append($exitmi);

Exit GtkMenuItem is created and appended to the File GtkMenuItem.

$mb->append($filemi);

Toplevel GtkMenuItem is appended to the GtkMenuBar widget.

$vbox = new GtkVBox(false, 2);
$vbox->pack_start($mb, false, false, 0);

Unlike in other toolkits, we have to take care of the layout management of the menubar ourselves. We put the menubar into the vertical box.

Simple menu
Figure: Simple menu

Submenu

Our final example demonstrates how to create a submenu. A submenu is a menu inside another menu.

<?php

/* 
ZetCode PHP GTK tutorial

This example shows a submenu.

author: Jan Bodnar
website: www.zetcode.com
last modified: August 2011
*/
 
class Example extends GtkWindow { 
     

    public function __construct() { 

        parent::__construct(); 
         
        $this->init_ui();

    } 

    public function init_ui() {

        $this->set_title('Submenu');         
        $this->connect_simple('destroy', array('gtk', 'main_quit')); 

        $this->modify_bg(Gtk::STATE_NORMAL, new GdkColor(6400, 6400, 6440));
       
        $mb = new GtkMenuBar();

        $filemenu = new GtkMenu();
        $filemi = new GtkMenuItem("File");
        $filemi->set_submenu($filemenu);

        $mb->append($filemi);

        $imenu = new GtkMenu();

        $importm = new GtkMenuItem("Import");
        $importm->set_submenu($imenu);

        $inews = new GtkMenuItem("Import news feed...");
        $ibookmarks = new GtkMenuItem("Import bookmarks...");
        $imail = new GtkMenuItem("Import mail...");

        $imenu->append($inews);
        $imenu->append($ibookmarks);
        $imenu->append($imail);

        $filemenu->append($importm);
       
        $exitmi = new GtkMenuItem("Exit");
        $exitmi->connect_simple('activate', array('gtk', 'main_quit'));
                
        $filemenu->append($exitmi);

        $vbox = new GtkVBox(false, 2);
        $vbox->pack_start($mb, false, false, 0);

        $this->add($vbox);

        $this->set_default_size(320, 250); 
        $this->set_position(GTK::WIN_POS_CENTER);
        $this->show_all();         
    }
} 
     
new Example(); 
Gtk::main();
 
?>

Submenu creation.

$imenu = new GtkMenu();

A submenu is a regular GtkMenu.

$importm = new GtkMenuItem("Import");
$importm->set_submenu($imenu);

It is a submenu of a menu item, which belogs to toplevel file menu.

$inews = new GtkMenuItem("Import news feed...");
$ibookmarks = new GtkMenuItem("Import bookmarks...");
$imail = new GtkMenuItem("Import mail...");

$imenu->append($inews);
$imenu->append($ibookmarks);
$imenu->append($imail);

Submenus have their own menu items.

Submenu
Figure: Submenu

Image menu

In the next example, we will further explore the menus. We will add images and accelerators to our menu items. Accelerators are keyboard shortcuts for activating menu items.

<?php

/* 
ZetCode PHP GTK tutorial

This example shows a menu with
images, accelerators and a separator.

author: Jan Bodnar
website: www.zetcode.com
last modified: August 2011
*/
 
class Example extends GtkWindow { 
     

    public function __construct() { 

        parent::__construct(); 
         
        $this->init_ui();

    } 

    public function init_ui() {

        $this->set_title('Image menu');         
        $this->connect_simple('destroy', array('gtk', 'main_quit')); 

        $this->modify_bg(Gtk::STATE_NORMAL, new GdkColor(6400, 6400, 6440));
       
        $mb = new GtkMenuBar();

        $filemenu = new GtkMenu();
        $filemi = new GtkMenuItem("File");
        $filemi->set_submenu($filemenu);

        $mb->append($filemi);


        $agr = new GtkAccelGroup();
        $this->add_accel_group($agr);

        $newi = new GtkImageMenuItem(Gtk::STOCK_NEW, $agr);
        $newi->add_accelerator('activate', $agr, Gdk::KEY_N, 
             Gdk::CONTROL_MASK, Gtk::ACCEL_VISIBLE);
        $newi->connect_simple('activate', array($this, 'on_new_selected')); 
        $filemenu->append($newi);

        $openmi = new GtkImageMenuItem(Gtk::STOCK_OPEN, $agr);
        $openmi->add_accelerator('activate', $agr, Gdk::KEY_O, 
             Gdk::CONTROL_MASK, Gtk::ACCEL_VISIBLE);
        $filemenu->append($openmi);

        $sep = new GtkSeparatorMenuItem();
        $filemenu->append($sep);

        $exitmi = new GtkImageMenuItem(Gtk::STOCK_QUIT, $agr);
        $exitmi->add_accelerator('activate', $agr, Gdk::KEY_Q, 
             Gdk::CONTROL_MASK, Gtk::ACCEL_VISIBLE);
        $exitmi->connect_simple('activate', array('gtk', 'main_quit'));     
        $filemenu->append($exitmi);       
       
        $vbox = new GtkVBox(false, 2);
        $vbox->pack_start($mb, false, false, 0);

        $this->add($vbox);

        $this->set_default_size(320, 250); 
        $this->set_position(GTK::WIN_POS_CENTER);
        $this->show_all();         
    }

    public function on_new_selected() {
        print "new";
    }

} 
     
new Example(); 
Gtk::main();
 
?>

Our example shows a toplevel menu item with three sublevel menu items. Each of the menu items has an image and an accelerator. The accelerator for the quit menu item quits the application. The accelerator for the new menu item prints 'new' to the console.

$agr = new GtkAccelGroup();
$this->add_accel_group($agr);

To work with accelerators, we create a global GtkAccelGroup object. It will be used later.

$newi = new GtkImageMenuItem(Gtk::STOCK_NEW, $agr);
$newi->add_accelerator('activate', $agr, Gdk::KEY_N, 
      Gdk::CONTROL_MASK, Gtk::ACCEL_VISIBLE);
$newi->connect_simple('activate', array($this, 'on_new_selected')); 
$filemenu->append($newi);

A GtkImageMenuItem is created. The image comes from the stock of images. We create also a Ctrl+N accelerator. When we select the menu item with a mouse or press the accelerator, a message is printed to the console.

$sep = new GtkSeparatorMenuItem();
$filemenu->append($sep);

These lines create a separator. It is used to put menu items into logical groups.

Image menu
Figure: Image menu

Menus group commands that we can use in application. Toolbars provide a quick access to the most frequently used commands.

Simple toolbar

Next we create a simple toolbar. A toolbar provides a quick access to the most frequently used functionality of an application.

<?php

/* 
ZetCode PHP GTK tutorial

This example shows a toolbar widget.

author: Jan Bodnar
website: www.zetcode.com
last modified: August 2011
*/
 
class Example extends GtkWindow { 
     

    public function __construct() { 

        parent::__construct(); 
         
        $this->init_ui();

    } 

    public function init_ui() {

        $this->set_title('Toolbar');         
        $this->connect_simple('destroy', array('gtk', 'main_quit')); 

        $toolbar = new GtkToolbar();
        $toolbar->set_toolbar_style(Gtk::TOOLBAR_ICONS);

        $newtb = GtkToolButton::new_from_stock(Gtk::STOCK_NEW);
        $opentb = GtkToolButton::new_from_stock(Gtk::STOCK_OPEN);
        $savetb = GtkToolButton::new_from_stock(Gtk::STOCK_SAVE);
        $sep = new GtkSeparatorToolItem();
        $quittb = GtkToolButton::new_from_stock(Gtk::STOCK_QUIT);

        $toolbar->insert($newtb, 0);
        $toolbar->insert($opentb, 1);
        $toolbar->insert($savetb, 2);
        $toolbar->insert($sep, 3);
        $toolbar->insert($quittb, 4);
        
        $quittb->connect_simple("clicked", array('Gtk', 'main_quit'));

        $vbox = new GtkVBox(false, 2);
        $vbox->pack_start($toolbar, false, false, 0);

        $this->add($vbox);

        $this->set_default_size(250, 200); 
        $this->set_position(GTK::WIN_POS_CENTER);
        $this->show_all();         
    }
} 
     
new Example(); 
Gtk::main();
 
?>

The example shows a toolbar and four tool buttons.

$toolbar = new GtkToolbar();

A GtkToolbar widget is created.

$toolbar->set_toolbar_style(Gtk::TOOLBAR_ICONS);

On toolbar, we show only icons. No text.

$newtb = GtkToolButton::new_from_stock(Gtk::STOCK_NEW);

A GtkToolButton with an image from stock is created. The image comes from the built-in stock of images.

$sep = new GtkSeparatorToolItem();

This is a separator. It can be used to put toolbar buttons into logical groups.

$toolbar->insert($newtb, 0);
$toolbar->insert($opentb, 1);
...

Toolbar buttons are inserted into the toolbar widget. The first parameter of the insert() method is the tool button. The second is the position on the toolbar.

Toolbar
Figure: Toolbar

In this chapter of the PHP GTK tutorial, we showed, how to work with menus & toolbars.