022. How to display a 2D array in table - Part 5?

Problem

We have displayed a 2D array in a table with borders in Part 4

How to display a 2D array in table - Part 3. fig1.

 

Now we would like to display alternate colored rows as shown below:

How to display a 2D array in table - Part 5?


Solution

  • First test for odd and even rows.
  • Set the background color of the eventbox with modify_bg accordingly.

Sample Code

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   
36   
37   
39   
40   
41   
42   
43   
44   
45   
46   
47   
48   
49   
50   
51   
52   
53   
54   
55   
56   
<?php
$window = new GtkWindow();
$window->set_size_request(400, 200);
$window->connect_simple('destroy', array('Gtk','main_quit'));

$window->add($vbox = new GtkVBox());

// display title
$title = new GtkLabel("Display 2D Array in Table - Part 5\n        (alternate colored rows)");
$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, 0);

$gap = new GtkHBox();
$gap->set_size_request(-1, 10); // add a small gap btw title and table
$vbox->pack_start($gap, 0, 0);

$vbox->pack_start($hbox = new GtkHBox());
$hbox->pack_start(new GtkHBox());
$hbox->pack_start($table = new GtkTable(), 0, 0);
$hbox->pack_start(new GtkHBox());

$data = array(
array('', 'header1', 'header2', 'header3'),
array('row0', 1, 2, 3),
array('row1', 4, 5, 6),
array('row2', 7, 8, 9),
array('row3', 10, 11, 12),
array('row4', 13, 14, 15));

display_table ($table, $data);

function display_table($table, $a) {
    for ($row=0; $row<count($a); ++$row) {
        for ($col=0; $col<count($a[$row]); ++$col) {
            $frame = new GtkFrame(); // note 1
            $eventbox = new GtkEventBox(); // note 2
            $frame->add($eventbox); // note 3
            $eventbox->add(new GtkLabel($a[$row][$col])); // note 4
            if ($row==0) { // note 5
                $eventbox->modify_bg(Gtk::STATE_NORMAL, GdkColor::parse("#FFCC66"));
            } elseif ($row%2==0) { // note 6
                $eventbox->modify_bg(Gtk::STATE_NORMAL, GdkColor::parse("#CCFF99"));
            }
            $table->attach($frame, $col, $col+1, $row, $row+1,
                Gtk::FILL, Gtk::SHRINK, 0, 0);
        }
    }
}

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

Output

As shown above.
 

Explanation

Please refer to:

  • Part 1 which explains how to display a 2D array in a table.
  • Part 2 which explains how to add borders to table.
  • Part 3 which explains how to add borders to table, and display the cells in a tightly packed manner.
  • Part 4 which explains how to center a table.

What's new here in Part 5:

  1. Create a GtkFrame for each cell which will form the border.
  2. Create a GtkEventBox which will allow us to give each cell a background color.
  3. Stuff the eventbox in the frame.
  4. Stuff the cell content in the eventbox.
  5. Test for header row ($row=0), and give it an orange background.
  6. Test for even row ($row%2==0), and give it a green background.

Note

Note the use of GtkEventBox to set the background. You might want to refer to the recipe "How to set the background color of GtkLabel?" for more detailed explanation.

Add comment


Security code
Refresh