PHP-GTK2 Newsletter

PHP-GTK2 Tips & Techniques
FREE Newsletter
by kksou



Sample Code 425: How to place a background image in GtkEventBox - Part 3 - with GtkTable and GtkTreeView?
Written by kksou   
Monday, 28 January 2008
Problem

This example achives the same as the previous one, i.e. placing a background image in a GtkEventBox. But I added a mixture of GtkVBox, GtkTable, GtkLabel, GtkEntry and GtkTreeView to show that this method works with any GtkEventBox contents as shown below:

How to place a background image in GtkEventBox - Part 3 - with GtkTable and GtkTreeView?


Solution

Sample Code

Note: The following image files are required by the sample code below. Please save a copy of the image files and put them in the same directory where you store the sample code.

 disc_green.png
 disc_blue.png

1   
2   
3   
4   
5   
6   
7   
8   
9   
10   
11   
12   
13   
14   
15   
16   
17   
18   
19   
20   
21   
22   
23   
24   
25   
26   
27   
28   
29   
30   
31   
32   
33   
34   
35   
36   
37   
38   
39   
40   
41   
42   
43   
44   
45   
46   
47   
48   
49   
50   
51   
52   
53   
54   
55   
56   
57   
58   
59   
60   
61   
62   
63   
64   
65   
66   
67   
68   
69   
70   
71   
72   
73   
74   
75   
76   
77   
78   
79   
80   
81   
82   
83   
84   
85   
86   
87   
88   
89   
90   
91   
92   
93   
94   
95   
96   
97   
98   
99   
100   
101   
102   
103   
104   
105   
106   
107   
108   
109   
110   
111   
112   
113   
114   
115   
116   
117   
118   
119   
120   
121   
122   
123   
124   
125   
126   
127   
128   
129   
130   
131   
132   
133   
134   
135   
<?php
$window = new GtkWindow();
$window->set_size_request(400, 600);
$window->connect_simple('destroy', array('Gtk','main_quit'));
$window->add($vbox = new GtkVBox());

// display title
$title = new GtkLabel("Place a background image in GtkEventBox\n".
"Part 3 - with GtkTable and GtkTreeView");
$title->modify_font(new PangoFontDescription("Times New Roman Italic 10"));
$title->modify_fg(Gtk::STATE_NORMAL, GdkColor::parse("#0000ff"));
$title->set_size_request(-1, 40);
$vbox->pack_start($title, 0);
$vbox->pack_start(new GtkLabel(), 0);

$vbox->pack_start($vbox2 = new GtkVBox());

$eventbox_top = new GtkEventBox();
$vbox2->pack_start($eventbox_top);
$eventbox_top->add($vbox_top = new GtkVBox());
$vbox_top->pack_start(new GtkLabel("This is top eventbox. ".
"The green disc is the background image."));
setup_top_eventbox($vbox_top);
$eventbox_top->connect('expose_event', 'expose_event', "disc_green.png"); // note 1

$eventbox_bottom = new GtkEventBox();
$vbox2->pack_start($eventbox_bottom);
$eventbox_bottom->add($vbox_bottom = new GtkVBox());
$vbox_bottom->pack_start(new GtkLabel("The is bottom eventbox. ".
"The blue disc is the background image."));
setup_bottom_eventbox($vbox_bottom);
$eventbox_bottom->modify_bg(Gtk::STATE_NORMAL, GdkColor::parse("#BAFFB3"));
$eventbox_bottom->connect('expose_event', 'expose_event', "disc_blue.png"); // note 1

$window->show_all();
Gtk::main();

function expose_event($widget, $event, $img) {
    $pixbuf = GdkPixbuf::new_from_file($img); // note 2
    $w = $pixbuf->get_width();
    $h = $pixbuf->get_height();
    $dest_x = $widget->allocation->width - $w; // note 3
    $dest_y = 0;
    $widget->window->draw_pixbuf($widget->style->bg_gc[Gtk::STATE_NORMAL], 
    $pixbuf, 0, 0, $dest_x, $dest_y); // note 4

    if($widget->get_child() != null)
    $widget->propagate_expose($widget->get_child(), $event);
    return true;
}

