PHP-GTK2 Newsletter

PHP-GTK2 Tips & Techniques
FREE Newsletter
by kksou



Sample Code 135: How to edit items in GtkTreeView - using popup dialog?
Written by kksou   
Friday, 05 January 2007
Problem

Suppose your current application requires editing of items in treeview. There are many ways of doing this. In this article, we will use a popup form. On double-clicking a row, a popup dialog will be displayed for editing as shown below:

How to edit items in GtkTreeView - using popup dialog?


Solution

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   
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   
136   
137   
138   
139   
140   
<?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("Edit Items in GtkTreeView\n".
"double-click on row to edit values");
$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('id0', 'item 42', 2, 3.1),
array('id1', 'item 36', 20, 6.21),
array('id2', 'item 21', 8, 9.36),
array('id3', 'item 10', 11, 12.4),
array('id4', 'item 7', 5, 15.5),
array('id5', 'item 4', 17, 18.6),
array('id6', 'item 3', 20, 21.73));

display_table ($vbox, $data);

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

function display_table($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('Item Number', 'Description', 'Qty', 'Price');
    $field_justification = array(0.5, 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]);
        $label->modify_font(new PangoFontDescription("Arial Bold"));
        $label->modify_fg(Gtk::STATE_NORMAL, GdkColor::parse("#0000FF"));
        $column->set_widget($label);
        $label->show();

        // setup self-defined function to display alternate row color
        $column->set_cell_data_func($cell_renderer, "format_col", $col);
        $view->append_column($column);
    }

    // pupulates the data
    for ($row=0; $row<count($data); ++$row) {
        $values = array();
        for ($col=0; $col<count($data[$row]); ++$col) {
            $values[] = $data[$row][$col];
        }
        $model->append($values);
    }

    $selection = $view->get_selection();
    $selection->connect('changed', 'on_selection');

    $view->connect('button-press-event', 'on_view_button_press', $view); // note 1
}

function format_col($column, $cell, $model, $iter, $col_num) {
    $path = $model->get_path($iter);
    $row_num = $path[0];
    if ($col_num==3) {
        $amt = $model->get_value($iter, 3);
        $cell->set_property('text', '$'.number_format($amt,2));
    }
    $row_color = ($row_num%2==1) ? '#dddddd' : '#ffffff';
    $cell->set_property('cell-background', $row_color);
}

function on_selection($selection) {
    list($model, $iter) = $selection->get_selected();
    $desc = $model->get_value($iter, 1);
    $qty = $model->get_value($iter, 2);
    $price = $model->get_value($iter, 3);
    print "You have selected $desc: $qty ($price)\n";
}

function on_view_button_press($widget, $event, $view) {
    if ($event->type==Gdk::_2BUTTON_PRESS) {  // note 2
        $selection = $view->get_selection();
        list($model, $iter) = $selection->get_selected();
        $itemnum = $model->get_value($iter, 0); // note 3
        $desc = $model->get_value($iter, 1);
        $qty = $model->get_value($iter, 2);
        $price = $model->get_value($iter, 3);

        $new_value = prompt(array( // note 4
            'Item Number'=>$itemnum,
            'Description' => $desc,
            'Quantity' => $qty,
            'Price' => $price));

        if (count($new_value)==0) return; // note 5

        for ($i=0; $i<count($new_value); ++$i) {
            $model->set($iter, $i, $new_value[$i]); // note 6
        }
    }

}

function prompt($fields) {
    $prompt = new Prompt($fields);

    $new_value = array();
    if (!$prompt->ok) return;
  • 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
  1. Register 'button-press-event' on the treeview to check for double-click.
  2. Check if it's a double-click.
  3. Get the existing values.
  4. Display the form in a popup dialog for editing.
  5. This is the case when the user did not edit anything and just close the dialog box.
  6. Get the edited values and update them back to the model.

Note

You may want to refer to How to have Enter move to next field in form - Part 1? and How to have Enter move to next field in form - Part 2? to improve the user interface of the popup dialog.

You may also want to compare this method with How to edit items in GtkTreeView - using built in treeview edit - Part 1?


Related Links
 

Add comment


Security code
Refresh

< Prev   Next >

Blog - Forum - Privacy Policy - Contact Us
Links - Classes - Social Business - BPM - Web - General
Copyright © 2006-2013. kksou.com. All Rights Reserved