scintillement lors d'un redraw (GTK3 + cairo)

Version imprimable

bonsoir,

Je suis débutant et j'ai installé gtk3 sous windows.
J'utilise code blocks.
Le premier programme que j'essaie de faire est le suivant :
-un drawing area ou je dessine avec cairo
-2 boutons pour zoomer ou dezoomer
Il fonctionne bien. Lorsque je clique sur zoom, le dessin déborde de la drawing area, j'ai donc mis un gtk_widget_queue_draw(window); dans le callback du bouton pour rafraichir toute la fenetre. Du coup seule la partie situé dans le drawing area est visible (le dessin est tronqué) et c'est ce que je veux.
Le problème est que lors du rafraichissement, j'ai un flash (scintillement). Je me demande donc si c'est la bonne méthode pour tronquer le dessin dans la drawing area ou si il y a autre chose à faire pour éviter le scintillement ?

J'ai eu beau cherché des heures avec google, j'ai du mal à trouver du code gtk3 avec cairo.

Un peu d'aide me soulagerait bien.
Merci, voici le code :

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
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
 
#include <cairo.h>
#include <gtk/gtk.h>
 
static void do_drawing(cairo_t *, GtkWidget *widget);
static void scaleplus(GtkWidget *widget, cairo_t *cr);
static void scalemoins(GtkWidget *widget, cairo_t *cr);
 
// coordonnées des points à afficher
int sector[16][2] = {
    { 250, -189 },
    { 12, 13 },
    { -7, 9 },
    { -3, 10 },
    { 1, 8 },
    { 4, 8 },
    { 6, 7 },
    { 6, 1 },
    { 33, -8 },
    { 60, 69 },
    { 49, 85 },
    { 37, 43 },
    { -124, 150 },
    { -16, 37 },
    { -76, -37 },
    { -223, -1 }
};
 
int secto1[2][2] = {
    { 234, 325},
    { 0, 248}
};
 
int secto2[2][2] = {
    { 244, 530},
    { 231, 735}
};
 
int secto3[3][2] = {
    { 467, 532},
    { 496, 677},
    { 541, 734}
};
 
int secto4[3][2] = {
    { 655, 0},
    { 839, 128},
    { 925, 298}
};
 
int secto5[2][2] = {
    { 632, 318},
    { 839, 129}
};
 
int secto6[3][2] = {
    { 501, 0},
    { 484, 89},
    { 484, 136}
};
 
int secto7[3][2] = {
    { 475, 0},
    { 214, 88},
    { 0, 204}
};
 
int secto8[2][2] = {
    { 214, 88},
    { 177, 1}
};
 
int secto9[7][2] = {
    { 682, 383},
    { 699, 396},
    { 734, 507},
    { 781, 511},
    { 785, 535},
    { 873, 601},
    { 925, 617}
};
 
int secto10[2][2] = {
    { 873, 601},
    { 725, 735}
};
 
static gboolean on_draw_event(GtkWidget *widget, cairo_t *cr, gpointer user_data)
{
  cr = gdk_cairo_create(gtk_widget_get_window(widget));
  do_drawing(cr, widget);
  cairo_destroy(cr);
  return FALSE;
}
 
static GtkWidget *window;
static gdouble scale = 1;
static gdouble wini = 924;
static gdouble hini = 734;
static gdouble w = 924;
static gdouble h = 734;
static gdouble tx = 0;
static gdouble ty = 0;
 
static void centrer() {
    tx = (wini-w)*0.5;
    ty = (hini-h)*0.5;
}
 
static void scaleplus(GtkWidget *widget, cairo_t *cr) {
    g_print("scaleplus clicked\n");
    gtk_widget_queue_draw(window);
    cr = gdk_cairo_create(gtk_widget_get_window(widget));
    scale *= 1.1;
    w *= 1.1;
    h *= 1.1;
    do_drawing(cr, widget);
    cairo_destroy(cr);
 
}
 
static void scalemoins(GtkWidget *widget, cairo_t *cr) {
    g_print("scalemoins clicked\n");
    gtk_widget_queue_draw(window);
    cr = gdk_cairo_create(gtk_widget_get_window(widget));
    scale /=1.1;
    w /= 1.1;
    h /= 1.1;
    do_drawing(cr, widget);
    cairo_destroy(cr);
 
}
 
