Sample Code 264: How to use GtkSheet - Part 17.1 - sort by clicking column header?
Written by kksou   
Wednesday, 13 June 2007
Problem

Suppose you have set up a GtkSheet using attach() as outlined in How to use GtkSheet - Part 15 - set column width?

Now you would like to allow users to sort on a column by clicking on the column header as shown below:

How to use GtkSheet - Part 17.1 - sort by clicking column header?


Solution
  • Make sure your version of PHP-GTK2 has the GtkExtra library, and the feature turned on in php.ini. (See notes below.)
  • Unlike GtkTreeView which automatically handles sorting when you click on the column header, for GtkSheet, we have to handle sorting manually.
  • First we need to capture clicks on the column header with the signal select-column
  • In the callback function, we make a copy of the values, perform sorting on the selected column, and replace the cells with the sorted values.

Important Note: This only works for PHP-GTK2 compliled with the additional library GtkExtra. For linux, you can download the files from http://gtkextra.sourceforge.net/ and do a recompile. For windows, you may use the builds by Elizabeth Smith or the official php-gtk2 beta release available at http://gtk.php.net/download.php. Both contain all the required gtkextra libraries and dll's. In the php.ini, don't forget to add php-gtk.extensions = php_gtk_extra2.dll to turn on GtkExtra.


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   
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   
<?php
$window = new GtkWindow();
$window->set_title($argv[0]);
$window->set_size_request(430, 250);
$window->connect_simple('destroy', array('Gtk','main_quit'));
$window->add($vbox = new GtkVBox());

// display title
$title = new GtkLabel("Using GtkSheet - Part 17\n".
"Sort by clicking column header (for GtkSheet with attach)");
$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);
$title->set_justify(Gtk::JUSTIFY_CENTER);
$alignment = new GtkAlignment(0.5, 0, 0, 0);
$alignment->add($title);
$vbox->pack_start($alignment, 0, 0);
$vbox->pack_start(new GtkLabel(), 0, 0);

// the 2D table
$data = array(
array('row0', 'item 42', 2, 3.1),
array('row1', 'item 36', 20, 6.21),
array('row2', 'item 21', 8, 9.36),
array('row3', 'item 10', 11, 12.4),
array('row4', 'item 7', 5, 15.5),
array('row5', 'item 4', 17, 18.6),
array('row6', 'item 3', 20, 21.73));

$max_col = count($data[0])-1;
$max_row = count($data)-1;

$field_header = array('Row #', 'Description', 'Qty', 'Price');
$justification = array('LEFT', 'LEFT', 'CENTER', 'RIGHT');
$column_width = array(30, 145, 40, 60);

display_table($vbox, $data, $field_header, $justification, $column_width);

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

function display_table($vbox, $data, $field_header, $justification, $column_width) {

    $scrolled_win = new GtkScrolledWindow();
    $scrolled_win->set_policy( Gtk::POLICY_AUTOMATIC,
        Gtk::POLICY_AUTOMATIC);
    $vbox->pack_start($scrolled_win);

    $sheet = GtkSheet::new_browser(count($data), count($data[0]), 'Test 123');
    $sheet->set_autoresize(1);
    $scrolled_win->add($sheet);

    $sheet->connect('key-press-event', 'on_keypress');
    $sheet->connect('select-column', 'on_column_header'); // note 1

    // set column header
    for ($col=0; $col<count($field_header); ++$col) {
        $sheet->column_button_add_label($col, $field_header[$col]);
        $justify = constant("Gtk::JUSTIFY_".$justification[$col]);
        $sheet->column_button_justify($col, $justify);
        $sheet->set_column_width($col, $column_width[$col]);
    }

    global $eventbox;
    $alignment_val = array('LEFT'=>0.0, 'CENTER'=>0.5, 'RIGHT'=>1.0);
    for ($row=0; $row<count($data); ++$row) {
        $sheet->row_button_add_label($row, $row+1);
        for ($col=0; $col<count($data[$row]); ++$col) {
            $eventbox[$row][$col] = new GtkEventBox();
            $alignment = new GtkAlignment(
                $alignment_val[$justification[$col]], 0.5, 0, 0);
            $alignment->set_padding(0, 0, 2, 2);
            $alignment->add(new GtkLabel($data[$row][$col]));
            $eventbox[$row][$col]->add($alignment);
            $row_color = ($row%2==1) ? '#dddddd' : '#ffffff';
            $eventbox[$row][$col]->modify_bg(Gtk::STATE_NORMAL,
                GdkColor::parse($row_color));
            $eventbox[$row][$col]->set_size_request($column_width[$col], -1);
            $sheet->attach_default($eventbox[$row][$col], $row, $col);
        }
    }
}

function on_keypress($sheet, $event) {
    global $max_col, $max_row;
    list($row, $col) = $sheet->get_active_cell();
    if ($event->keyval == Gdk::KEY_Tab) {
        if ($col<$max_col || $row==$max_row) return false;
        $sheet->set_active_cell($row+1, 0);
        return true;
    } else {
        return false;
  • 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 example above is based on How to use GtkSheet - Part 15 - set column width?

What's new here:

  1. Register the signal 'select-column'.
  2. Make a copy of the original values.
  3. Make a copy of the values of the selected column.
  4. Note that we make the selected column as the key of the array.
  5. Sort on the selected column.
  6. Replace the cells with the sorted values.

Note 1

As I've mentioned in the blog, there's some problem with this method.

Try pressing the Tab key. Did you see the underlying GtkItemEntry?

I'm not sure if this is a feature or a bug. Although I could find some ways to "gobble" up the Tab or arrow keys so that the GtkItemEntry doesn't appear, I know this should not be the right way of doing things.

Anybody knows how to "deactivate" the underlying GtkItemEntry?

Note 2

This example also highlights one key advantage of GtkTreeView over GtkSheet. GtkTreeView not only has built-in support for sorting. It has also GtkTreeModelSort and GtkTreeModelFilter, allowing you to have a base model and multiple sort/filter models that present different views over the base model. These "virtual" models do not hold any data itself. Any change in the base model is propagated through all the virtual models. Below are some examples on GtkTreeModelSort and GtkTreeModelFilter:


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 >

Copyright © 2006-2008. kksou.com. All Rights Reserved