|
Problem Suppose you have displayed two lists of thumbnail images using GtkIconView, and you would like to allow users to drag and drop images between the two views.
In Part 1, the dropped image is appended to the end of the dropped view.
In this Part 2, I'll show you how to insert image at the dropped location.
Solution Use the technique as outlined in the article How to drag and drop between 2 GtkTreeViews - Part 3 - left to right with insert? to insert the dragged image at the dropped location.
Important Note: This only works for PHP-GTK2 compliled with gtk+ v2.10 and above. If you are using an older version, for linux, you may follow the step-by-step instructions to recompile php-gtk2 with gtk+ v2.10. For windows, please refer to How to install php gtk2 on windows? You may also want to take a look here to see some of the new exciting PHP-GTK2 Functionalities.
Sample Code 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.
 | square_red.jpg |
 | square_yellow.jpg |
 | square_green.jpg |
 | square_blue.jpg |
 | square_blue2.jpg |
 | square_blue3.jpg |
 | ball_red.png |
 | ball_yellow.png |
 | ball_blue3.png |
 | ball_blue3a.png |
 | ball_green3.png |
 | ball_green4.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
| <?php
$window = new GtkWindow();
$window->set_title($argv[0]);
$window->set_size_request(600, 400);
$window->connect_simple('destroy', array('Gtk','main_quit'));
$window->add($vbox = new GtkVBox());
// display title
$title = new GtkLabel("Drag and drop between two thumbnail images using GtkIconView\n".
" Part 2 - Left to right (insert)");
$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);
$vbox->pack_start(new GtkLabel(), 0, 0); // add a small gap
// Set up the two views
$hpane = new GtkHPaned();
$vbox->pack_start($hpane);
// the thumbnail image lists
// 0 = left
// 1 = right
$imagelist[0] = array('square_red.jpg', 'square_yellow.jpg', 'square_green.jpg',
'square_blue.jpg', 'square_blue2.jpg', 'square_blue3.jpg');
$imagelist[1] = array('ball_red.png', 'ball_yellow.png',
'ball_blue3.png', 'ball_blue3a.png',
'ball_green3.png', 'ball_green4.png',);
$left_vbox = setup_iconview(0, 'left');
$right_vbox = setup_iconview(1, 'right');
// setup drag and drop
$view[0]->drag_source_set(Gdk::BUTTON1_MASK, array( array( 'text/plain', 0, 0)),
Gdk::ACTION_COPY|Gdk::ACTION_MOVE);
$view[0]->connect('drag-data-get', 'on_drag');
$view[1]->drag_dest_set(Gtk::DEST_DEFAULT_ALL,
array( array( 'text/plain', 0, 0)), Gdk::ACTION_COPY|Gdk::ACTION_MOVE);
$view[1]->connect('drag-data-received', 'on_drop');
$hpane->add1($left_vbox);
$hpane->add2($right_vbox);
$view[0]->set_size_request(300, -1);
$window->show_all();
Gtk::main();
function setup_iconview($id, $label) {
global $imagelist, $model, $modelfilter, $view;
$model[$id] = new GtkListStore(GdkPixbuf::gtype, Gtk::TYPE_STRING);
foreach($imagelist[$id] as $img) {
$pixbuf = GdkPixbuf::new_from_file($img);
$model[$id]->append(array($pixbuf, $img));
}
$view[$id] = new GtkIconView($model[$id]);
$view[$id]->set_pixbuf_column(0); // col 0 of the model
$view[$id]->set_text_column(1); // col 1 of the model
$view[$id]->set_selection_mode(Gtk::SELECTION_MULTIPLE);
$view[$id]->set_columns(0);
$view[$id]->set_item_width(120);
$vbox = new GtkVBox();
$scrolled_win = new GtkScrolledWindow();
$scrolled_win->set_policy( Gtk::POLICY_AUTOMATIC,
Gtk::POLICY_AUTOMATIC);
$vbox->pack_start($scrolled_win);
$scrolled_win->add($view[$id]);
return $vbox;
}
// process drag
function on_drag($widget, $context, $data, $info, $time) {
$selection = $widget->get_selected_items();
if (count($selection)==0) return; // return if there's no selection
$data->set_text(serialize($selection));
}
// process drop
function on_drop($widget, $context, $x, $y, $data, $info, $time) {
// append the dragged item to the destination view
$drop_info = $widget->get_dest_item_at_pos($x, $y); // note 1
if ($drop_info) {
|
- 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 sample code is based on Part 1.
We also make use of the code from How to drag and drop between 2 GtkTreeViews - Part 3 - left to right with insert? to insert the dragged image at the dropped location.
What's new here:
- Get the drop information.
- Get the path and position of the drop information.
- Check whether it's on, before or after the row.
- If it's on or before, we insert into the current row.
- If it's after, we insert into the next row (i.e. current_row + 1).
- Append the dragged image.
- Insert the dragged image at the dropped location.
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. |