static void do_drawing(cairo_t *cr, GtkWidget *widget)
{
  GtkWidget *win = gtk_widget_get_toplevel(widget);
  gtk_widget_set_size_request(win, wini, hini);
 
  cairo_set_source_rgb(cr, 0, 0.44, 0.7);
  cairo_set_line_width(cr, 1);
  centrer();
  cairo_translate(cr, tx, ty);
  cairo_scale(cr, scale, scale);
 
  cairo_move_to(cr, 234, 325);
  gint i;
 
  for ( i = 0; i < 16; i++ ) {
      cairo_rel_line_to(cr, sector[i][0], sector[i][1]);
  }
 
  cairo_close_path(cr);
  cairo_fill(cr);
  cairo_stroke(cr);
 
  cairo_move_to(cr, secto1[0][0], secto1[0][1]);
  cairo_line_to(cr, secto1[1][0], secto1[1][1]);
 
  cairo_move_to(cr, secto2[0][0], secto2[0][1]);
  cairo_line_to(cr, secto2[1][0], secto2[1][1]);
 
  cairo_move_to(cr, secto3[0][0], secto3[0][1]);
  cairo_line_to(cr, secto3[1][0], secto3[1][1]);
  cairo_line_to(cr, secto3[2][0], secto3[2][1]);
 
  cairo_move_to(cr, secto4[0][0], secto4[0][1]);
  cairo_line_to(cr, secto4[1][0], secto4[1][1]);
  cairo_line_to(cr, secto4[2][0], secto4[2][1]);
 
  cairo_move_to(cr, secto5[0][0], secto5[0][1]);
  cairo_line_to(cr, secto5[1][0], secto5[1][1]);
 
  cairo_move_to(cr, secto6[0][0], secto6[0][1]);
  cairo_line_to(cr, secto6[1][0], secto6[1][1]);
  cairo_line_to(cr, secto6[2][0], secto6[2][1]);
 
  cairo_move_to(cr, secto7[0][0], secto7[0][1]);
  cairo_line_to(cr, secto7[1][0], secto7[1][1]);
  cairo_line_to(cr, secto7[2][0], secto7[2][1]);
 
  cairo_move_to(cr, secto8[0][0], secto8[0][1]);
  cairo_line_to(cr, secto8[1][0], secto8[1][1]);
 
  cairo_move_to(cr, secto9[0][0], secto9[0][1]);
  cairo_line_to(cr, secto9[1][0], secto9[1][1]);
  cairo_line_to(cr, secto9[2][0], secto9[2][1]);
  cairo_line_to(cr, secto9[3][0], secto9[3][1]);
  cairo_line_to(cr, secto9[4][0], secto9[4][1]);
  cairo_line_to(cr, secto9[5][0], secto9[5][1]);
  cairo_line_to(cr, secto9[6][0], secto9[6][1]);
 
  cairo_move_to(cr, secto10[0][0], secto10[0][1]);
  cairo_line_to(cr, secto10[1][0], secto10[1][1]);
 
  cairo_stroke(cr);
}
 
int main(int argc, char *argv[])
{
 
  GtkWidget *darea;
  GtkWidget *grid;
  GtkWidget *buttonscaleplus;
  GtkWidget *buttonscalemoins;
 
  gtk_init(&argc, &argv);
 
  window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
  gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
  gtk_window_set_default_size(GTK_WINDOW(window), 1200, 760);
  gtk_window_set_title(GTK_WINDOW(window), "Exemple");
 
  darea = gtk_drawing_area_new();
  gtk_widget_set_size_request(darea, wini, hini);
 
  g_signal_connect(G_OBJECT(darea), "draw", G_CALLBACK(on_draw_event), NULL);
  g_signal_connect(window, "destroy", G_CALLBACK(gtk_main_quit), NULL);
 
  buttonscaleplus = gtk_button_new_with_label ("Scale Plus");
  g_signal_connect(G_OBJECT(buttonscaleplus), "clicked", G_CALLBACK (scaleplus), NULL);
  buttonscalemoins = gtk_button_new_with_label ("Scale Moins");
  g_signal_connect(G_OBJECT(buttonscalemoins), "clicked", G_CALLBACK (scalemoins), NULL);
 
  grid = gtk_grid_new ();
  gtk_grid_attach (GTK_GRID (grid), darea, 0, 0, 1, 1);
  gtk_grid_attach (GTK_GRID (grid), buttonscaleplus, 0, 1, 1, 1);
  gtk_grid_attach (GTK_GRID (grid), buttonscalemoins, 0, 2, 1, 1);
  gtk_container_add (GTK_CONTAINER (window), grid);
 
  gtk_widget_show_all(window);
 
  gtk_main();
  return 0;
}

15/05/2013, 14h29
liberforce
Bonjour,

pourrais tu déjà vérifier le code que tu as posté stp, celui ci ne compile pas. Il ne manque a priori qu'une accolade fermante pour ta fonction do_drawing, et j'ai commenté dans la même fonction l'appel à gtk_widget_set_size_request pour que cela puisse compiler, mais ce serait bien que tu vérifies que ce que tu as posté correspond bien à ce que tu compiles.

