1/* Flow Box
2 *
3 * GtkFlowBox allows flexible and responsive grids which reflow
4 * as needed and support sorting and filtering. The children of
5 * a GtkFlowBox are regular widgets
6 *
7 * The dataset used here has 665 colors.
8 */
9
10#include <gtk/gtk.h>
11#include <stdlib.h>
12#include <string.h>
13
14static void
15draw_color (GtkDrawingArea *drawingarea,
16 cairo_t *cr,
17 int width,
18 int height,
19 gpointer data)
20{
21 const char *color_name = data;
22 GdkRGBA rgba;
23
24 if (gdk_rgba_parse (rgba: &rgba, spec: color_name))
25 {
26 gdk_cairo_set_source_rgba (cr, rgba: &rgba);
27 cairo_paint (cr);
28 }
29}
30
31static GtkWidget *
32color_swatch_new (const char *color)
33{
34 GtkWidget *button, *area;
35
36 button = gtk_button_new ();
37 area = gtk_drawing_area_new ();
38 gtk_drawing_area_set_content_width (GTK_DRAWING_AREA (area), width: 24);
39 gtk_drawing_area_set_content_height (GTK_DRAWING_AREA (area), height: 24);
40 gtk_drawing_area_set_draw_func (GTK_DRAWING_AREA (area), draw_func: draw_color, user_data: (gpointer) color, NULL);
41 gtk_button_set_child (GTK_BUTTON (button), child: area);
42
43 return button;
44}
45
46GtkWidget *
47do_flowbox (GtkWidget *do_widget)
48{
49 static GtkWidget *window = NULL;
50 GtkWidget *scrolled, *flowbox;
51 const char *colors[] = {
52 "AliceBlue",
53 "AntiqueWhite",
54 "AntiqueWhite1",
55 "AntiqueWhite2",
56 "AntiqueWhite3",
57 "AntiqueWhite4",
58 "aqua",
59 "aquamarine",
60 "aquamarine1",
61 "aquamarine2",
62 "aquamarine3",
63 "aquamarine4",
64 "azure",
65 "azure1",
66 "azure2",
67 "azure3",
68 "azure4",
69 "beige",
70 "bisque",
71 "bisque1",
72 "bisque2",
73 "bisque3",
74 "bisque4",
75 "black",
76 "BlanchedAlmond",
77 "blue",
78 "blue1",
79 "blue2",
80 "blue3",
81 "blue4",
82 "BlueViolet",
83 "brown",
84 "brown1",
85 "brown2",
86 "brown3",
87 "brown4",
88 "burlywood",
89 "burlywood1",
90 "burlywood2",
91 "burlywood3",
92 "burlywood4",
93 "CadetBlue",
94 "CadetBlue1",
95 "CadetBlue2",
96 "CadetBlue3",
97 "CadetBlue4",
98 "chartreuse",
99 "chartreuse1",
100 "chartreuse2",
101 "chartreuse3",
102 "chartreuse4",
103 "chocolate",
104 "chocolate1",
105 "chocolate2",
106 "chocolate3",
107 "chocolate4",
108 "coral",
109 "coral1",
110 "coral2",
111 "coral3",
112 "coral4",
113 "CornflowerBlue",
114 "cornsilk",
115 "cornsilk1",
116 "cornsilk2",
117 "cornsilk3",
118 "cornsilk4",
119 "crimson",
120 "cyan",
121 "cyan1",
122 "cyan2",
123 "cyan3",
124 "cyan4",
125 "DarkBlue",
126 "DarkCyan",
127 "DarkGoldenrod",
128 "DarkGoldenrod1",
129 "DarkGoldenrod2",
130 "DarkGoldenrod3",
131 "DarkGoldenrod4",
132 "DarkGray",
133 "DarkGreen",
134 "DarkGrey",
135 "DarkKhaki",
136 "DarkMagenta",
137 "DarkOliveGreen",
138 "DarkOliveGreen1",
139 "DarkOliveGreen2",
140 "DarkOliveGreen3",
141 "DarkOliveGreen4",
142 "DarkOrange",
143 "DarkOrange1",
144 "DarkOrange2",
145 "DarkOrange3",
146 "DarkOrange4",
147 "DarkOrchid",
148 "DarkOrchid1",
149 "DarkOrchid2",
150 "DarkOrchid3",
151 "DarkOrchid4",
152 "DarkRed",
153 "DarkSalmon",
154 "DarkSeaGreen",
155 "DarkSeaGreen1",
156 "DarkSeaGreen2",
157 "DarkSeaGreen3",
158 "DarkSeaGreen4",
159 "DarkSlateBlue",
160 "DarkSlateGray",
161 "DarkSlateGray1",
162 "DarkSlateGray2",
163 "DarkSlateGray3",
164 "DarkSlateGray4",
165 "DarkSlateGrey",
166 "DarkTurquoise",
167 "DarkViolet",
168 "DeepPink",
169 "DeepPink1",
170 "DeepPink2",
171 "DeepPink3",
172 "DeepPink4",
173 "DeepSkyBlue",
174 "DeepSkyBlue1",
175 "DeepSkyBlue2",
176 "DeepSkyBlue3",
177 "DeepSkyBlue4",
178 "DimGray",
179 "DimGrey",
180 "DodgerBlue",
181 "DodgerBlue1",
182 "DodgerBlue2",
183 "DodgerBlue3",
184 "DodgerBlue4",
185 "firebrick",
186 "firebrick1",
187 "firebrick2",
188 "firebrick3",
189 "firebrick4",
190 "FloralWhite",
191 "ForestGreen",
192 "fuchsia",
193 "gainsboro",
194 "GhostWhite",
195 "gold",
196 "gold1",
197 "gold2",
198 "gold3",
199 "gold4",
200 "goldenrod",
201 "goldenrod1",
202 "goldenrod2",
203 "goldenrod3",
204 "goldenrod4",
205 "gray",
206 "gray0",
207 "gray1",
208 "gray10",
209 "gray100",
210 "gray11",
211 "gray12",
212 "gray13",
213 "gray14",
214 "gray15",
215 "gray16",
216 "gray17",
217 "gray18",
218 "gray19",
219 "gray2",
220 "gray20",
221 "gray21",
222 "gray22",
223 "gray23",
224 "gray24",
225 "gray25",
226 "gray26",
227 "gray27",
228 "gray28",
229 "gray29",
230 "gray3",
231 "gray30",
232 "gray31",
233 "gray32",
234 "gray33",
235 "gray34",
236 "gray35",
237 "gray36",
238 "gray37",
239 "gray38",
240 "gray39",
241 "gray4",
242 "gray40",
243 "gray41",
244 "gray42",
245 "gray43",
246 "gray44",
247 "gray45",
248 "gray46",
249 "gray47",
250 "gray48",
251 "gray49",
252 "gray5",
253 "gray50",
254 "gray51",
255 "gray52",
256 "gray53",
257 "gray54",
258 "gray55",
259 "gray56",
260 "gray57",
261 "gray58",
262 "gray59",
263 "gray6",
264 "gray60",
265 "gray61",
266 "gray62",
267 "gray63",
268 "gray64",
269 "gray65",
270 "gray66",
271 "gray67",
272 "gray68",
273 "gray69",
274 "gray7",
275 "gray70",
276 "gray71",
277 "gray72",
278 "gray73",
279 "gray74",
280 "gray75",
281 "gray76",
282 "gray77",
283 "gray78",
284 "gray79",
285 "gray8",
286 "gray80",
287 "gray81",
288 "gray82",
289 "gray83",
290 "gray84",
291 "gray85",
292 "gray86",
293 "gray87",
294 "gray88",
295 "gray89",
296 "gray9",
297 "gray90",
298 "gray91",
299 "gray92",
300 "gray93",
301 "gray94",
302 "gray95",
303 "gray96",
304 "gray97",
305 "gray98",
306 "gray99",
307 "green",
308 "green1",
309 "green2",
310 "green3",
311 "green4",
312 "GreenYellow",
313 "grey",
314 "grey0",
315 "grey1",
316 "grey10",
317 "grey100",
318 "grey11",
319 "grey12",
320 "grey13",
321 "grey14",
322 "grey15",
323 "grey16",
324 "grey17",
325 "grey18",
326 "grey19",
327 "grey2",
328 "grey20",
329 "grey21",
330 "grey22",
331 "grey23",
332 "grey24",
333 "grey25",
334 "grey26",
335 "grey27",
336 "grey28",
337 "grey29",
338 "grey3",
339 "grey30",
340 "grey31",
341 "grey32",
342 "grey33",
343 "grey34",
344 "grey35",
345 "grey36",
346 "grey37",
347 "grey38",
348 "grey39",
349 "grey4",
350 "grey40",
351 "grey41",
352 "grey42",
353 "grey43",
354 "grey44",
355 "grey45",
356 "grey46",
357 "grey47",
358 "grey48",
359 "grey49",
360 "grey5",
361 "grey50",
362 "grey51",
363 "grey52",
364 "grey53",
365 "grey54",
366 "grey55",
367 "grey56",
368 "grey57",
369 "grey58",
370 "grey59",
371 "grey6",
372 "grey60",
373 "grey61",
374 "grey62",
375 "grey63",
376 "grey64",
377 "grey65",
378 "grey66",
379 "grey67",
380 "grey68",
381 "grey69",
382 "grey7",
383 "grey70",
384 "grey71",
385 "grey72",
386 "grey73",
387 "grey74",
388 "grey75",
389 "grey76",
390 "grey77",
391 "grey78",
392 "grey79",
393 "grey8",
394 "grey80",
395 "grey81",
396 "grey82",
397 "grey83",
398 "grey84",
399 "grey85",
400 "grey86",
401 "grey87",
402 "grey88",
403 "grey89",
404 "grey9",
405 "grey90",
406 "grey91",
407 "grey92",
408 "grey93",
409 "grey94",
410 "grey95",
411 "grey96",
412 "grey97",
413 "grey98",
414 "grey99",
415 "honeydew",
416 "honeydew1",
417 "honeydew2",
418 "honeydew3",
419 "honeydew4",
420 "HotPink",
421 "HotPink1",
422 "HotPink2",
423 "HotPink3",
424 "HotPink4",
425 "IndianRed",
426 "IndianRed1",
427 "IndianRed2",
428 "IndianRed3",
429 "IndianRed4",
430 "indigo",
431 "ivory",
432 "ivory1",
433 "ivory2",
434 "ivory3",
435 "ivory4",
436 "khaki",
437 "khaki1",
438 "khaki2",
439 "khaki3",
440 "khaki4",
441 "lavender",
442 "LavenderBlush",
443 "LavenderBlush1",
444 "LavenderBlush2",
445 "LavenderBlush3",
446 "LavenderBlush4",
447 "LawnGreen",
448 "LemonChiffon",
449 "LemonChiffon1",
450 "LemonChiffon2",
451 "LemonChiffon3",
452 "LemonChiffon4",
453 "LightBlue",
454 "LightBlue1",
455 "LightBlue2",
456 "LightBlue3",
457 "LightBlue4",
458 "LightCoral",
459 "LightCyan",
460 "LightCyan1",
461 "LightCyan2",
462 "LightCyan3",
463 "LightCyan4",
464 "LightGoldenrod",
465 "LightGoldenrod1",
466 "LightGoldenrod2",
467 "LightGoldenrod3",
468 "LightGoldenrod4",
469 "LightGoldenrodYellow",
470 "LightGray",
471 "LightGreen",
472 "LightGrey",
473 "LightPink",
474 "LightPink1",
475 "LightPink2",
476 "LightPink3",
477 "LightPink4",
478 "LightSalmon",
479 "LightSalmon1",
480 "LightSalmon2",
481 "LightSalmon3",
482 "LightSalmon4",
483 "LightSeaGreen",
484 "LightSkyBlue",
485 "LightSkyBlue1",
486 "LightSkyBlue2",
487 "LightSkyBlue3",
488 "LightSkyBlue4",
489 "LightSlateBlue",
490 "LightSlateGray",
491 "LightSlateGrey",
492 "LightSteelBlue",
493 "LightSteelBlue1",
494 "LightSteelBlue2",
495 "LightSteelBlue3",
496 "LightSteelBlue4",
497 "LightYellow",
498 "LightYellow1",
499 "LightYellow2",
500 "LightYellow3",
501 "LightYellow4",
502 "lime",
503 "LimeGreen",
504 "linen",
505 "magenta",
506 "magenta1",
507 "magenta2",
508 "magenta3",
509 "magenta4",
510 "maroon",
511 "maroon1",
512 "maroon2",
513 "maroon3",
514 "maroon4",
515 "MediumAquamarine",
516 "MediumBlue",
517 "MediumOrchid",
518 "MediumOrchid1",
519 "MediumOrchid2",
520 "MediumOrchid3",
521 "MediumOrchid4",
522 "MediumPurple",
523 "MediumPurple1",
524 "MediumPurple2",
525 "MediumPurple3",
526 "MediumPurple4",
527 "MediumSeaGreen",
528 "MediumSlateBlue",
529 "MediumSpringGreen",
530 "MediumTurquoise",
531 "MediumVioletRed",
532 "MidnightBlue",
533 "MintCream",
534 "MistyRose",
535 "MistyRose1",
536 "MistyRose2",
537 "MistyRose3",
538 "MistyRose4",
539 "moccasin",
540 "NavajoWhite",
541 "NavajoWhite1",
542 "NavajoWhite2",
543 "NavajoWhite3",
544 "NavajoWhite4",
545 "navy",
546 "NavyBlue",
547 "OldLace",
548 "olive",
549 "OliveDrab",
550 "OliveDrab1",
551 "OliveDrab2",
552 "OliveDrab3",
553 "OliveDrab4",
554 "orange",
555 "orange1",
556 "orange2",
557 "orange3",
558 "orange4",
559 "OrangeRed",
560 "OrangeRed1",
561 "OrangeRed2",
562 "OrangeRed3",
563 "OrangeRed4",
564 "orchid",
565 "orchid1",
566 "orchid2",
567 "orchid3",
568 "orchid4",
569 "PaleGoldenrod",
570 "PaleGreen",
571 "PaleGreen1",
572 "PaleGreen2",
573 "PaleGreen3",
574 "PaleGreen4",
575 "PaleTurquoise",
576 "PaleTurquoise1",
577 "PaleTurquoise2",
578 "PaleTurquoise3",
579 "PaleTurquoise4",
580 "PaleVioletRed",
581 "PaleVioletRed1",
582 "PaleVioletRed2",
583 "PaleVioletRed3",
584 "PaleVioletRed4",
585 "PapayaWhip",
586 "PeachPuff",
587 "PeachPuff1",
588 "PeachPuff2",
589 "PeachPuff3",
590 "PeachPuff4",
591 "peru",
592 "pink",
593 "pink1",
594 "pink2",
595 "pink3",
596 "pink4",
597 "plum",
598 "plum1",
599 "plum2",
600 "plum3",
601 "plum4",
602 "PowderBlue",
603 "purple",
604 "purple1",
605 "purple2",
606 "purple3",
607 "purple4",
608 "red",
609 "red1",
610 "red2",
611 "red3",
612 "red4",
613 "RosyBrown",
614 "RosyBrown1",
615 "RosyBrown2",
616 "RosyBrown3",
617 "RosyBrown4",
618 "RoyalBlue",
619 "RoyalBlue1",
620 "RoyalBlue2",
621 "RoyalBlue3",
622 "RoyalBlue4",
623 "SaddleBrown",
624 "salmon",
625 "salmon1",
626 "salmon2",
627 "salmon3",
628 "salmon4",
629 "SandyBrown",
630 "SeaGreen",
631 "SeaGreen1",
632 "SeaGreen2",
633 "SeaGreen3",
634 "SeaGreen4",
635 "seashell",
636 "seashell1",
637 "seashell2",
638 "seashell3",
639 "seashell4",
640 "sienna",
641 "sienna1",
642 "sienna2",
643 "sienna3",
644 "sienna4",
645 "silver",
646 "SkyBlue",
647 "SkyBlue1",
648 "SkyBlue2",
649 "SkyBlue3",
650 "SkyBlue4",
651 "SlateBlue",
652 "SlateBlue1",
653 "SlateBlue2",
654 "SlateBlue3",
655 "SlateBlue4",
656 "SlateGray",
657 "SlateGray1",
658 "SlateGray2",
659 "SlateGray3",
660 "SlateGray4",
661 "SlateGrey",
662 "snow",
663 "snow1",
664 "snow2",
665 "snow3",
666 "snow4",
667 "SpringGreen",
668 "SpringGreen1",
669 "SpringGreen2",
670 "SpringGreen3",
671 "SpringGreen4",
672 "SteelBlue",
673 "SteelBlue1",
674 "SteelBlue2",
675 "SteelBlue3",
676 "SteelBlue4",
677 "tan",
678 "tan1",
679 "tan2",
680 "tan3",
681 "tan4",
682 "teal",
683 "thistle",
684 "thistle1",
685 "thistle2",
686 "thistle3",
687 "thistle4",
688 "tomato",
689 "tomato1",
690 "tomato2",
691 "tomato3",
692 "tomato4",
693 "turquoise",
694 "turquoise1",
695 "turquoise2",
696 "turquoise3",
697 "turquoise4",
698 "violet",
699 "VioletRed",
700 "VioletRed1",
701 "VioletRed2",
702 "VioletRed3",
703 "VioletRed4",
704 "wheat",
705 "wheat1",
706 "wheat2",
707 "wheat3",
708 "wheat4",
709 "white",
710 "WhiteSmoke",
711 "yellow",
712 "yellow1",
713 "yellow2",
714 "yellow3",
715 "yellow4",
716 "YellowGreen",
717 NULL
718 };
719 int i;
720
721 if (!window)
722 {
723 window = gtk_window_new ();
724 gtk_window_set_display (GTK_WINDOW (window),
725 display: gtk_widget_get_display (widget: do_widget));
726 gtk_window_set_title (GTK_WINDOW (window), title: "Flow Box");
727 gtk_window_set_default_size (GTK_WINDOW (window), width: 400, height: 600);
728 g_object_add_weak_pointer (G_OBJECT (window), weak_pointer_location: (gpointer *)&window);
729
730 scrolled = gtk_scrolled_window_new ();
731 gtk_scrolled_window_set_policy (GTK_SCROLLED_WINDOW (scrolled), hscrollbar_policy: GTK_POLICY_NEVER, vscrollbar_policy: GTK_POLICY_AUTOMATIC);
732 flowbox = gtk_flow_box_new ();
733 gtk_widget_set_valign (widget: flowbox, align: GTK_ALIGN_START);
734 gtk_flow_box_set_max_children_per_line (GTK_FLOW_BOX (flowbox), n_children: 30);
735 gtk_flow_box_set_selection_mode (GTK_FLOW_BOX (flowbox), mode: GTK_SELECTION_NONE);
736
737 gtk_scrolled_window_set_child (GTK_SCROLLED_WINDOW (scrolled), child: flowbox);
738 gtk_window_set_child (GTK_WINDOW (window), child: scrolled);
739
740 for (i = 0; colors[i]; i++)
741 gtk_flow_box_insert (GTK_FLOW_BOX (flowbox), widget: color_swatch_new (color: colors[i]), position: -1);
742 }
743
744 if (!gtk_widget_get_visible (widget: window))
745 gtk_widget_show (widget: window);
746 else
747 gtk_window_destroy (GTK_WINDOW (window));
748
749 return window;
750}
751

source code of gtk/demos/gtk-demo/flowbox.c