function setup_top_eventbox($vbox) { // note 5
    function display_table($table, $fields, $field_size) {
        global $entry;
        $row = 0;
        foreach ($fields as $field) {
            $label = new GtkLabel("  $field: ");
            $alignment = new GtkAlignment(1, .5, 0, 0);
            $alignment->add($label);
            $table->attach($alignment, 0, 1, $row, $row+1,
            Gtk::FILL, Gtk::SHRINK, 0, 0);

            $entry[$row] = new GtkEntry();
            $alignment = new GtkAlignment(0, .5, 0, 0);
            $alignment->add($entry[$row]);
            $entry[$row]->set_size_request($field_size[$row], -1);
            $table->attach($alignment, 1, 2, $row, $row+1);
            ++$row;
        }
    }

    function on_click($button) {
        global $fields, $entry;
        $i=0;
        foreach($fields as $field) {
            echo "$field: ".$entry[$i]->get_text()."\n";
            ++$i;
        }
    }

    global $fields, $entry;
    $fields = array('Item number', 'Item Description', 'Unit price', 'Quantity');
    $field_size = array(120, 200, 80, 80);
    $entry = array(); // to store the text entries

    $table = new GtkTable();
    display_table($table, $fields, $field_size); // display the table
    $vbox->pack_start($table);

    // create a submit button
    $button = new GtkButton('Submit');
    $button->set_size_request(60, 28);
    $button->connect('clicked', 'on_click');
    $row = count($fields);
    $alignment = new GtkAlignment(0, 0.5, 0, 0);
    $alignment->add($button);
    $table->attach($alignment, 1, 2, $row, $row+1);
}

function setup_bottom_eventbox($vbox) { // note 6

    function display_table_in_treeview($vbox, $data) {

        // Set up a scroll window
        $scrolled_win = new GtkScrolledWindow();
        $scrolled_win->set_policy( Gtk::POLICY_AUTOMATIC,
        Gtk::POLICY_AUTOMATIC);
        $vbox->pack_start($scrolled_win);

        // Creates the list store
        if (defined("GObject::TYPE_STRING")) {
            $model = new GtkListStore(GObject::TYPE_STRING, GObject::TYPE_STRING,
            GObject::TYPE_LONG, GObject::TYPE_DOUBLE);
        } else {
            $model = new GtkListStore(Gtk::TYPE_STRING, Gtk::TYPE_STRING,
            Gtk::TYPE_LONG, Gtk::TYPE_DOUBLE);
        }
        $field_header = array('Row #', 'Description', 'Qty', 'Price');
        $field_justification = array(0.0, 0.0, 0.5, 1.0);

        // Creates the view to display the list store
        $view = new GtkTreeView($model);
        $scrolled_win->add($view);

        // Creates the columns
        for ($col=0; $col<count($field_header); ++$col) {
            $cell_renderer = new GtkCellRendererText();
            $cell_renderer->set_property("xalign", $field_justification[$col]);
            $column = new GtkTreeViewColumn($field_header[$col],
            $cell_renderer, 'text', $col);
            $column->set_alignment($field_justification[$col]);
            $column->set_sort_column_id($col);

            // set the header font and color
            $label = new GtkLabel($field_header[$col]);
  • Note that this is only 70% of the sample code. You have to be a registered member to see the entire sample code. Please login or register.
  • Registration is free and immediate.
  • Have some doubt about the registration? Please read this forum article.
Explanation

The above makes use of the code from How to place a background image in GtkEventBox - Part 2 - using GdkDrawable draw_pixbuf?

We also make use of the code from How to align GtkEntry fields - Part 2? to set up the contents for the top eventbox, and the code from How to display a 2D array in GtkTreeView - Part 5 - get user selection? to set up the contents for the bottom eventbox.

  1. Register for the signal 'expose_event'.
  2. Load the background image. This works with all standard image file format such as .gif, .jpg or .png.
  3. Calculate where to place the background image. Here we place the image at the op right corner of the GtkEventBox.
  4. Sets the background image.
  5. Set up top eventbox.
  6. Set up bottom eventbox.

Related Links

User reviews

There are no user reviews yet.

Note: You have to be a registered member to leave a comment. Free registration here.

 
< Prev   Next >

Blog - Forum - Privacy Policy - Contact Us
Copyright © 2006-2008. kksou.com. All Rights Reserved