Ensuite, j'ai plusieurs remarques:
- gdk_cairo_create n'a à ma connaissance aucun intérêt en GTK 3. Il est utile en GTK 2 où en réponse au signal "expose-event" (équivalent en GTK 2 du signal "draw" de GTK 3) tu n'as pas de contexte cairo, et tu dois le créer toi même. En GTK 3, tu le récupères le contexte cairo directement en argument.
- pour la même raison, en GTK 3, il ne faut pas détruire le contexte par un appel à cairo_destroy, parce que si GTK l'a créé pour toi, il s'occupera de le détruire pour toi.
- la gestion du zoom ne devrait être qu'un simple changement de tes paramètres d'échelle suivi par gtk_widget_queue_draw sur la drawing area. N'appelle pas toi même la fonction do_drawing.
Je te conseille de lire la section "Drawing" de la doc GTK 3.
Essaie déjà ça pour voir si ça corrige tes problèmes. Je pense que c'est surtout le fait que tu redessines 2 fois la drawing area (1 fois après l'appel à do_drawing, puis en réponse au signal "draw" empilé par ton appel à gtk_widget_queue_draw) qui cause le scintillement.

Par curiosité, j'aimerais bien savoir aussi quel installateur tu as utilisé pour GTK 3 pour Windows...
15/05/2013, 17h56
rollbich

bonjour liberforce,

Désolé pour la compilation, j'ai fait plusieurs copier coller avec qq erreurs. J'ai édité mon premier post en rajoutant l'accolade et rajouter la ligne manquante qui définissait win. Je serai plus vigilant la prochaine fois.

Merci en tout cas pour ta réponse, je vais m'y mettre ce soir et je te tiens au courant.
Pour l'histoire du gdk_cairo_create et du cairo destroy, j'ai simplement utilisé le tuto suivant : http://zetcode.com/gfx/cairo/basicdrawing/ sans réfléchir car je ne savais pas pourquoi je faisais ça. Je vais regarder ton lien sur gtk3 drawing et réfléchir à tout ce que tu m'as dit.

Concernant l'installation de gtk3 sous windows. J'ai répondu à cette question à Jean Marc aujourd'hui.(c'est le post juste en dessous du mien sur le forum).
Il m'a fallu une bonne semaine de recherche sur plusieurs sites différents pour synthétiser comment installer ce gtk3 sous windows. Comme tu le verras sur mon post, c'est grace à Tarnyko qui a compilé la gtk 3.6.1 pour windows et mingw. Merci à lui.

bonsoir,

Ca y est, j'ai potassé ce que tu m'as dit. Effectivement, plus de scintillement après avoir enlever les appels à do_drawing depuis les callbacks.

J'ai lu la partie 'drawing' sur le site de gnome et comme tu me l'as dit, il est bien précisé que gtk+ créé le contexte cairo pour le gestionnaire du signal draw mais ce n'était pas clair pour moi avant que tu me le signales.
J'ai donc modifié la fonction on_draw_event en enlevant
Code:

1 2 cr = gdk_cairo_create(gtk_widget_get_window(widget)); cairo_destroy(cr);
et cela marche parfaitement.

ce qui donne :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 static gboolean on_draw_event(GtkWidget *widget, cairo_t *cr, gpointer user_data) { do_drawing(cr, widget); return FALSE; } static void scaleplus(GtkWidget *widget, cairo_t *cr) { g_print("scaleplus clicked\n"); scale *= 1.1; w *= 1.1; h *= 1.1; gtk_widget_queue_draw(window); } static void scalemoins(GtkWidget *widget, cairo_t *cr) { g_print("scalemoins clicked\n"); scale /=1.1; w /= 1.1; h /= 1.1; gtk_widget_queue_draw(window);
Vraiment un grand merci pour ces précisions qui sont très utiles je trouve pour un débutant et qui ne sont pas bien explicités sur le peu de site internet sur gtk3.

J'en déduis donc que le tuto du site http://zetcode.com/gfx/cairo/basicdrawing/ que j'utilisais n'est pas tout à fait correct ?

Merci et bonne soirée

16/05/2013, 00h55
liberforce

Ah, effectivement, il semble que le tutoriel sur zetcode fasse cette erreur aussi. Pourtant ils sont très bon en général. Il y a un peu de doc sur le signal "draw" et ses différences par rapport au signal "expose-event", mais elles sont exposées dans les infos sur la migration GTK 2 -> GTK 3. Mais si on découvre directement GTK 3, on ne pense pas forcément à lire cette partie de la doc.

J'ai contacté l'auteur du tutoriel afin qu'il le modifie (ou me montre que j'ai tort et pourquoi).
17/05/2013, 09h52
liberforce

L'auteur a mis son tutoriel à jour suite à ma remarque. Merci d'avoir rapporté le problème.
17/05/2013, 18h55
rollbich

Surtout merci à toi !:D