Merge branch 'wip/jimmac/spinbutton-spacing' into 'master'

Adwaita: spinbutton spacing

Closes #3370

See merge request GNOME/gtk!2841

.gitlab-ci.yml

@@ -1,3 +1,7 @@
+include:
+  - project: 'gnome/citemplates'
+    file: 'flatpak/flatpak_ci_initiative.yml'
+
 stages:
   - build
   - analysis
@@ -149,6 +153,7 @@ msys2-mingw64:
   artifacts:
     paths:
       - "${APPID}-dev.flatpak"
+      - 'repo.tar'
     expire_in: 1 day
   script:
     - bash -x ./.gitlab-ci/flatpak-build.sh "${APPID}"
@@ -200,6 +205,24 @@ flatpak-master:icon-browser:
   variables:
     APPID: org.gtk.IconBrowser4
 
+# Publish the demo apps to the GNOME Nightly repo
+# https://wiki.gnome.org/Apps/Nightly
+# https://gitlab.gnome.org/GNOME/Initiatives/-/wikis/DevOps-with-Flatpak
+nightly demo:
+    extends: '.publish_nightly'
+    dependencies: ['flatpak-master:demo']
+    needs: ['flatpak-master:demo']
+
+nightly factory:
+    extends: '.publish_nightly'
+    dependencies: ['flatpak-master:widget-factory']
+    needs: ['flatpak-master:widget-factory']
+
+nightly icon-browser:
+    extends: '.publish_nightly'
+    dependencies: ['flatpak-master:icon-browser']
+    needs: ['flatpak-master:icon-browser']
+
 static-scan:
   image: $FEDORA_IMAGE
   stage: analysis

.gitlab-ci/flatpak-build.sh

@@ -40,3 +40,8 @@ flatpak build-bundle \
         ${appid}-dev.flatpak \
         --runtime-repo=https://nightly.gnome.org/gnome-nightly.flatpakrepo \
         ${appid}
+
+# to be consumed by the nightly publish jobs
+if [[ $CI_COMMIT_BRANCH == master ]]; then
+        tar cf repo.tar ${repodir}
+fi

NEWS

@@ -1,5 +1,94 @@
-Overview of Changes
-===================
+Overview of Changes in 3.99.4
+=============================
+
+* GtkColumnView:
+ - Improve column resizing
+ - Make double-click reset column widths
+ - Move header outside of scrollbars
+
+* GtkSearchEntry:
+ - Add an icon
+
+* GtkDropDown:
+ - Polish the appearance
+
+* GtkColorChooser:
+ - Accessibility improvements
+
+* GtkPopoverMenu:
+ - Add accessibility support
+ - Allow custom items. This adds new API:
+   gtk_popover_menu_add/remove_child
+   gtk_popover_menu_bar_add/remove_child
+
+* GtkTextView:
+ - Fix rendering and positioning of anchored children
+ - Fix positioning of touch handles
+
+* Constraints:
+ - Fix loading constraints from ui files
+
+* Media support:
+ - Use cubic instead of linear volume
+
+* Accessibility:
+ - Implement Component for all widgets
+ - Implement Text and EditableText for all editables
+ - Rework accessible name/description computation
+ - Add documentation for app and widget developers
+ - Handle HIDDEN state changes by adding/removing elements
+ - Support setting accessibility attributes in ui files
+ - Make window controls accessible
+
+* Introspection:
+ - Add some missing annotations
+
+* gdk:
+ - Deliver events on flush
+ - Drop the unused GdkPoint struct from the API
+ - Improve popup autohide behavior
+
+* Demos:
+ - Add another constraints demo
+ - Tweak various demos to improve consistency
+ - Small accessibility improvements
+
+* Tools:
+ - Improve gtk4-builder-tool handling of various
+   widgets when converting ui files from GTK 3
+
+* Documentation:
+ - Use GtkApplication in all examples
+ - Improve and expand the widget gallery
+
+* Testsuite:
+ - Improve coverage of GDK
+ - Improve coverage of gtk4-builder-tool
+
+* Build:
+ - Fix the build with cups 2.2.12
+ - Make cloudprint support build without warnings
+
+* Broadway:
+ - Support modifiers for scroll events
+
+* Windows:
+ - Improve IME support
+
+* OS X:
+ - Fix various input issues
+ - Make GtkGLArea work (with the cairo backend)
+
+* Translation updates:
+ German
+ Polish
+
+
+Overview of Changes in 3.99.3
+=============================
+
+* Accessibility:
+ - Add an initial AT-SPI backend
 
 * GtkEmojiChooser:
  - Allow inserting multiple Emoji by pressing Control
@@ -14,18 +103,44 @@ Overview of Changes
 * GtkScale:
  - Change the default value of the :draw-value property
 
+* GtkPopover:
+ - Avoid losing focus when popovers are close
+
+* GtkColorChooser:
+ - Add color names back for accessibility
+
 * Input methods:
  - Add a 'private' input hint
 
 * GL Renderer:
  - Fix issues with texture caching
+ - Fix texture flipping problems
 
 * Build:
  - Use meson yield feature for some options
  - Require gtk-doc 1.33
+ - Require sysprof 3.38
+
+* Wayland:
+ - Clean up Wayland backend api, add annotations
+ - Generate introspection for Wayland backend api
+
+* Windows:
+ - Fix modal window handling and window stacking
+
+* MacOS:
+ - Fix the build
+ - Define GDK_WINDOWING_MACOS
+ - Fix various event handling issues
 
 * Demos:
  - Add another column view demo
+ - Add an svg paintable demo
+
+* Translation updates
+ Czech
+ Lithuanian
+ Polish
 
 
 Overview of Changes in GTK 3.99.2

config.h.meson

@@ -1,8 +1,9 @@
-/* config.h.in.  Generated from configure.ac by autoheader.  */
-
 /* always defined to indicate that i18n is enabled */
 #define ENABLE_NLS 1
 
+/* Use structured logging */
+#define G_LOG_STRUCTURED 1
+
 /* The prefix for our gettext translation domains. */
 #mesondefine GETTEXT_PACKAGE
 

demos/gtk-demo/blendmodes.ui

@@ -1,6 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <interface>
-  <requires lib="gtk+" version="3.20"/>
   <object class="GtkWindow" id="window">
     <property name="resizable">0</property>
     <property name="title">CSS Blend Modes</property>

demos/gtk-demo/builder.c

@@ -158,7 +158,6 @@ do_builder (GtkWidget *do_widget)
       about = GTK_WIDGET (gtk_builder_get_object (builder, "aboutdialog1"));
       gtk_window_set_transient_for (GTK_WINDOW (about), GTK_WINDOW (window));
       gtk_window_set_hide_on_close (GTK_WINDOW (about), TRUE);
-      g_signal_connect (about, "response", G_CALLBACK (gtk_widget_hide), NULL);
       g_object_set_data_full (G_OBJECT (window), "about",
                               about, (GDestroyNotify)gtk_window_destroy);
 

demos/gtk-demo/constraints.c

@@ -1,9 +1,16 @@
-/* Constraints/Simple
+/* Constraints/Simple Constraints
  * #Keywords: GtkLayoutManager
  *
  * GtkConstraintLayout provides a layout manager that uses relations
- * between widgets (also known as "constraints") to compute the position
+ * between widgets (also known as “constraints”) to compute the position
  * and size of each child.
+ *
+ * In addition to child widgets, the constraints can involve spacer
+ * objects (also known as “guides”). This example has a guide between
+ * the two buttons in the top row.
+ *
+ * Try resizing the window to see how the constraints react to update
+ * the layout.
  */
 
 #include <glib/gi18n.h>
@@ -234,15 +241,12 @@ simple_grid_init (SimpleGrid *self)
 
   self->button1 = gtk_button_new_with_label ("Child 1");
   gtk_widget_set_parent (self->button1, widget);
-  gtk_widget_set_name (self->button1, "button1");
 
   self->button2 = gtk_button_new_with_label ("Child 2");
   gtk_widget_set_parent (self->button2, widget);
-  gtk_widget_set_name (self->button2, "button2");
 
   self->button3 = gtk_button_new_with_label ("Child 3");
   gtk_widget_set_parent (self->button3, widget);
-  gtk_widget_set_name (self->button3, "button3");
 
   GtkLayoutManager *manager = gtk_widget_get_layout_manager (GTK_WIDGET (self));
   build_constraints (self, GTK_CONSTRAINT_LAYOUT (manager));
@@ -259,7 +263,8 @@ do_constraints (GtkWidget *do_widget)
 
      window = gtk_window_new ();
      gtk_window_set_display (GTK_WINDOW (window), gtk_widget_get_display (do_widget));
-     gtk_window_set_title (GTK_WINDOW (window), "Constraints");
+     gtk_window_set_title (GTK_WINDOW (window), "Simple Constraints");
+     gtk_window_set_default_size (GTK_WINDOW (window), 260, -1);
      g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
 
      box = gtk_box_new (GTK_ORIENTATION_VERTICAL, 12);

demos/gtk-demo/constraints.ui

@@ -0,0 +1,106 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<interface>
+  <object class="GtkWindow" id="window1">
+    <property name="title" translatable="yes">Constraints — Builder</property>
+    <property name="default-width">260</property>
+    <child>
+      <object class="ConstraintsGrid">
+        <property name="layout-manager">
+          <object class="GtkConstraintLayout">
+            <constraints>
+              <guide name="space"
+                     min-width="10" min-height="10"
+                     nat-width="100" nat-height="10"
+                     max-width="200" max-height="20"
+                     strength="strong"/>
+              <constraint target="button1" target-attribute="width"
+                          relation="le"
+                          constant="200"
+                          strength="required"/>
+              <constraint target="super" target-attribute="start"
+                          relation="eq"
+                          source="button1" source-attribute="start"
+                          constant="-8"
+                          strength="required"/>
+              <constraint target="button1" target-attribute="width"
+                          relation="eq"
+                          source="button2" source-attribute="width"
+                          strength="required"/>
+              <constraint target="button1" target-attribute="end"
+                          relation="eq"
+                          source="space" source-attribute="start"
+                          strength="required"/>
+              <constraint target="space" target-attribute="end"
+                          relation="eq"
+                          source="button2" source-attribute="start"
+                          strength="required"/>
+              <constraint target="super" target-attribute="end"
+                          relation="eq"
+                          source="button2" source-attribute="end"
+                          constant="8"
+                          strength="required"/>
+              <constraint target="super" target-attribute="start"
+                          relation="eq"
+                          source="button3" source-attribute="start"
+                          constant="-8"
+                          strength="required"/>
+              <constraint target="super" target-attribute="end"
+                          relation="eq"
+                          source="button3" source-attribute="end"
+                          constant="8"
+                          strength="required"/>
+              <constraint target="super" target-attribute="top"
+                          relation="eq"
+                          source="button1" source-attribute="top"
+                          constant="-8"
+                          strength="required"/>
+              <constraint target="super" target-attribute="top"
+                          relation="eq"
+                          source="button2" source-attribute="top"
+                          constant="-8"
+                          strength="required"/>
+              <constraint target="button1" target-attribute="bottom"
+                          relation="eq"
+                          source="button3" source-attribute="top"
+                          constant="-12"
+                          strength="required"/>
+              <constraint target="button2" target-attribute="bottom"
+                          relation="eq"
+                          source="button3" source-attribute="top"
+                          constant="-12"
+                          strength="required"/>
+              <constraint target="button3" target-attribute="height"
+                          relation="eq"
+                          source="button1" source-attribute="height"
+                          strength="required"/>
+              <constraint target="button3" target-attribute="height"
+                          relation="eq"
+                          source="button2" source-attribute="height"
+                          strength="required"/>
+              <constraint target="super" target-attribute="bottom"
+                          relation="eq"
+                          source="button3" source-attribute="bottom"
+                          constant="8"
+                          strength="required"/>
+            </constraints>
+          </object>
+        </property>
+        <child>
+          <object class="GtkButton" id="button1">
+            <property name="label">Child 1</property>
+          </object>
+        </child>
+        <child>
+          <object class="GtkButton" id="button2">
+            <property name="label">Child 2</property>
+          </object>
+        </child>
+        <child>
+          <object class="GtkButton" id="button3">
+            <property name="label">Child 3</property>
+          </object>
+        </child>
+      </object>
+    </child>
+  </object>
+</interface>

demos/gtk-demo/constraints2.c

@@ -1,7 +1,7 @@
-/* Constraints/Interactive
+/* Constraints/Interactive Constraints
  * #Keywords: GtkConstraintLayout
  *
- * Demonstrate how constraints can be updates during user interaction.
+ * This example shows how constraints can be updated during user interaction.
  * The vertical edge between the buttons can be dragged with the mouse.
  */
 
@@ -215,7 +215,8 @@ do_constraints2 (GtkWidget *do_widget)
 
      window = gtk_window_new ();
      gtk_window_set_display (GTK_WINDOW (window), gtk_widget_get_display (do_widget));
-     gtk_window_set_title (GTK_WINDOW (window), "Constraints");
+     gtk_window_set_title (GTK_WINDOW (window), "Interactive Constraints");
+     gtk_window_set_default_size (GTK_WINDOW (window), 260, -1);
      g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
 
      box = gtk_box_new (GTK_ORIENTATION_VERTICAL, 12);

demos/gtk-demo/constraints3.c

@@ -2,6 +2,10 @@
  *
  * GtkConstraintLayout allows defining constraints using a
  * compact syntax called Visual Format Language, or VFL.
+ *
+ * A typical example of a VFL specification looks like this:
+ *
+ * H:|-[button1(==button2)]-12-[button2]-|
  */
 
 #include <glib/gi18n.h>
@@ -134,7 +138,8 @@ do_constraints3 (GtkWidget *do_widget)
 
      window = gtk_window_new ();
      gtk_window_set_display (GTK_WINDOW (window), gtk_widget_get_display (do_widget));
-     gtk_window_set_title (GTK_WINDOW (window), "Constraints");
+     gtk_window_set_title (GTK_WINDOW (window), "Constraints — VFL");
+     gtk_window_set_default_size (GTK_WINDOW (window), 260, -1);
      g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
 
      box = gtk_box_new (GTK_ORIENTATION_VERTICAL, 12);

demos/gtk-demo/constraints4.c

@@ -0,0 +1,72 @@
+/* Constraints/Builder
+ *
+ * GtkConstraintLayouts can be created in .ui files, and constraints can be
+ * set up at that time as well, as this example demonstrates. It uses the
+ * same setup as the “Simple” constraints demo.
+ */
+
+#include <glib/gi18n.h>
+#include <gtk/gtk.h>
+
+G_DECLARE_FINAL_TYPE (ConstraintsGrid, constraints_grid, CONSTRAINTS, GRID, GtkWidget)
+
+struct _ConstraintsGrid
+{
+  GtkWidget parent_instance;
+};
+
+G_DEFINE_TYPE (ConstraintsGrid, constraints_grid, GTK_TYPE_WIDGET)
+
+static void
+constraints_grid_init (ConstraintsGrid *grid)
+{
+}
+
+static void
+constraints_grid_dispose (GObject *object)
+{
+  GtkWidget *widget = GTK_WIDGET (object);
+  GtkWidget *child;
+
+  while ((child = gtk_widget_get_first_child (widget)))
+    gtk_widget_unparent (child);
+
+  G_OBJECT_CLASS (constraints_grid_parent_class)->dispose (object);
+}
+
+static void
+constraints_grid_class_init (ConstraintsGridClass *klass)
+{
+  GObjectClass *object_class = G_OBJECT_CLASS (klass);
+
+  object_class->dispose = constraints_grid_dispose;
+}
+
+GtkWidget *
+do_constraints4 (GtkWidget *do_widget)
+{
+ static GtkWidget *window;
+
+ if (!window)
+   {
+     GtkBuilder *builder;
+
+     g_type_ensure (constraints_grid_get_type ());
+
+     builder = gtk_builder_new_from_resource ("/constraints4/constraints.ui");
+
+     window = GTK_WIDGET (gtk_builder_get_object (builder, "window1"));
+     gtk_window_set_display (GTK_WINDOW (window),
+                             gtk_widget_get_display (do_widget));
+     g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
+
+     g_object_unref (builder);
+   }
+
+ if (!gtk_widget_get_visible (window))
+   gtk_widget_show (window);
+ else
+   gtk_window_destroy (GTK_WINDOW (window));
+
+ return window;
+}

demos/gtk-demo/demo.gresource.xml

@@ -18,6 +18,9 @@
     <file>demoimage.c</file>
     <file>demoimage.h</file>
   </gresource>
+  <gresource prefix="/constraints4">
+    <file>constraints.ui</file>
+  </gresource>
   <gresource prefix="/css_accordion">
     <file>css_accordion.css</file>
     <file>reset.css</file>
@@ -40,6 +43,11 @@
     <file>cssview.css</file>
     <file>reset.css</file>
   </gresource>
+  <gresource prefix="/dropdown">
+    <file>suggestionentry.h</file>
+    <file>suggestionentry.c</file>
+    <file>suggestionentry.css</file>
+  </gresource>
   <gresource prefix="/theming_style_classes">
     <file>theming.ui</file>
   </gresource>
@@ -205,6 +213,8 @@
     <file>demo3widget.ui</file>
   </gresource>
   <gresource prefix="/paintable_svg">
+    <file>svgpaintable.h</file>
+    <file>svgpaintable.c</file>
     <file>org.gtk.gtk4.NodeEditor.Devel.svg</file>
   </gresource>
   <gresource prefix="/shortcuts">
@@ -226,9 +236,12 @@
     <file>revealer.ui</file>
   </gresource>
   <gresource prefix="/images">
+    <file>pixbufpaintable.h</file>
+    <file>pixbufpaintable.c</file>
     <file>alphatest.png</file>
     <file>floppybuddy.gif</file>
     <file>gtk-logo.webm</file>
+    <file alias="org.gtk.Demo4.svg">data/scalable/apps/org.gtk.Demo4.svg</file>
   </gresource>
   <gresource prefix="/video-player">
     <file>bbb.png</file>
@@ -242,6 +255,7 @@
     <file>constraints.c</file>
     <file>constraints2.c</file>
     <file>constraints3.c</file>
+    <file>constraints4.c</file>
     <file>css_accordion.c</file>
     <file>css_basics.c</file>
     <file>css_blendmodes.c</file>

demos/gtk-demo/demo.ui

@@ -83,7 +83,7 @@
   </menu>
   <object class="GtkAboutDialog" id="aboutdialog1">
     <property name="program-name" translatable="yes">Builder demo</property>
-    <property name="logo-icon-name" translatable="yes">gtk3-demo</property>
+    <property name="logo-icon-name" translatable="yes">org.gtk.Demo4</property>
     <property name="modal">True</property>
   </object>
   <object class="GtkWindow" id="window1">
@@ -96,13 +96,18 @@
         <child>
           <object class="GtkPopoverMenuBar" id="menubar1">
             <property name="menu-model">menubar</property>
+            <accessibility>
+              <property name="label">Main Menu</property>
+            </accessibility>
           </object>
         </child>
         <child>
           <object class="GtkBox" id="toolbar1">
-            <style>
-              <class name="toolbar"/>
-            </style>
+            <property name="accessible-role">toolbar</property>
+            <property name="css-classes">toolbar</property>
+            <accessibility>
+              <property name="label">Toolbar</property>
+            </accessibility>
             <child>
               <object class="GtkButton">
                 <property name="label" translatable="yes">New</property>

demos/gtk-demo/demoimage.c

@@ -47,6 +47,38 @@ get_image_paintable (GtkImage *image)
     }
 }
 
+static void
+update_drag_icon (DemoImage   *demo,
+                  GtkDragIcon *icon)
+{
+  const char *icon_name;
+  GdkPaintable *paintable;
+  GtkWidget *image;
+
+  switch (gtk_image_get_storage_type (GTK_IMAGE (demo->image)))
+    {
+    case GTK_IMAGE_PAINTABLE:
+      paintable = gtk_image_get_paintable (GTK_IMAGE (demo->image));
+      image = gtk_image_new_from_paintable (paintable);
+      break;
+    case GTK_IMAGE_ICON_NAME:
+      icon_name = gtk_image_get_icon_name (GTK_IMAGE (demo->image));
+      image = gtk_image_new_from_icon_name (icon_name);
+      break;
+    case GTK_IMAGE_EMPTY:
+    case GTK_IMAGE_GICON:
+    default:
+      g_warning ("Image storage type %d not handled",
+                 gtk_image_get_storage_type (GTK_IMAGE (demo->image)));
+      return;
+    }
+
+  gtk_image_set_pixel_size (GTK_IMAGE (image),
+                            gtk_image_get_pixel_size (GTK_IMAGE (demo->image)));
+
+  gtk_drag_icon_set_child (icon, image);
+}
+
 static void
 drag_begin (GtkDragSource *source,
             GdkDrag       *drag,
@@ -54,14 +86,8 @@ drag_begin (GtkDragSource *source,
 {
   GtkWidget *widget = gtk_event_controller_get_widget (GTK_EVENT_CONTROLLER (source));
   DemoImage *demo = DEMO_IMAGE (widget);
-  GdkPaintable *paintable;
 
-  paintable = get_image_paintable (GTK_IMAGE (demo->image));
-  if (paintable)
-    {
-      gtk_drag_icon_set_from_paintable (drag, paintable, -2, -2);
-      g_object_unref (paintable);
-    }
+  update_drag_icon (demo, GTK_DRAG_ICON (gtk_drag_icon_get_for_drag (drag)));
 }
 
 static GdkContentProvider *

demos/gtk-demo/demotaggedentry.c

@@ -44,11 +44,23 @@ G_DEFINE_TYPE_WITH_CODE (DemoTaggedEntry, demo_tagged_entry, GTK_TYPE_WIDGET,
 static void
 demo_tagged_entry_init (DemoTaggedEntry *entry)
 {
+  GtkCssProvider *provider;
+
   entry->text = gtk_text_new ();
   gtk_widget_set_hexpand (entry->text, TRUE);
   gtk_widget_set_vexpand (entry->text, TRUE);
   gtk_widget_set_parent (entry->text, GTK_WIDGET (entry));
   gtk_editable_init_delegate (GTK_EDITABLE (entry));
+  gtk_editable_set_width_chars (GTK_EDITABLE (entry->text), 6);
+  gtk_editable_set_max_width_chars (GTK_EDITABLE (entry->text), 6);
+  gtk_widget_add_css_class (GTK_WIDGET (entry), "tagged");
+
+  provider = gtk_css_provider_new ();
+  gtk_css_provider_load_from_resource (provider, "/tagged_entry/tagstyle.css");
+  gtk_style_context_add_provider_for_display (gdk_display_get_default (),
+                                              GTK_STYLE_PROVIDER (provider),
+                                              800);
+  g_object_unref (provider);
 }
 
 static void
@@ -116,6 +128,7 @@ demo_tagged_entry_class_init (DemoTaggedEntryClass *klass)
 
   gtk_widget_class_set_layout_manager_type (widget_class, GTK_TYPE_BOX_LAYOUT);
   gtk_widget_class_set_css_name (widget_class, "entry");
+  gtk_widget_class_set_accessible_role (widget_class, GTK_ACCESSIBLE_ROLE_TEXT_BOX);
 }
 
 static GtkEditable *
@@ -211,7 +224,6 @@ static void
 demo_tagged_entry_tag_init (DemoTaggedEntryTag *tag)
 {
   GtkGesture *gesture;
-  GtkCssProvider *provider;
 
   tag->box = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 0);
   gtk_widget_set_parent (tag->box, GTK_WIDGET (tag));
@@ -221,13 +233,6 @@ demo_tagged_entry_tag_init (DemoTaggedEntryTag *tag)
   gesture = gtk_gesture_click_new ();
   g_signal_connect (gesture, "released", G_CALLBACK (on_released), tag);
   gtk_widget_add_controller (GTK_WIDGET (tag), GTK_EVENT_CONTROLLER (gesture));
-
-  provider = gtk_css_provider_new ();
-  gtk_css_provider_load_from_resource (provider, "/tagged_entry/tagstyle.css");
-  gtk_style_context_add_provider_for_display (gdk_display_get_default (),
-                                              GTK_STYLE_PROVIDER (provider),
-                                              800);
-  g_object_unref (provider);
 }
 
 static void

demos/gtk-demo/dnd.c

@@ -113,12 +113,9 @@ apply_transform (CanvasItem *item)
   y = gtk_widget_get_allocated_height (item->label) / 2.0;
   item->r = sqrt (x*x + y*y);
 
-  transform = gsk_transform_translate (
-                 gsk_transform_rotate (
-                   gsk_transform_translate (NULL,
-                                            &(graphene_point_t) { item->r, item->r }),
-                   item->angle + item->delta),
-                 &(graphene_point_t) { - x, - y });
+  transform = gsk_transform_translate (NULL, &(graphene_point_t) { item->r, item->r });
+  transform = gsk_transform_rotate (transform, item->angle + item->delta);
+  transform = gsk_transform_translate (transform, &(graphene_point_t) { -x, -y });
 
   gtk_fixed_set_child_transform (GTK_FIXED (item->fixed), item->label, transform);
   gsk_transform_unref (transform);

demos/gtk-demo/drawingarea.c

@@ -311,6 +311,7 @@ do_drawingarea (GtkWidget *do_widget)
       gtk_window_set_display (GTK_WINDOW (window),
                               gtk_widget_get_display (do_widget));
       gtk_window_set_title (GTK_WINDOW (window), "Drawing Area");
+      gtk_window_set_default_size (GTK_WINDOW (window), 250, -1);
 
       g_signal_connect (window, "destroy",
                         G_CALLBACK (close_window), NULL);
@@ -325,9 +326,8 @@ do_drawingarea (GtkWidget *do_widget)
       /*
        * Create the groups area
        */
-      label = gtk_label_new (NULL);
-      gtk_label_set_markup (GTK_LABEL (label),
-                            "<u>Knockout groups</u>");
+      label = gtk_label_new ("Knockout groups");
+      gtk_widget_add_css_class (label, "heading");
       gtk_box_append (GTK_BOX (vbox), label);
 
       frame = gtk_frame_new (NULL);
@@ -344,9 +344,8 @@ do_drawingarea (GtkWidget *do_widget)
        * Create the scribble area
        */
 
-      label = gtk_label_new (NULL);
-      gtk_label_set_markup (GTK_LABEL (label),
-                            "<u>Scribble area</u>");
+      label = gtk_label_new ("Scribble area");
+      gtk_widget_add_css_class (label, "heading");
       gtk_box_append (GTK_BOX (vbox), label);
 
       frame = gtk_frame_new (NULL);

demos/gtk-demo/dropdown.c

@@ -1,17 +1,16 @@
-/* Drop Downs
+/* Lists/Selections
  *
  * The GtkDropDown widget is a modern alternative to GtkComboBox.
  * It uses list models instead of tree models, and the content is
  * displayed using widgets instead of cell renderers.
  *
- * The examples here demonstrate how to use different kinds of
- * list models with GtkDropDown, how to use search and how to
- * display the selected item differently from the presentation
- * in the popup.
+ * This example also shows a custom widget that can replace
+ * GtkEntryCompletion or GtkComboBoxText. It is not currently
+ * part of GTK.
  */
 
 #include <gtk/gtk.h>
-
+#include "suggestionentry.h"
 
 #define STRING_TYPE_HOLDER (string_holder_get_type ())
 G_DECLARE_FINAL_TYPE (StringHolder, string_holder, STRING, HOLDER, GObject)
@@ -65,18 +64,22 @@ strings_setup_item_single_line (GtkSignalListItemFactory *factory,
                                 GtkListItem              *item)
 {
   GtkWidget *box, *image, *title;
+  GtkWidget *checkmark;
 
   box = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 10);
 
   image = gtk_image_new ();
   title = gtk_label_new ("");
   gtk_label_set_xalign (GTK_LABEL (title), 0.0);
+  checkmark = gtk_image_new_from_icon_name ("object-select-symbolic");
 
   gtk_box_append (GTK_BOX (box), image);
   gtk_box_append (GTK_BOX (box), title);
+  gtk_box_append (GTK_BOX (box), checkmark);
 
   g_object_set_data (G_OBJECT (item), "title", title);
   g_object_set_data (G_OBJECT (item), "image", image);
+  g_object_set_data (G_OBJECT (item), "checkmark", checkmark);
 
   gtk_list_item_set_child (item, box);
 }
@@ -86,6 +89,7 @@ strings_setup_item_full (GtkSignalListItemFactory *factory,
                          GtkListItem              *item)
 {
   GtkWidget *box, *box2, *image, *title, *description;
+  GtkWidget *checkmark;
 
   image = gtk_image_new ();
   title = gtk_label_new ("");
@@ -93,6 +97,7 @@ strings_setup_item_full (GtkSignalListItemFactory *factory,
   description = gtk_label_new ("");
   gtk_label_set_xalign (GTK_LABEL (description), 0.0);
   gtk_widget_add_css_class (description, "dim-label");
+  checkmark = gtk_image_new_from_icon_name ("object-select-symbolic");
 
   box = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 10);
   box2 = gtk_box_new (GTK_ORIENTATION_VERTICAL, 2);
@@ -101,26 +106,48 @@ strings_setup_item_full (GtkSignalListItemFactory *factory,
   gtk_box_append (GTK_BOX (box), box2);
   gtk_box_append (GTK_BOX (box2), title);
   gtk_box_append (GTK_BOX (box2), description);
+  gtk_box_append (GTK_BOX (box), checkmark);
 
   g_object_set_data (G_OBJECT (item), "title", title);
   g_object_set_data (G_OBJECT (item), "image", image);
   g_object_set_data (G_OBJECT (item), "description", description);
+  g_object_set_data (G_OBJECT (item), "checkmark", checkmark);
 
   gtk_list_item_set_child (item, box);
 }
 
 static void
-strings_bind_item (GtkSignalListItemFactory *factory,
-                    GtkListItem              *item)
+selected_item_changed (GtkDropDown *dropdown,
+                       GParamSpec  *pspec,
+                       GtkListItem *item)
 {
+  GtkWidget *checkmark;
+
+  checkmark = g_object_get_data (G_OBJECT (item), "checkmark");
+
+  if (gtk_drop_down_get_selected_item (dropdown) == gtk_list_item_get_item (item))
+    gtk_widget_set_opacity (checkmark, 1.0);
+  else
+    gtk_widget_set_opacity (checkmark, 0.0);
+}
+
+static void
+strings_bind_item (GtkSignalListItemFactory *factory,
+                   GtkListItem              *item,
+                   gpointer                  data)
+{
+  GtkDropDown *dropdown = data;
   GtkWidget *image, *title, *description;
+  GtkWidget *checkmark;
   StringHolder *holder;
+  GtkWidget *popup;
 
   holder = gtk_list_item_get_item (item);
 
   title = g_object_get_data (G_OBJECT (item), "title");
   image = g_object_get_data (G_OBJECT (item), "image");
   description = g_object_get_data (G_OBJECT (item), "description");
+  checkmark = g_object_get_data (G_OBJECT (item), "checkmark");
 
   gtk_label_set_label (GTK_LABEL (title), holder->title);
   if (image)
@@ -133,19 +160,43 @@ strings_bind_item (GtkSignalListItemFactory *factory,
       gtk_label_set_label (GTK_LABEL (description), holder->description);
       gtk_widget_set_visible (description , holder->description != NULL);
     }
+
+  popup = gtk_widget_get_ancestor (title, GTK_TYPE_POPOVER);
+  if (popup && gtk_widget_is_ancestor (popup, GTK_WIDGET (dropdown)))
+    {
+      gtk_widget_show (checkmark);
+      g_signal_connect (dropdown, "notify::selected-item",
+                        G_CALLBACK (selected_item_changed), item);
+      selected_item_changed (dropdown, NULL, item);
+    }
+  else
+    {
+      gtk_widget_hide (checkmark);
+    }
+}
+
+static void
+strings_unbind_item (GtkSignalListItemFactory *factory,
+                     GtkListItem              *list_item,
+                     gpointer                  data)
+{
+  GtkDropDown *dropdown = data;
+
+  g_signal_handlers_disconnect_by_func (dropdown, selected_item_changed, list_item);
 }
 
 static GtkListItemFactory *
-strings_factory_new (gboolean full)
+strings_factory_new (gpointer data, gboolean full)
 {
   GtkListItemFactory *factory;
 
   factory = gtk_signal_list_item_factory_new ();
   if (full)
-    g_signal_connect (factory, "setup", G_CALLBACK (strings_setup_item_full), NULL);
+    g_signal_connect (factory, "setup", G_CALLBACK (strings_setup_item_full), data);
   else
-    g_signal_connect (factory, "setup", G_CALLBACK (strings_setup_item_single_line), NULL);
-  g_signal_connect (factory, "bind", G_CALLBACK (strings_bind_item), NULL);
+    g_signal_connect (factory, "setup", G_CALLBACK (strings_setup_item_single_line), data);
+  g_signal_connect (factory, "bind", G_CALLBACK (strings_bind_item), data);
+  g_signal_connect (factory, "unbind", G_CALLBACK (strings_unbind_item), data);
 
   return factory;
 }
@@ -186,19 +237,22 @@ drop_down_new_from_strings (const char *const *titles,
   g_return_val_if_fail (descriptions == NULL || g_strv_length ((char **)icons) == g_strv_length ((char **)descriptions), NULL);
 
   model = strings_model_new (titles, icons, descriptions);
-  factory = strings_factory_new (FALSE);
+  widget = g_object_new (GTK_TYPE_DROP_DOWN,
+                         "model", model,
+                         NULL);
+  g_object_unref (model);
+
+  factory = strings_factory_new (widget, FALSE);
   if (icons != NULL || descriptions != NULL)
-    list_factory = strings_factory_new (TRUE);
+    list_factory = strings_factory_new (widget, TRUE);
   else
     list_factory = NULL;
 
-  widget = g_object_new (GTK_TYPE_DROP_DOWN,
-                         "model", model,
-                         "factory", factory,
-                         "list-factory", list_factory,
-                         NULL);
+  g_object_set (widget,
+                "factory", factory,
+                "list-factory", list_factory,
+                NULL);
 
-  g_object_unref (model);
   g_object_unref (factory);
   if (list_factory)
     g_object_unref (list_factory);
@@ -218,13 +272,110 @@ get_title (gpointer item)
   return g_strdup (STRING_HOLDER (item)->title);
 }
 
+static char *
+get_file_name (gpointer item)
+{
+  return g_strdup (g_file_info_get_display_name (G_FILE_INFO (item)));
+}
+
+static void
+setup_item (GtkSignalListItemFactory *factory,
+            GtkListItem              *item)
+{
+  GtkWidget *box;
+  GtkWidget *icon;
+  GtkWidget *label;
+
+  box = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 10);
+  icon = gtk_image_new ();
+  label = gtk_label_new ("");
+  gtk_label_set_xalign (GTK_LABEL (label), 0);
+  gtk_box_append (GTK_BOX (box), icon);
+  gtk_box_append (GTK_BOX (box), label);
+  gtk_list_item_set_child (item, box);
+}
+
+static void
+bind_item (GtkSignalListItemFactory *factory,
+           GtkListItem              *item)
+{
+  MatchObject *match = MATCH_OBJECT (gtk_list_item_get_item (item));
+  GFileInfo *info = G_FILE_INFO (match_object_get_item (match));
+  GtkWidget *box = gtk_list_item_get_child (item);
+  GtkWidget *icon = gtk_widget_get_first_child (box);
+  GtkWidget *label = gtk_widget_get_last_child (box);
+
+  gtk_image_set_from_gicon (GTK_IMAGE (icon), g_file_info_get_icon (info));
+  gtk_label_set_label (GTK_LABEL (label), g_file_info_get_display_name (info));
+}
+
+static void
+setup_highlight_item (GtkSignalListItemFactory *factory,
+                      GtkListItem              *item)
+{
+  GtkWidget *label;
+
+  label = gtk_label_new ("");
+  gtk_label_set_xalign (GTK_LABEL (label), 0);
+  gtk_list_item_set_child (item, label);
+}
+
+static void
+bind_highlight_item (GtkSignalListItemFactory *factory,
+                     GtkListItem              *item)
+{
+  MatchObject *obj;
+  GtkWidget *label;
+  PangoAttrList *attrs;
+  PangoAttribute *attr;
+  const char *str;
+
+  obj = MATCH_OBJECT (gtk_list_item_get_item (item));
+  label = gtk_list_item_get_child (item);
+
+  str = match_object_get_string (obj);
+
+  gtk_label_set_label (GTK_LABEL (label), str);
+  attrs = pango_attr_list_new ();
+  attr = pango_attr_weight_new (PANGO_WEIGHT_BOLD);
+  attr->start_index = match_object_get_match_start (obj);
+  attr->end_index = match_object_get_match_end (obj);
+  pango_attr_list_insert (attrs, attr);
+  gtk_label_set_attributes (GTK_LABEL (label), attrs);
+  pango_attr_list_unref (attrs);
+}
+
+static void
+match_func (MatchObject *obj,
+            const char  *search,
+            gpointer     user_data)
+{
+  char *tmp1, *tmp2;
+  char *p;
+
+  tmp1 = g_utf8_normalize (match_object_get_string (obj), -1, G_NORMALIZE_ALL);
+  tmp2 = g_utf8_normalize (search, -1, G_NORMALIZE_ALL);
+
+  if ((p = strstr (tmp1, tmp2)) != NULL)
+    match_object_set_match (obj,
+                            p - tmp1,
+                            (p - tmp1) + g_utf8_strlen (search, -1),
+                            1);
+  else
+    match_object_set_match (obj, 0, 0, 0);
+
+  g_free (tmp1);
+  g_free (tmp2);
+}
+
 GtkWidget *
 do_dropdown (GtkWidget *do_widget)
 {
   static GtkWidget *window = NULL;
-  GtkWidget *button, *box, *spin, *check;
+  GtkWidget *button, *box, *spin, *check, *hbox, *label, *entry;
   GListModel *model;
   GtkExpression *expression;
+  GtkListItemFactory *factory;
   const char * const times[] = { "1 minute", "2 minutes", "5 minutes", "20 minutes", NULL };
   const char * const many_times[] = {
     "1 minute", "2 minutes", "5 minutes", "10 minutes", "15 minutes", "20 minutes",
@@ -237,22 +388,49 @@ do_dropdown (GtkWidget *do_widget)
   const char * const device_descriptions[] = {
     "Built-in Audio", "Built-in audio", "Thinkpad Tunderbolt 3 Dock USB Audio", "Thinkpad Tunderbolt 3 Dock USB Audio", NULL
   };
+  char *cwd;
+  GFile *file;
+  GListModel *dir;
+  GtkStringList *strings;
 
   if (!window)
     {
       window = gtk_window_new ();
       gtk_window_set_display (GTK_WINDOW (window),
                               gtk_widget_get_display (do_widget));
-      gtk_window_set_title (GTK_WINDOW (window), "Drop Downs");
+      gtk_window_set_title (GTK_WINDOW (window), "Selections");
       gtk_window_set_resizable (GTK_WINDOW (window), FALSE);
       g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
 
+      hbox = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 20);
+
+      gtk_widget_set_margin_start (hbox, 20);
+      gtk_widget_set_margin_end (hbox, 20);
+      gtk_widget_set_margin_top (hbox, 20);
+      gtk_widget_set_margin_bottom (hbox, 20);
+      gtk_window_set_child (GTK_WINDOW (window), hbox);
+
       box = gtk_box_new (GTK_ORIENTATION_VERTICAL, 10);
-      gtk_widget_set_margin_start (box, 10);
-      gtk_widget_set_margin_end (box, 10);
-      gtk_widget_set_margin_top (box, 10);
-      gtk_widget_set_margin_bottom (box, 10);
-      gtk_window_set_child (GTK_WINDOW (window), box);
+      gtk_box_append (GTK_BOX (hbox), box);
+
+      label = gtk_label_new ("Dropdowns");
+      gtk_widget_add_css_class (label, "title-4");
+      gtk_box_append (GTK_BOX (box), label);
+
+      /* A basic dropdown */
+      button = drop_down_new_from_strings (times, NULL, NULL);
+      gtk_box_append (GTK_BOX (box), button);
+
+      /* A dropdown using an expression to obtain strings */
+      button = drop_down_new_from_strings (many_times, NULL, NULL);
+      gtk_drop_down_set_enable_search (GTK_DROP_DOWN (button), TRUE);
+      expression = gtk_cclosure_expression_new (G_TYPE_STRING, NULL,
+                                                0, NULL,
+                                                (GCallback)get_title,
+                                                NULL, NULL);
+      gtk_drop_down_set_expression (GTK_DROP_DOWN (button), expression);
+      gtk_expression_unref (expression);
+      gtk_box_append (GTK_BOX (box), button);
 
       button = gtk_drop_down_new (NULL, NULL);
 
@@ -270,30 +448,118 @@ do_dropdown (GtkWidget *do_widget)
 
       spin = gtk_spin_button_new_with_range (-1, g_list_model_get_n_items (G_LIST_MODEL (model)), 1);
       gtk_widget_set_halign (spin, GTK_ALIGN_START);
+      gtk_widget_set_margin_start (spin, 20);
       g_object_bind_property  (button, "selected", spin, "value", G_BINDING_SYNC_CREATE | G_BINDING_BIDIRECTIONAL);
       gtk_box_append (GTK_BOX (box), spin);
 
       check = gtk_check_button_new_with_label ("Enable search");
+      gtk_widget_set_margin_start (check, 20);
       g_object_bind_property  (button, "enable-search", check, "active", G_BINDING_SYNC_CREATE | G_BINDING_BIDIRECTIONAL);
       gtk_box_append (GTK_BOX (box), check);
 
       g_object_unref (model);
 
-      button = drop_down_new_from_strings (times, NULL, NULL);
-      gtk_box_append (GTK_BOX (box), button);
-
-      button = drop_down_new_from_strings (many_times, NULL, NULL);
-      gtk_drop_down_set_enable_search (GTK_DROP_DOWN (button), TRUE);
-      expression = gtk_cclosure_expression_new (G_TYPE_STRING, NULL,
-                                                0, NULL,
-                                                (GCallback)get_title,
-                                                NULL, NULL);
-      gtk_drop_down_set_expression (GTK_DROP_DOWN (button), expression);
-      gtk_expression_unref (expression);
-      gtk_box_append (GTK_BOX (box), button);
-
+      /* A dropdown with a separate list factory */
       button = drop_down_new_from_strings (device_titles, device_icons, device_descriptions);
       gtk_box_append (GTK_BOX (box), button);
+
+      gtk_box_append (GTK_BOX (hbox), gtk_separator_new (GTK_ORIENTATION_VERTICAL));
+
+      box = gtk_box_new (GTK_ORIENTATION_VERTICAL, 10);
+      gtk_box_append (GTK_BOX (hbox), box);
+
+      label = gtk_label_new ("Suggestions");
+      gtk_widget_add_css_class (label, "title-4");
+      gtk_box_append (GTK_BOX (box), label);
+
+      /* A basic suggestion entry */
+      entry = suggestion_entry_new ();
+      g_object_set (entry, "placeholder-text", "Words with T or G…", NULL);
+      strings = gtk_string_list_new ((const char *[]){
+                                     "GNOME",
+                                     "gnominious",
+                                     "Gnomonic projection",
+                                     "total",
+                                     "totally",
+                                     "toto",
+                                     "tottery",
+                                     "totterer",
+                                     "Totten trust",
+                                     "totipotent",
+                                     "totipotency",
+                                     "totemism",
+                                     "totem pole",
+                                     "Totara",
+                                     "totalizer",
+                                     "totalizator",
+                                     "totalitarianism",
+                                     "total parenteral nutrition",
+                                     "total hysterectomy",
+                                     "total eclipse",
+                                     "Totipresence",
+                                     "Totipalmi",
+                                     "Tomboy",
+                                     "zombie",
+                                     NULL});
+      suggestion_entry_set_model (SUGGESTION_ENTRY (entry), G_LIST_MODEL (strings));
+      g_object_unref (strings);
+
+      gtk_box_append (GTK_BOX (box), entry);
+
+      /* A suggestion entry using a custom model, and no filtering */
+      entry = suggestion_entry_new ();
+
+      cwd = g_get_current_dir ();
+      file = g_file_new_for_path (cwd);
+      dir = G_LIST_MODEL (gtk_directory_list_new ("standard::display-name,standard::content-type,standard::icon,standard::size", file));
+      suggestion_entry_set_model (SUGGESTION_ENTRY (entry), dir);
+      g_object_unref (dir);
+      g_object_unref (file);
+      g_free (cwd);
+
+      expression = gtk_cclosure_expression_new (G_TYPE_STRING, NULL,
+                                                0, NULL,
+                                                (GCallback)get_file_name,
+                                                NULL, NULL);
+      suggestion_entry_set_expression (SUGGESTION_ENTRY (entry), expression);
+      gtk_expression_unref (expression);
+
+      factory = gtk_signal_list_item_factory_new ();
+      g_signal_connect (factory, "setup", G_CALLBACK (setup_item), NULL);
+      g_signal_connect (factory, "bind", G_CALLBACK (bind_item), NULL);
+
+      suggestion_entry_set_factory (SUGGESTION_ENTRY (entry), factory);
+      g_object_unref (factory);
+
+      suggestion_entry_set_use_filter (SUGGESTION_ENTRY (entry), FALSE);
+      suggestion_entry_set_show_arrow (SUGGESTION_ENTRY (entry), TRUE);
+
+      gtk_box_append (GTK_BOX (box), entry);
+
+      /* A suggestion entry with match highlighting */
+      entry = suggestion_entry_new ();
+      g_object_set (entry, "placeholder-text", "Destination", NULL);
+
+      strings = gtk_string_list_new ((const char *[]){
+                                     "app-mockups",
+                                     "settings-mockups",
+                                     "os-mockups",
+                                     "software-mockups",
+                                     "mocktails",
+                                     NULL});
+      suggestion_entry_set_model (SUGGESTION_ENTRY (entry), G_LIST_MODEL (strings));
+      g_object_unref (strings);
+
+      gtk_box_append (GTK_BOX (box), entry);
+
+      suggestion_entry_set_match_func (SUGGESTION_ENTRY (entry), match_func, NULL, NULL);
+
+      factory = gtk_signal_list_item_factory_new ();
+      g_signal_connect (factory, "setup", G_CALLBACK (setup_highlight_item), NULL);
+      g_signal_connect (factory, "bind", G_CALLBACK (bind_highlight_item), NULL);
+      suggestion_entry_set_factory (SUGGESTION_ENTRY (entry), factory);
+      g_object_unref (factory);
+
     }
 
   if (!gtk_widget_get_visible (window))

demos/gtk-demo/entry_completion.c

@@ -78,11 +78,11 @@ do_entry_completion (GtkWidget *do_widget)
       gtk_window_set_resizable (GTK_WINDOW (window), FALSE);
       g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
 
-      vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 5);
-      gtk_widget_set_margin_start (vbox, 5);
-      gtk_widget_set_margin_end (vbox, 5);
-      gtk_widget_set_margin_top (vbox, 5);
-      gtk_widget_set_margin_bottom (vbox, 5);
+      vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 12);
+      gtk_widget_set_margin_start (vbox, 18);
+      gtk_widget_set_margin_end (vbox, 18);
+      gtk_widget_set_margin_top (vbox, 18);
+      gtk_widget_set_margin_bottom (vbox, 18);
       gtk_window_set_child (GTK_WINDOW (window), vbox);
 
       label = gtk_label_new (NULL);

demos/gtk-demo/entry_undo.c

@@ -27,16 +27,16 @@ do_entry_undo (GtkWidget *do_widget)
       gtk_window_set_resizable (GTK_WINDOW (window), FALSE);
       g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
 
-      vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 5);
-      gtk_widget_set_margin_start (vbox, 5);
-      gtk_widget_set_margin_end (vbox, 5);
-      gtk_widget_set_margin_top (vbox, 5);
-      gtk_widget_set_margin_bottom (vbox, 5);
+      vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 12);
+      gtk_widget_set_margin_start (vbox, 18);
+      gtk_widget_set_margin_end (vbox, 18);
+      gtk_widget_set_margin_top (vbox, 18);
+      gtk_widget_set_margin_bottom (vbox, 18);
       gtk_window_set_child (GTK_WINDOW (window), vbox);
 
       label = gtk_label_new (NULL);
       gtk_label_set_markup (GTK_LABEL (label),
-                            "Use Primary+z or Primary+Shift+z to undo or redo changes");
+                            "Use Control+z or Control+Shift+z to undo or redo changes");
       gtk_box_append (GTK_BOX (vbox), label);
 
       /* Create our entry */

demos/gtk-demo/errorstates.c

@@ -1,4 +1,4 @@
-/* Error states
+/* Error States
  *
  * GtkLabel and GtkEntry can indicate errors if you set the .error
  * style class on them.

demos/gtk-demo/errorstates.ui

@@ -5,7 +5,7 @@
     <property name="modal">1</property>
     <property name="resizable">0</property>
     <property name="use-header-bar">1</property>
-    <property name="title" translatable="yes">Settings</property>
+    <property name="title" translatable="yes">Error States</property>
     <property name="hide-on-close">1</property>
     <child internal-child="content_area">
       <object class="GtkBox">

demos/gtk-demo/filtermodel.ui

@@ -1,6 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <interface>
-  <requires lib="gtk+" version="3.16"/>
   <object class="GtkListStore" id="liststore1">
     <columns>
       <column type="gint"/>

demos/gtk-demo/font-features.ui

@@ -1,6 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <interface>
-  <requires lib="gtk+" version="3.12"/>
   <object class="GtkWindow" id="window">
     <property name="default-width">600</property>
     <property name="default-height">500</property>

demos/gtk-demo/font_features.c

@@ -1068,7 +1068,6 @@ update_font_variations (void)
   unsigned int length;
   int i;
 
-  child = gtk_widget_get_first_child (variations_grid);
   while ((child = gtk_widget_get_first_child (variations_grid)))
     gtk_grid_remove (GTK_GRID (variations_grid), child);
 

demos/gtk-demo/fontify.c

@@ -501,7 +501,7 @@ fontify (const char    *format,
   char *theme;
   gboolean prefer_dark;
   const char *style_arg;
-  const char *text;
+  char *text;
   GtkTextIter start, end;
   GBytes *bytes;
   GError *error = NULL;
@@ -553,7 +553,7 @@ fontify (const char    *format,
 
   gtk_text_buffer_get_bounds (source_buffer, &start, &end);
   text = gtk_text_buffer_get_text (source_buffer, &start, &end, TRUE);
-  bytes = g_bytes_new_static (text, strlen (text));
+  bytes = g_bytes_new_take (text, strlen (text));
 
 #ifdef HAVE_GIO_UNIX
   /* Work around https://gitlab.gnome.org/GNOME/glib/-/issues/2182 */
@@ -570,4 +570,5 @@ fontify (const char    *format,
                                   NULL,
                                   fontify_finish,
                                   g_object_ref (source_buffer));
+  g_bytes_unref (bytes);
 }

demos/gtk-demo/fontrendering.c

@@ -1,4 +1,4 @@
-/* Pango/Font rendering
+/* Pango/Font Rendering
  *
  * Demonstrates various aspects of font rendering.
  */

demos/gtk-demo/glarea.c

@@ -406,6 +406,7 @@ create_glarea_window (GtkWidget *do_widget)
   gl_area = gtk_gl_area_new ();
   gtk_widget_set_hexpand (gl_area, TRUE);
   gtk_widget_set_vexpand (gl_area, TRUE);
+  gtk_widget_set_size_request (gl_area, 100, 200);
   gtk_box_append (GTK_BOX (box), gl_area);
 
   /* We need to initialize and free GL resources, so we use

demos/gtk-demo/gltransition.c

@@ -1,4 +1,4 @@
-/* OpenGL/Transitions
+/* OpenGL/Transitions and Effects
  * #Keywords: OpenGL, shader, effect
  *
  * Create transitions between pages using a custom fragment shader.
@@ -282,11 +282,12 @@ create_gltransition_window (GtkWidget *do_widget)
 
   window = gtk_window_new ();
   gtk_window_set_display (GTK_WINDOW (window),  gtk_widget_get_display (do_widget));
-  gtk_window_set_title (GTK_WINDOW (window), "Transitions");
+  gtk_window_set_title (GTK_WINDOW (window), "Transitions and Effects");
   headerbar = gtk_header_bar_new ();
   scale = gtk_scale_new (GTK_ORIENTATION_HORIZONTAL, NULL);
   gtk_scale_set_draw_value (GTK_SCALE (scale), FALSE);
   gtk_widget_set_size_request (scale, 100, -1);
+  gtk_widget_set_tooltip_text (scale, "Transition duration");
   gtk_header_bar_pack_end (GTK_HEADER_BAR (headerbar), scale);
   gtk_window_set_titlebar (GTK_WINDOW (window), headerbar);
   gtk_window_set_default_size (GTK_WINDOW (window), 800, 600);

demos/gtk-demo/iconscroll.c

@@ -13,7 +13,7 @@ static GtkWidget *window = NULL;
 static GtkWidget *scrolledwindow;
 static int selected;
 
-#define N_WIDGET_TYPES 6
+#define N_WIDGET_TYPES 7
 
 
 static int hincrement = 5;
@@ -177,6 +177,24 @@ populate_grid (void)
   gtk_scrolled_window_set_child (GTK_SCROLLED_WINDOW (scrolledwindow), list);
 }
 
+extern GtkWidget *create_ucd_view (GtkWidget *label);
+
+static void
+populate_list2 (void)
+{
+  GtkWidget *list;
+
+  list = create_ucd_view (NULL);
+
+  hincrement = 0;
+  vincrement = 5;
+
+  gtk_scrolled_window_set_policy (GTK_SCROLLED_WINDOW (scrolledwindow),
+                                  GTK_POLICY_AUTOMATIC,
+                                  GTK_POLICY_AUTOMATIC);
+  gtk_scrolled_window_set_child (GTK_SCROLLED_WINDOW (scrolledwindow), list);
+}
+
 static void
 set_widget_type (int type)
 {
@@ -216,6 +234,11 @@ set_widget_type (int type)
       break;
 
     case 5:
+      gtk_window_set_title (GTK_WINDOW (window), "Scrolling a columned list");
+      populate_list2 ();
+      break;
+
+    case 6:
       gtk_window_set_title (GTK_WINDOW (window), "Scrolling a grid");
       populate_grid ();
       break;

demos/gtk-demo/images.c

@@ -17,6 +17,7 @@
 #include <glib/gstdio.h>
 #include <stdio.h>
 #include <errno.h>
+#include "pixbufpaintable.h"
 
 static GtkWidget *window = NULL;
 static GdkPixbufLoader *pixbuf_loader = NULL;
@@ -56,6 +57,7 @@ progressive_updated_callback (GdkPixbufLoader *loader,
   picture = GTK_WIDGET (data);
 
   pixbuf = gdk_pixbuf_loader_get_pixbuf (loader);
+  gtk_picture_set_pixbuf (GTK_PICTURE (picture), NULL);
   gtk_picture_set_pixbuf (GTK_PICTURE (picture), pixbuf);
 }
 
@@ -262,7 +264,7 @@ start_progressive_loading (GtkWidget *picture)
    * The timeout simply simulates a slow data source by inserting
    * pauses in the reading process.
    */
-  load_timeout = g_timeout_add (1500, progressive_timeout, picture);
+  load_timeout = g_timeout_add (300, progressive_timeout, picture);
   g_source_set_name_by_id (load_timeout, "[gtk] progressive_timeout");
 }
 
@@ -345,9 +347,8 @@ do_images (GtkWidget *do_widget)
       vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 8);
       gtk_box_append (GTK_BOX (hbox), vbox);
 
-      label = gtk_label_new (NULL);
-      gtk_label_set_markup (GTK_LABEL (label),
-                            "<u>Image loaded from a file</u>");
+      label = gtk_label_new ("Image from a resource");
+      gtk_widget_add_css_class (label, "heading");
       gtk_box_append (GTK_BOX (vbox), label);
 
       frame = gtk_frame_new (NULL);
@@ -355,7 +356,7 @@ do_images (GtkWidget *do_widget)
       gtk_widget_set_valign (frame, GTK_ALIGN_CENTER);
       gtk_box_append (GTK_BOX (vbox), frame);
 
-      image = gtk_image_new_from_icon_name ("gtk3-demo");
+      image = gtk_image_new_from_resource ("/images/org.gtk.Demo4.svg");
       gtk_image_set_icon_size (GTK_IMAGE (image), GTK_ICON_SIZE_LARGE);
 
       gtk_frame_set_child (GTK_FRAME (frame), image);
@@ -363,9 +364,8 @@ do_images (GtkWidget *do_widget)
 
       /* Animation */
 
-      label = gtk_label_new (NULL);
-      gtk_label_set_markup (GTK_LABEL (label),
-                            "<u>Animation loaded from a file</u>");
+      label = gtk_label_new ("Animation from a resource");
+      gtk_widget_add_css_class (label, "heading");
       gtk_box_append (GTK_BOX (vbox), label);
 
       frame = gtk_frame_new (NULL);
@@ -373,15 +373,16 @@ do_images (GtkWidget *do_widget)
       gtk_widget_set_valign (frame, GTK_ALIGN_CENTER);
       gtk_box_append (GTK_BOX (vbox), frame);
 
-      picture = gtk_picture_new_for_resource ("/images/floppybuddy.gif");
+      paintable = pixbuf_paintable_new_from_resource ("/images/floppybuddy.gif");
+      picture = gtk_picture_new_for_paintable (paintable);
+      g_object_unref (paintable);
 
       gtk_frame_set_child (GTK_FRAME (frame), picture);
 
       /* Symbolic icon */
 
-      label = gtk_label_new (NULL);
-      gtk_label_set_markup (GTK_LABEL (label),
-                            "<u>Symbolic themed icon</u>");
+      label = gtk_label_new ("Symbolic themed icon");
+      gtk_widget_add_css_class (label, "heading");
       gtk_box_append (GTK_BOX (vbox), label);
 
       frame = gtk_frame_new (NULL);
@@ -400,9 +401,8 @@ do_images (GtkWidget *do_widget)
       vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 8);
       gtk_box_append (GTK_BOX (hbox), vbox);
 
-      label = gtk_label_new (NULL);
-      gtk_label_set_markup (GTK_LABEL (label),
-                            "<u>Progressive image loading</u>");
+      label = gtk_label_new ("Progressive image loading");
+      gtk_widget_add_css_class (label, "heading");
       gtk_box_append (GTK_BOX (vbox), label);
 
       frame = gtk_frame_new (NULL);
@@ -414,6 +414,7 @@ do_images (GtkWidget *do_widget)
        * will create the pixbuf and fill it in.
        */
       picture = gtk_picture_new ();
+      gtk_picture_set_alternative_text (GTK_PICTURE (picture), "A slowly loading image");
       gtk_frame_set_child (GTK_FRAME (frame), picture);
 
       start_progressive_loading (picture);
@@ -422,9 +423,8 @@ do_images (GtkWidget *do_widget)
       vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 8);
       gtk_box_append (GTK_BOX (hbox), vbox);
 
-      label = gtk_label_new (NULL);
-      gtk_label_set_markup (GTK_LABEL (label),
-                            "<u>Displaying video</u>");
+      label = gtk_label_new ("Displaying video");
+      gtk_widget_add_css_class (label, "heading");
       gtk_box_append (GTK_BOX (vbox), label);
 
       frame = gtk_frame_new (NULL);
@@ -440,9 +440,8 @@ do_images (GtkWidget *do_widget)
       vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 8);
       gtk_box_append (GTK_BOX (hbox), vbox);
 
-      label = gtk_label_new (NULL);
-      gtk_label_set_markup (GTK_LABEL (label),
-                            "<u>GtkWidgetPaintable</u>");
+      label = gtk_label_new ("GtkWidgetPaintable");
+      gtk_widget_add_css_class (label, "heading");
       gtk_box_append (GTK_BOX (vbox), label);
 
       paintable = gtk_widget_paintable_new (do_widget);

demos/gtk-demo/layoutmanager.c

@@ -34,7 +34,7 @@ do_layoutmanager (GtkWidget *parent)
       int i;
 
       window = gtk_window_new ();
-      gtk_window_set_title (GTK_WINDOW (window), "Layout Manager—Transition");
+      gtk_window_set_title (GTK_WINDOW (window), "Layout Manager — Transition");
       gtk_window_set_default_size (GTK_WINDOW (window), 600, 600);
       g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
 

demos/gtk-demo/layoutmanager2.c

@@ -170,7 +170,7 @@ do_layoutmanager2 (GtkWidget *parent)
       int i;
 
       window = gtk_window_new ();
-      gtk_window_set_title (GTK_WINDOW (window), "Layout Manager—Transformation");
+      gtk_window_set_title (GTK_WINDOW (window), "Layout Manager — Transformation");
       gtk_window_set_default_size (GTK_WINDOW (window), 600, 620);
       g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
 

demos/gtk-demo/listbox.c

@@ -1,4 +1,4 @@
-/* List Box/Complex list
+/* List Box/Complex
  *
  * GtkListBox allows lists with complicated layouts, using
  * regular widgets supporting sorting and filtering.
@@ -197,7 +197,7 @@ gtk_message_row_update (GtkMessageRow *row)
 
   if (strcmp (priv->message->sender_nick, "@GTKtoolkit") == 0)
     {
-      gtk_image_set_from_icon_name (priv->avatar_image, "gtk3-demo");
+      gtk_image_set_from_icon_name (priv->avatar_image, "org.gtk.Demo4");
       gtk_image_set_icon_size (priv->avatar_image, GTK_ICON_SIZE_LARGE);
     }
   else
@@ -349,7 +349,7 @@ do_listbox (GtkWidget *do_widget)
       window = gtk_window_new ();
       gtk_window_set_display (GTK_WINDOW (window),
                               gtk_widget_get_display (do_widget));
-      gtk_window_set_title (GTK_WINDOW (window), "List Box");
+      gtk_window_set_title (GTK_WINDOW (window), "List Box — Complex");
       gtk_window_set_default_size (GTK_WINDOW (window), 400, 600);
       g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
 

demos/gtk-demo/listview_ucd.c

@@ -80,7 +80,7 @@ ucd_model_new (void)
   iter = g_variant_iter_new (v);
 
   store = g_list_store_new (G_TYPE_OBJECT);
-  while (g_variant_iter_next (iter, "(us)", &u, &name))
+  while (g_variant_iter_next (iter, "(u&s)", &u, &name))
     {
       if (u == 0)
         continue;
@@ -259,7 +259,7 @@ selection_changed (GObject    *object,
   gtk_label_set_label (GTK_LABEL (label), buffer);
 }
 
-static GtkWidget *
+GtkWidget *
 create_ucd_view (GtkWidget *label)
 {
   GtkWidget *cv;
@@ -273,7 +273,8 @@ create_ucd_view (GtkWidget *label)
   selection = gtk_single_selection_new (ucd_model);
   gtk_single_selection_set_autoselect (selection, TRUE);
   gtk_single_selection_set_can_unselect (selection, FALSE);
-  g_signal_connect (selection, "notify::selected", G_CALLBACK (selection_changed), label);
+  if (label)
+    g_signal_connect (selection, "notify::selected", G_CALLBACK (selection_changed), label);
 
   cv = gtk_column_view_new (GTK_SELECTION_MODEL (selection));
   gtk_column_view_set_show_column_separators (GTK_COLUMN_VIEW (cv), TRUE);
@@ -283,12 +284,14 @@ create_ucd_view (GtkWidget *label)
   g_signal_connect (factory, "bind", G_CALLBACK (bind_codepoint), NULL);
   column = gtk_column_view_column_new ("Codepoint", factory);
   gtk_column_view_append_column (GTK_COLUMN_VIEW (cv), column);
+  g_object_unref (column);
 
   factory = gtk_signal_list_item_factory_new ();
   g_signal_connect (factory, "setup", G_CALLBACK (setup_centered_label), NULL);
   g_signal_connect (factory, "bind", G_CALLBACK (bind_char), NULL);
   column = gtk_column_view_column_new ("Char", factory);
   gtk_column_view_append_column (GTK_COLUMN_VIEW (cv), column);
+  g_object_unref (column);
 
   factory = gtk_signal_list_item_factory_new ();
   g_signal_connect (factory, "setup", G_CALLBACK (setup_ellipsizing_label), NULL);
@@ -296,6 +299,7 @@ create_ucd_view (GtkWidget *label)
   column = gtk_column_view_column_new ("Name", factory);
   gtk_column_view_column_set_resizable (column, TRUE);
   gtk_column_view_append_column (GTK_COLUMN_VIEW (cv), column);
+  g_object_unref (column);
 
   factory = gtk_signal_list_item_factory_new ();
   g_signal_connect (factory, "setup", G_CALLBACK (setup_ellipsizing_label), NULL);
@@ -303,6 +307,7 @@ create_ucd_view (GtkWidget *label)
   column = gtk_column_view_column_new ("Type", factory);
   gtk_column_view_column_set_resizable (column, TRUE);
   gtk_column_view_append_column (GTK_COLUMN_VIEW (cv), column);
+  g_object_unref (column);
 
   factory = gtk_signal_list_item_factory_new ();
   g_signal_connect (factory, "setup", G_CALLBACK (setup_ellipsizing_label), NULL);
@@ -310,6 +315,7 @@ create_ucd_view (GtkWidget *label)
   column = gtk_column_view_column_new ("Break Type", factory);
   gtk_column_view_column_set_resizable (column, TRUE);
   gtk_column_view_append_column (GTK_COLUMN_VIEW (cv), column);
+  g_object_unref (column);
 
   factory = gtk_signal_list_item_factory_new ();
   g_signal_connect (factory, "setup", G_CALLBACK (setup_label), NULL);
@@ -317,6 +323,7 @@ create_ucd_view (GtkWidget *label)
   column = gtk_column_view_column_new ("Combining Class", factory);
   gtk_column_view_column_set_resizable (column, TRUE);
   gtk_column_view_append_column (GTK_COLUMN_VIEW (cv), column);
+  g_object_unref (column);
 
   factory = gtk_signal_list_item_factory_new ();
   g_signal_connect (factory, "setup", G_CALLBACK (setup_label), NULL);
@@ -324,6 +331,7 @@ create_ucd_view (GtkWidget *label)
   column = gtk_column_view_column_new ("Script", factory);
   gtk_column_view_column_set_resizable (column, TRUE);
   gtk_column_view_append_column (GTK_COLUMN_VIEW (cv), column);
+  g_object_unref (column);
 
   return cv;
 }

demos/gtk-demo/main.c

@@ -337,8 +337,8 @@ display_text (const char  *format,
 
   bytes = g_resources_lookup_data (resource, 0, NULL);
   g_assert (bytes);
-
-  g_assert (g_utf8_validate (g_bytes_get_data (bytes, NULL), g_bytes_get_size (bytes), NULL));
+  text = g_bytes_get_data (bytes, &len);
+  g_assert (g_utf8_validate (text, len, NULL));
 
   textview = gtk_text_view_new ();
   gtk_text_view_set_left_margin (GTK_TEXT_VIEW (textview), 20);
@@ -354,9 +354,8 @@ display_text (const char  *format,
   gtk_text_view_set_monospace (GTK_TEXT_VIEW (textview), TRUE);
 
   buffer = gtk_text_buffer_new (NULL);
-
-  text = g_bytes_unref_to_data (bytes, &len);
   gtk_text_buffer_set_text (buffer, text, len);
+  g_bytes_unref (bytes);
 
   if (format)
     fontify (format, buffer);

demos/gtk-demo/main.ui

@@ -28,14 +28,7 @@
           <object class="GtkButton">
             <property name="valign">center</property>
             <property name="action-name">win.run</property>
-            <style>
-              <class name="text-button"/>
-            </style>
-            <child>
-              <object class="GtkLabel">
-                <property name="label" translatable="yes">Run</property>
-              </object>
-            </child>
+            <property name="label" translatable="yes">Run</property>
           </object>
         </child>
         <child type="end">
@@ -43,6 +36,9 @@
             <property name="valign">center</property>
             <property name="menu-model">gear_menu</property>
             <property name="icon-name">open-menu-symbolic</property>
+            <accessibility>
+              <property name="label" translatable="yes">Primary menu</property>
+            </accessibility>
           </object>
         </child>
       </object>
@@ -63,7 +59,11 @@
                   <object class="GtkSearchBar" id="searchbar">
                     <property name="key-capture-widget">window</property>
                     <child>
-                      <object class="GtkSearchEntry" id="search-entry"/>
+                      <object class="GtkSearchEntry" id="search-entry">
+                        <accessibility>
+                          <relation name="controls">listview</relation>
+                        </accessibility>
+                      </object>
                     </child>
                   </object>
                 </child>
@@ -78,6 +78,10 @@
                         <property name="resource">/ui/main-listitem.ui</property>
                       </object>
                     </property>
+                    <accessibility>
+                      <property name="label" translatable="yes">Demo list</property>
+                      <relation name="controls">notebook</relation>
+                    </accessibility>
                   </object>
                 </child>
 
@@ -112,6 +116,10 @@
                         <property name="editable">0</property>
                         <property name="wrap-mode">word</property>
                         <property name="cursor-visible">0</property>
+                        <accessibility>
+                          <property name="label" translatable="yes">Info</property>
+                          <property name="description" translatable="yes">A description of the demo</property>
+                        </accessibility>
                       </object>
                     </child>
                   </object>
@@ -142,6 +150,10 @@
                         <property name="wrap-mode">word</property>
                         <property name="pixels-above-lines">2</property>
                         <property name="pixels-below-lines">2</property>
+                        <accessibility>
+                          <property name="label" translatable="yes">Source</property>
+                          <property name="description" translatable="yes">The source code of the demo</property>
+                        </accessibility>
                       </object>
                     </child>
                   </object>

demos/gtk-demo/meson.build

@@ -9,6 +9,7 @@ demos = files([
   'constraints.c',
   'constraints2.c',
   'constraints3.c',
+  'constraints4.c',
   'css_accordion.c',
   'css_basics.c',
   'css_blendmodes.c',
@@ -18,7 +19,6 @@ demos = files([
   'cursors.c',
   'dialog.c',
   'drawingarea.c',
-  'dropdown.c',
   'dnd.c',
   'editable_cells.c',
   'entry_completion.c',
@@ -53,7 +53,9 @@ demos = files([
   'listview_colors.c',
   'listview_filebrowser.c',
   'listview_minesweeper.c',
+  'dropdown.c',
   'listview_settings.c',
+  'listview_ucd.c',
   'listview_weather.c',
   'listview_words.c',
   'markup.c',
@@ -118,11 +120,15 @@ extra_demo_sources = files(['main.c',
                             'singular_value_decomposition.c',
                             'four_point_transform.c',
                             'demo2widget.c',
-                            'demo3widget.c'])
+                            'demo3widget.c',
+                            'pixbufpaintable.c',
+                            'script-names.c',
+                            'unicode-names.c',
+                            'suggestionentry.c'])
 
 if harfbuzz_dep.found() and pangoft_dep.found()
-  demos += files(['font_features.c', 'listview_ucd.c'])
-  extra_demo_sources += files(['script-names.c', 'language-names.c', 'unicode-names.c'])
+  demos += files(['font_features.c'])
+  extra_demo_sources += files(['language-names.c'])
   gtkdemo_deps += [ harfbuzz_dep, epoxy_dep ]
 endif
 
@@ -134,6 +140,7 @@ librsvg_dep = dependency('librsvg-2.0', version: '>= 2.46.0', required: false)
 
 if librsvg_dep.found()
   demos += files('paintable_svg.c')
+  extra_demo_sources += files(['svgpaintable.c'])
   gtkdemo_deps += [ librsvg_dep ]
 endif
 

demos/gtk-demo/paintable.c

@@ -1,4 +1,4 @@
-/* Paintable/A simple paintable
+/* Paintable/Simple Paintable
  *
  * GdkPaintable is an interface used by GTK for drawings of any sort
  * that do not require layouting or positioning.

demos/gtk-demo/paintable_animated.c

@@ -1,4 +1,4 @@
-/* Paintable/An animated paintable
+/* Paintable/Animated Paintable
  *
  * GdkPaintable also allows paintables to change.
  *

demos/gtk-demo/paintable_emblem.c

@@ -153,7 +153,7 @@ do_paintable_emblem (GtkWidget *do_widget)
       window = gtk_window_new ();
       gtk_window_set_display (GTK_WINDOW (window),
                               gtk_widget_get_display (do_widget));
-      gtk_window_set_title (GTK_WINDOW (window), "Emblems");
+      gtk_window_set_title (GTK_WINDOW (window), "Paintable — Emblems");
       gtk_window_set_default_size (GTK_WINDOW (window), 300, 200);
       g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
 

demos/gtk-demo/paintable_mediastream.c

@@ -1,4 +1,4 @@
-/* Paintable/A media stream
+/* Paintable/Media Stream
  *
  * GdkPaintable is also used by the GtkMediaStream class.
  *

demos/gtk-demo/paintable_svg.c

@@ -9,183 +9,20 @@
 #include <gtk/gtk.h>
 #include <librsvg/rsvg.h>
 
-#define SVG_TYPE_PAINTABLE (svg_paintable_get_type ())
+#include "svgpaintable.h"
 
-G_DECLARE_FINAL_TYPE (SvgPaintable, svg_paintable, SVG, PAINTABLE, GObject)
-
-struct _SvgPaintable
-{
-  GObject parent_instance;
-  GFile *file;
-  RsvgHandle *handle;
-};
-
-struct _SvgPaintableClass
-{
-  GObjectClass parent_class;
-};
-
-enum {
-  PROP_FILE = 1,
-  NUM_PROPERTIES
-};
-
-static void
-svg_paintable_snapshot (GdkPaintable *paintable,
-                        GdkSnapshot  *snapshot,
-                        double        width,
-                        double        height)
-{
-  SvgPaintable *self = SVG_PAINTABLE (paintable);
-  cairo_t *cr;
-  GError *error = NULL;
-
-  cr = gtk_snapshot_append_cairo (GTK_SNAPSHOT (snapshot),
-                                  &GRAPHENE_RECT_INIT (0, 0, width, height));
-
-  if (!rsvg_handle_render_document (self->handle, cr,
-                                    &(RsvgRectangle) {0, 0, width, height},
-                                    &error))
-    {
-      g_error ("%s", error->message);
-    }
-
-  cairo_destroy (cr);
-}
-
-static int
-svg_paintable_get_intrinsic_width (GdkPaintable *paintable)
-{
-  SvgPaintable *self = SVG_PAINTABLE (paintable);
-  RsvgDimensionData data;
-
-  rsvg_handle_get_dimensions (self->handle, &data);
-
-  return data.width;
-}
-
-static int
-svg_paintable_get_intrinsic_height (GdkPaintable *paintable)
-{
-  SvgPaintable *self = SVG_PAINTABLE (paintable);
-  RsvgDimensionData data;
-
-  rsvg_handle_get_dimensions (self->handle, &data);
-
-  return data.height;
-}
-
-static void
-svg_paintable_init_interface (GdkPaintableInterface *iface)
-{
-  iface->snapshot = svg_paintable_snapshot;
-  iface->get_intrinsic_width = svg_paintable_get_intrinsic_width;
-  iface->get_intrinsic_height = svg_paintable_get_intrinsic_height;
-}
-
-G_DEFINE_TYPE_WITH_CODE (SvgPaintable, svg_paintable, G_TYPE_OBJECT,
-                         G_IMPLEMENT_INTERFACE (GDK_TYPE_PAINTABLE,
-                                                svg_paintable_init_interface))
-
-static void
-svg_paintable_init (SvgPaintable *self)
-{
-}
-
-static void
-svg_paintable_dispose (GObject *object)
-{
-  SvgPaintable *self = SVG_PAINTABLE (object);
-
-  g_clear_object (&self->file);
-  g_clear_object (&self->handle);
-
-  G_OBJECT_CLASS (svg_paintable_parent_class)->dispose (object);
-}
-
-static void
-svg_paintable_set_property (GObject      *object,
-                            guint         prop_id,
-                            const GValue *value,
-                            GParamSpec   *pspec)
-{
-  SvgPaintable *self = SVG_PAINTABLE (object);
-
-  switch (prop_id)
-    {
-    case PROP_FILE:
-      {
-        GFile *file = g_value_get_object (value);
-        RsvgHandle *handle = rsvg_handle_new_from_gfile_sync (file,
-                                                              RSVG_HANDLE_FLAGS_NONE,
-                                                              NULL,
-                                                              NULL);
-        rsvg_handle_set_dpi (handle, 90);
-
-        g_set_object (&self->file, file);
-        g_set_object (&self->handle, handle);
-      }
-      break;
-
-    default:
-      G_OBJECT_WARN_INVALID_PROPERTY_ID (object, prop_id, pspec);
-    }
-}
-
-static void
-svg_paintable_get_property (GObject    *object,
-                            guint       prop_id,
-                            GValue     *value,
-                            GParamSpec *pspec)
-{
-  SvgPaintable *self = SVG_PAINTABLE (object);
-
-  switch (prop_id)
-    {
-    case PROP_FILE:
-      g_value_set_object (value, self->file);
-      break;
-
-    default:
-      G_OBJECT_WARN_INVALID_PROPERTY_ID (object, prop_id, pspec);
-    }
-}
-
-
-static void
-svg_paintable_class_init (SvgPaintableClass *class)
-{
-  GObjectClass *object_class = G_OBJECT_CLASS (class);
-
-  object_class->dispose = svg_paintable_dispose;
-  object_class->set_property = svg_paintable_set_property;
-  object_class->get_property = svg_paintable_get_property;
-
-  g_object_class_install_property (object_class, PROP_FILE,
-                                   g_param_spec_object ("file", "File", "File",
-                                                        G_TYPE_FILE,
-                                                        G_PARAM_READWRITE));
-}
-
-static SvgPaintable *
-svg_paintable_new (GFile *file)
-{
-  return g_object_new (SVG_TYPE_PAINTABLE,
-                       "file", file,
-                       NULL);
-}
 
 static void
 file_set (GtkFileChooserButton *button,
           GtkWidget            *picture)
 {
   GFile *file;
-  SvgPaintable *paintable;
+  GdkPaintable *paintable;
 
   file = gtk_file_chooser_get_file (GTK_FILE_CHOOSER (button));
 
   paintable = svg_paintable_new (file);
-  gtk_picture_set_paintable (GTK_PICTURE (picture), GDK_PAINTABLE (paintable));
+  gtk_picture_set_paintable (GTK_PICTURE (picture), paintable);
 
   g_object_unref (paintable);
   g_object_unref (file);
@@ -201,14 +38,15 @@ do_paintable_svg (GtkWidget *do_widget)
   GtkFileFilter *filter;
   GtkWidget *button;
   GFile *file;
-  SvgPaintable *paintable;
+  GdkPaintable *paintable;
 
   if (!window)
     {
       window = gtk_window_new ();
       header = gtk_header_bar_new ();
       gtk_window_set_titlebar (GTK_WINDOW (window), header);
-      gtk_window_set_default_size (GTK_WINDOW (window), 300, 200);
+      gtk_window_set_default_size (GTK_WINDOW (window), 330, 330);
+      gtk_window_set_title (GTK_WINDOW (window), "Paintable — SVG");
       g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
 
       button = gtk_file_chooser_button_new ("Select an SVG file", GTK_FILE_CHOOSER_ACTION_OPEN);
@@ -227,7 +65,7 @@ do_paintable_svg (GtkWidget *do_widget)
 
       file = g_file_new_for_uri ("resource:///paintable_svg/org.gtk.gtk4.NodeEditor.Devel.svg");
       paintable = svg_paintable_new (file);
-      gtk_picture_set_paintable (GTK_PICTURE (picture), GDK_PAINTABLE (paintable));
+      gtk_picture_set_paintable (GTK_PICTURE (picture), paintable);
       g_object_unref (paintable);
       g_object_unref (file);
     }

demos/gtk-demo/panes.c

@@ -3,100 +3,16 @@
  * The GtkPaned Widget divides its content area into two panes
  * with a divider in between that the user can adjust. A separate
  * child is placed into each pane. GtkPaned widgets can be split
- * horizontally or vertially.
+ * horizontally or vertically. This test contains both a horizontal
+ * and a vertical GtkPaned widget.
  *
  * There are a number of options that can be set for each pane.
- * This test contains both a horizontal and a vertical GtkPaned
- * widget, and allows you to adjust the options for each side of
- * each widget.
+ * You can use the Inspector to adjust the options for each side
+ * of each widget.
  */
 
 #include <gtk/gtk.h>
 
-static void
-toggle_resize (GtkWidget *widget,
-               GtkWidget *child)
-{
-  GtkWidget *parent;
-  GtkPaned *paned;
-
-  parent = gtk_widget_get_parent (child);
-  paned = GTK_PANED (parent);
-
-  if (child == gtk_paned_get_start_child (paned))
-    gtk_paned_set_resize_start_child (paned, !gtk_paned_get_resize_start_child (paned));
-  else
-    gtk_paned_set_resize_end_child (paned, !gtk_paned_get_resize_end_child (paned));
-}
-
-static void
-toggle_shrink (GtkWidget *widget,
-               GtkWidget *child)
-{
-  GtkWidget *parent;
-  GtkPaned *paned;
-
-  parent = gtk_widget_get_parent (child);
-  paned = GTK_PANED (parent);
-
-  if (child == gtk_paned_get_start_child (paned))
-    gtk_paned_set_shrink_start_child (paned, !gtk_paned_get_shrink_start_child (paned));
-  else
-    gtk_paned_set_shrink_end_child (paned, !gtk_paned_get_shrink_end_child (paned));
-}
-
-static GtkWidget *
-create_pane_options (GtkPaned    *paned,
-                     const char *frame_label,
-                     const char *label1,
-                     const char *label2)
-{
-  GtkWidget *child1, *child2;
-  GtkWidget *frame;
-  GtkWidget *table;
-  GtkWidget *label;
-  GtkWidget *check_button;
-
-  child1 = gtk_paned_get_start_child (paned);
-  child2 = gtk_paned_get_end_child (paned);
-
-  frame = gtk_frame_new (frame_label);
-
-  table = gtk_grid_new ();
-  gtk_frame_set_child (GTK_FRAME (frame), table);
-
-  label = gtk_label_new (label1);
-  gtk_grid_attach (GTK_GRID (table), label, 0, 0, 1, 1);
-
-  check_button = gtk_check_button_new_with_mnemonic ("_Resize");
-  gtk_grid_attach (GTK_GRID (table), check_button, 0, 1, 1, 1);
-  g_signal_connect (check_button, "toggled",
-                    G_CALLBACK (toggle_resize), child1);
-
-  check_button = gtk_check_button_new_with_mnemonic ("_Shrink");
-  gtk_grid_attach (GTK_GRID (table), check_button, 0, 2, 1, 1);
-  gtk_check_button_set_active (GTK_CHECK_BUTTON (check_button), TRUE);
-  g_signal_connect (check_button, "toggled",
-                    G_CALLBACK (toggle_shrink), child1);
-
-  label = gtk_label_new (label2);
-  gtk_grid_attach (GTK_GRID (table), label, 1, 0, 1, 1);
-
-  check_button = gtk_check_button_new_with_mnemonic ("_Resize");
-  gtk_grid_attach (GTK_GRID (table), check_button, 1, 1, 1, 1);
-  gtk_check_button_set_active (GTK_CHECK_BUTTON (check_button), TRUE);
-  g_signal_connect (check_button, "toggled",
-                    G_CALLBACK (toggle_resize), child2);
-
-  check_button = gtk_check_button_new_with_mnemonic ("_Shrink");
-  gtk_grid_attach (GTK_GRID (table), check_button, 1, 2, 1, 1);
-  gtk_check_button_set_active (GTK_CHECK_BUTTON (check_button), TRUE);
-  g_signal_connect (check_button, "toggled",
-                    G_CALLBACK (toggle_shrink), child2);
-
-  return frame;
-}
-
 GtkWidget *
 do_panes (GtkWidget *do_widget)
 {
@@ -104,19 +20,19 @@ do_panes (GtkWidget *do_widget)
   GtkWidget *frame;
   GtkWidget *hpaned;
   GtkWidget *vpaned;
-  GtkWidget *button;
+  GtkWidget *label;
   GtkWidget *vbox;
-  GtkWidget *box;
 
   if (!window)
     {
       window = gtk_window_new ();
+      gtk_window_set_title (GTK_WINDOW (window), "Paned Widgets");
+      gtk_window_set_default_size (GTK_WINDOW (window), 330, 250);
+      gtk_window_set_resizable (GTK_WINDOW (window), FALSE);
       gtk_window_set_display (GTK_WINDOW (window),
                               gtk_widget_get_display (do_widget));
       g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
 
-      gtk_window_set_title (GTK_WINDOW (window), "Paned Widgets");
-
       vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 8);
       gtk_widget_set_margin_start (vbox, 8);
       gtk_widget_set_margin_end (vbox, 8);
@@ -132,41 +48,37 @@ do_panes (GtkWidget *do_widget)
 
       hpaned = gtk_paned_new (GTK_ORIENTATION_HORIZONTAL);
       gtk_paned_set_start_child (GTK_PANED (vpaned), hpaned);
+      gtk_paned_set_shrink_start_child (GTK_PANED (vpaned), FALSE);
 
-      box = gtk_box_new (GTK_ORIENTATION_VERTICAL, 0);
-      gtk_widget_set_size_request (box, 60, 60);
-      gtk_paned_set_start_child (GTK_PANED (hpaned), box);
+      label = gtk_label_new ("Hi there");
+      gtk_widget_set_margin_start (label, 4);
+      gtk_widget_set_margin_end (label, 4);
+      gtk_widget_set_margin_top (label, 4);
+      gtk_widget_set_margin_bottom (label, 4);
+      gtk_widget_set_hexpand (label, TRUE);
+      gtk_widget_set_vexpand (label, TRUE);
+      gtk_paned_set_start_child (GTK_PANED (hpaned), label);
+      gtk_paned_set_shrink_start_child (GTK_PANED (hpaned), FALSE);
 
-      button = gtk_button_new_with_mnemonic ("_Hi there");
-      gtk_widget_set_margin_start (button, 4);
-      gtk_widget_set_margin_end (button, 4);
-      gtk_widget_set_margin_top (button, 4);
-      gtk_widget_set_margin_bottom (button, 4);
-      gtk_widget_set_hexpand (button, TRUE);
-      gtk_widget_set_vexpand (button, TRUE);
-      gtk_box_append (GTK_BOX (box), button);
+      label = gtk_label_new ("Hello");
+      gtk_widget_set_margin_start (label, 4);
+      gtk_widget_set_margin_end (label, 4);
+      gtk_widget_set_margin_top (label, 4);
+      gtk_widget_set_margin_bottom (label, 4);
+      gtk_widget_set_hexpand (label, TRUE);
+      gtk_widget_set_vexpand (label, TRUE);
+      gtk_paned_set_end_child (GTK_PANED (hpaned), label);
+      gtk_paned_set_shrink_end_child (GTK_PANED (hpaned), FALSE);
 
-      box = gtk_box_new (GTK_ORIENTATION_VERTICAL, 0);
-      gtk_widget_set_size_request (box, 80, 60);
-      gtk_paned_set_end_child (GTK_PANED (hpaned), box);
-
-      box = gtk_box_new (GTK_ORIENTATION_VERTICAL, 0);
-      gtk_widget_set_size_request (box, 60, 80);
-      gtk_paned_set_end_child (GTK_PANED (vpaned), box);
-
-      /* Now create toggle buttons to control sizing */
-
-      gtk_box_append (GTK_BOX (vbox),
-                          create_pane_options (GTK_PANED (hpaned),
-                                               "Horizontal",
-                                               "Left",
-                                               "Right"));
-
-      gtk_box_append (GTK_BOX (vbox),
-                          create_pane_options (GTK_PANED (vpaned),
-                                               "Vertical",
-                                               "Top",
-                                               "Bottom"));
+      label = gtk_label_new ("Goodbye");
+      gtk_widget_set_margin_start (label, 4);
+      gtk_widget_set_margin_end (label, 4);
+      gtk_widget_set_margin_top (label, 4);
+      gtk_widget_set_margin_bottom (label, 4);
+      gtk_widget_set_hexpand (label, TRUE);
+      gtk_widget_set_vexpand (label, TRUE);
+      gtk_paned_set_end_child (GTK_PANED (vpaned), label);
+      gtk_paned_set_shrink_end_child (GTK_PANED (vpaned), FALSE);
     }
 
   if (!gtk_widget_get_visible (window))

demos/gtk-demo/pixbufpaintable.c

@@ -0,0 +1,187 @@
+#include <gtk/gtk.h>
+#include "pixbufpaintable.h"
+
+struct _PixbufPaintable {
+  GObject parent_instance;
+
+  char *resource_path;
+  GdkPixbufAnimation *anim;
+  GdkPixbufAnimationIter *iter;
+
+  guint timeout;
+};
+
+enum {
+  PROP_RESOURCE_PATH = 1,
+  NUM_PROPERTIES
+};
+
+G_GNUC_BEGIN_IGNORE_DEPRECATIONS;
+static void
+pixbuf_paintable_snapshot (GdkPaintable *paintable,
+                           GdkSnapshot  *snapshot,
+                           double        width,
+                           double        height)
+{
+  PixbufPaintable *self = PIXBUF_PAINTABLE (paintable);
+  GTimeVal val;
+  GdkPixbuf *pixbuf;
+  GdkTexture *texture;
+
+  g_get_current_time (&val);
+  gdk_pixbuf_animation_iter_advance (self->iter, &val);
+  pixbuf = gdk_pixbuf_animation_iter_get_pixbuf (self->iter);
+  texture = gdk_texture_new_for_pixbuf (pixbuf);
+
+  gdk_paintable_snapshot (GDK_PAINTABLE (texture), snapshot, width, height);
+
+  g_object_unref (texture);
+}
+G_GNUC_END_IGNORE_DEPRECATIONS;
+
+static int
+pixbuf_paintable_get_intrinsic_width (GdkPaintable *paintable)
+{
+  PixbufPaintable *self = PIXBUF_PAINTABLE (paintable);
+
+  return gdk_pixbuf_animation_get_width (self->anim);
+}
+
+static int
+pixbuf_paintable_get_intrinsic_height (GdkPaintable *paintable)
+{
+  PixbufPaintable *self = PIXBUF_PAINTABLE (paintable);
+
+  return gdk_pixbuf_animation_get_height (self->anim);
+}
+
+static void
+pixbuf_paintable_init_interface (GdkPaintableInterface *iface)
+{
+  iface->snapshot = pixbuf_paintable_snapshot;
+  iface->get_intrinsic_width = pixbuf_paintable_get_intrinsic_width;
+  iface->get_intrinsic_height = pixbuf_paintable_get_intrinsic_height;
+}
+
+G_DEFINE_TYPE_WITH_CODE(PixbufPaintable, pixbuf_paintable, G_TYPE_OBJECT,
+                        G_IMPLEMENT_INTERFACE (GDK_TYPE_PAINTABLE,
+                                               pixbuf_paintable_init_interface))
+
+static void
+pixbuf_paintable_init (PixbufPaintable *paintable)
+{
+}
+
+static gboolean
+delay_cb (gpointer data)
+{
+  PixbufPaintable *self = data;
+  int delay;
+
+  delay = gdk_pixbuf_animation_iter_get_delay_time (self->iter);
+  self->timeout = g_timeout_add (delay, delay_cb, self);
+
+  gdk_paintable_invalidate_contents (GDK_PAINTABLE (self));
+
+  return G_SOURCE_REMOVE;
+}
+
+static void
+pixbuf_paintable_set_resource_path (PixbufPaintable *self,
+                                    const char      *resource_path)
+{
+  int delay;
+
+  g_free (self->resource_path);
+  self->resource_path = g_strdup (resource_path);
+
+  g_clear_object (&self->anim);
+  self->anim = gdk_pixbuf_animation_new_from_resource (resource_path, NULL);
+  g_clear_object (&self->iter);
+  self->iter = gdk_pixbuf_animation_get_iter (self->anim, NULL);
+
+  delay = gdk_pixbuf_animation_iter_get_delay_time (self->iter);
+  self->timeout = g_timeout_add (delay, delay_cb, self);
+
+  gdk_paintable_invalidate_contents (GDK_PAINTABLE (self));
+
+  g_object_notify (G_OBJECT (self), "resource-path");
+}
+
+static void
+pixbuf_paintable_set_property (GObject      *object,
+                               guint         prop_id,
+                               const GValue *value,
+                               GParamSpec   *pspec)
+{
+  PixbufPaintable *self = PIXBUF_PAINTABLE (object);
+
+  switch (prop_id)
+    {
+    case PROP_RESOURCE_PATH:
+      pixbuf_paintable_set_resource_path (self, g_value_get_string (value));
+      break;
+
+    default:
+      G_OBJECT_WARN_INVALID_PROPERTY_ID (object, prop_id, pspec);
+    }
+}
+
+static void
+pixbuf_paintable_get_property (GObject    *object,
+                               guint       prop_id,
+                               GValue     *value,
+                               GParamSpec *pspec)
+{
+  PixbufPaintable *self = PIXBUF_PAINTABLE (object);
+
+  switch (prop_id)
+    {
+    case PROP_RESOURCE_PATH:
+      g_value_set_string (value, self->resource_path);
+      break;
+
+    default:
+      G_OBJECT_WARN_INVALID_PROPERTY_ID (object, prop_id, pspec);
+    }
+}
+
+static void
+pixbuf_paintable_dispose (GObject *object)
+{
+  PixbufPaintable *self = PIXBUF_PAINTABLE (object);
+
+  g_clear_pointer (&self->resource_path, g_free);
+  g_clear_object (&self->anim);
+  g_clear_object (&self->iter);
+  if (self->timeout)
+    {
+      g_source_remove (self->timeout);
+      self->timeout = 0;
+    }
+
+  G_OBJECT_CLASS (pixbuf_paintable_parent_class)->dispose (object);
+}
+
+static void
+pixbuf_paintable_class_init (PixbufPaintableClass *class)
+{
+  GObjectClass *object_class = G_OBJECT_CLASS (class);
+
+  object_class->dispose = pixbuf_paintable_dispose;
+  object_class->get_property = pixbuf_paintable_get_property;
+  object_class->set_property = pixbuf_paintable_set_property;
+
+  g_object_class_install_property (object_class, PROP_RESOURCE_PATH,
+      g_param_spec_string ("resource-path", "Resource path", "Resource path",
+                           NULL, G_PARAM_READWRITE));
+
+}
+
+GdkPaintable *
+pixbuf_paintable_new_from_resource (const char *path)
+{
+  return g_object_new (PIXBUF_TYPE_PAINTABLE,
+                       "resource-path", path,
+                       NULL);
+}

demos/gtk-demo/pixbufpaintable.h

@@ -0,0 +1,13 @@
+#pragma once
+
+#include <gtk/gtk.h>
+
+G_BEGIN_DECLS
+
+#define PIXBUF_TYPE_PAINTABLE (pixbuf_paintable_get_type ())
+
+G_DECLARE_FINAL_TYPE(PixbufPaintable, pixbuf_paintable, PIXBUF, PAINTABLE, GObject)
+
+GdkPaintable * pixbuf_paintable_new_from_resource (const char *path);
+
+G_END_DECLS

demos/gtk-demo/search_entry.c

@@ -110,17 +110,17 @@ set_search_by (GSimpleAction *action,
   if (g_str_equal (term, "name"))
     {
       gtk_entry_set_icon_tooltip_text (entry, GTK_ENTRY_ICON_PRIMARY, "Search by name");
-      gtk_entry_set_placeholder_text (entry, "name");
+      gtk_entry_set_placeholder_text (entry, "Name…");
     }
   else if (g_str_equal (term, "description"))
     {
       gtk_entry_set_icon_tooltip_text (entry, GTK_ENTRY_ICON_PRIMARY, "Search by description");
-      gtk_entry_set_placeholder_text (entry, "description");
+      gtk_entry_set_placeholder_text (entry, "Description…");
     }
   else if (g_str_equal (term, "filename"))
     {
       gtk_entry_set_icon_tooltip_text (entry, GTK_ENTRY_ICON_PRIMARY, "Search by file name");
-      gtk_entry_set_placeholder_text (entry, "file name");
+      gtk_entry_set_placeholder_text (entry, "File name…");
     }
 }
 
@@ -254,7 +254,6 @@ do_search_entry (GtkWidget *do_widget)
 {
   GtkWidget *vbox;
   GtkWidget *hbox;
-  GtkWidget *label;
   GtkWidget *entry;
   GtkWidget *find_button;
   GtkWidget *cancel_button;
@@ -268,18 +267,14 @@ do_search_entry (GtkWidget *do_widget)
 
       g_object_weak_ref (G_OBJECT (window), search_entry_destroyed, &window);
 
-      vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 5);
-      gtk_widget_set_margin_start (vbox, 5);
-      gtk_widget_set_margin_end (vbox, 5);
-      gtk_widget_set_margin_top (vbox, 5);
-      gtk_widget_set_margin_bottom (vbox, 5);
+      vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 12);
+      gtk_widget_set_margin_start (vbox, 18);
+      gtk_widget_set_margin_end (vbox, 18);
+      gtk_widget_set_margin_top (vbox, 18);
+      gtk_widget_set_margin_bottom (vbox, 18);
       gtk_window_set_child (GTK_WINDOW (window), vbox);
 
-      label = gtk_label_new (NULL);
-      gtk_label_set_markup (GTK_LABEL (label), "Search entry demo");
-      gtk_box_append (GTK_BOX (vbox), label);
-
-      hbox = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 10);
+      hbox = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 12);
       gtk_box_append (GTK_BOX (vbox), hbox);
 
       /* Create our entry */

demos/gtk-demo/search_entry2.c

@@ -1,10 +1,10 @@
-/* Entry/Delayed Search Entry
+/* Entry/Type to Search
  *
  * GtkSearchEntry provides an entry that is ready for search.
  *
- * Search entries have their "changed" signal delayed and should
- * be used when the searched operation is slow such as loads of
- * entries to search, or online searches.
+ * Search entries have their "search-changed" signal delayed and
+ * should be used when the search operation is slow, such as big
+ * datasets to search, or online searches.
  *
  * GtkSearchBar allows have a hidden search entry that 'springs
  * into action' upon keyboard input.
@@ -18,101 +18,69 @@ search_changed_cb (GtkSearchEntry *entry,
 {
   const char *text;
   text = gtk_editable_get_text (GTK_EDITABLE (entry));
-  g_message ("search changed: %s", text);
   gtk_label_set_text (result_label, text ? text : "");
 }
 
-static void
-changed_cb (GtkEditable *editable)
-{
-  const char *text;
-  text = gtk_editable_get_text (GTK_EDITABLE (editable));
-  g_message ("changed: %s", text);
-}
-
-static void
-search_changed (GtkSearchEntry *entry,
-                GtkLabel       *label)
-{
-  gtk_label_set_text (label, "search-changed");
-}
-
-static void
-next_match (GtkSearchEntry *entry,
-            GtkLabel       *label)
-{
-  gtk_label_set_text (label, "next-match");
-}
-
-static void
-previous_match (GtkSearchEntry *entry,
-                GtkLabel       *label)
-{
-  gtk_label_set_text (label, "previous-match");
-}
-
-static void
-stop_search (GtkSearchEntry *entry,
-             GtkLabel       *label)
-{
-  gtk_label_set_text (label, "stop-search");
-}
-
 GtkWidget *
 do_search_entry2 (GtkWidget *do_widget)
 {
   static GtkWidget *window = NULL;
   GtkWidget *vbox;
   GtkWidget *hbox;
+  GtkWidget *box;
   GtkWidget *label;
   GtkWidget *entry;
-  GtkWidget *container;
   GtkWidget *searchbar;
   GtkWidget *button;
+  GtkWidget *header;
 
   if (!window)
     {
       window = gtk_window_new ();
-      gtk_window_set_title (GTK_WINDOW (window), "Delayed Search Entry");
+      gtk_window_set_title (GTK_WINDOW (window), "Type to Search");
       gtk_window_set_transient_for (GTK_WINDOW (window), GTK_WINDOW (do_widget));
-      gtk_window_set_resizable (GTK_WINDOW (window), TRUE);
+      gtk_window_set_resizable (GTK_WINDOW (window), FALSE);
       gtk_widget_set_size_request (window, 200, -1);
       g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
 
+      header = gtk_header_bar_new ();
+      gtk_window_set_titlebar (GTK_WINDOW (window), header);
+
       vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 0);
       gtk_window_set_child (GTK_WINDOW (window), vbox);
 
       entry = gtk_search_entry_new ();
-      container = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 10);
-      gtk_widget_set_halign (container, GTK_ALIGN_CENTER);
-      gtk_box_append (GTK_BOX (container), entry);
+      gtk_widget_set_halign (entry, GTK_ALIGN_CENTER);
       searchbar = gtk_search_bar_new ();
       gtk_search_bar_connect_entry (GTK_SEARCH_BAR (searchbar), GTK_EDITABLE (entry));
       gtk_search_bar_set_show_close_button (GTK_SEARCH_BAR (searchbar), FALSE);
-      gtk_search_bar_set_child (GTK_SEARCH_BAR (searchbar), container);
+      gtk_search_bar_set_child (GTK_SEARCH_BAR (searchbar), entry);
       gtk_box_append (GTK_BOX (vbox), searchbar);
 
       /* Hook the search bar to key presses */
       gtk_search_bar_set_key_capture_widget (GTK_SEARCH_BAR (searchbar), window);
 
-      /* Help */
-      label = gtk_label_new ("Start Typing to search");
-      gtk_box_append (GTK_BOX (vbox), label);
+      box = gtk_box_new (GTK_ORIENTATION_VERTICAL, 18);
+      gtk_widget_set_margin_start (box, 18);
+      gtk_widget_set_margin_end (box, 18);
+      gtk_widget_set_margin_top (box, 18);
+      gtk_widget_set_margin_bottom (box, 18);
+      gtk_box_append (GTK_BOX (vbox), box);
 
       /* Toggle button */
-      button = gtk_toggle_button_new_with_label ("Search");
+      button = gtk_toggle_button_new ();
+      gtk_button_set_icon_name (GTK_BUTTON (button), "system-search-symbolic");
       g_object_bind_property (button, "active",
                               searchbar, "search-mode-enabled",
                               G_BINDING_BIDIRECTIONAL);
-      gtk_box_append (GTK_BOX (vbox), button);
+      gtk_header_bar_pack_end (GTK_HEADER_BAR (header), button);
 
       /* Result */
       hbox = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 10);
-      gtk_box_append (GTK_BOX (vbox), hbox);
+      gtk_box_append (GTK_BOX (box), hbox);
 
-      label = gtk_label_new ("Result:");
+      label = gtk_label_new ("Searching for:");
       gtk_label_set_xalign (GTK_LABEL (label), 0.0);
-      gtk_widget_set_margin_start (label, 6);
       gtk_box_append (GTK_BOX (hbox), label);
 
       label = gtk_label_new ("");
@@ -120,28 +88,6 @@ do_search_entry2 (GtkWidget *do_widget)
 
       g_signal_connect (entry, "search-changed",
                         G_CALLBACK (search_changed_cb), label);
-      g_signal_connect (entry, "changed",
-                        G_CALLBACK (changed_cb), label);
-
-      hbox = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 10);
-      gtk_box_append (GTK_BOX (vbox), hbox);
-
-      label = gtk_label_new ("Signal:");
-      gtk_label_set_xalign (GTK_LABEL (label), 0.0);
-      gtk_widget_set_margin_start (label, 6);
-      gtk_box_append (GTK_BOX (hbox), label);
-
-      label = gtk_label_new ("");
-      gtk_box_append (GTK_BOX (hbox), label);
-
-      g_signal_connect (entry, "search-changed",
-                        G_CALLBACK (search_changed), label);
-      g_signal_connect (entry, "next-match",
-                        G_CALLBACK (next_match), label);
-      g_signal_connect (entry, "previous-match",
-                        G_CALLBACK (previous_match), label);
-      g_signal_connect (entry, "stop-search",
-                        G_CALLBACK (stop_search), label);
     }
 
   if (!gtk_widget_get_visible (window))

demos/gtk-demo/shortcut_triggers.c

@@ -57,6 +57,8 @@ do_shortcut_triggers (GtkWidget *do_widget)
       gtk_window_set_display (GTK_WINDOW (window),
                               gtk_widget_get_display (do_widget));
       gtk_window_set_title (GTK_WINDOW (window), "Shortcuts");
+      gtk_window_set_default_size (GTK_WINDOW (window), 200, -1);
+      gtk_window_set_resizable (GTK_WINDOW (window), FALSE);
       g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);
 
       list = gtk_list_box_new ();

demos/gtk-demo/shortcuts.ui

@@ -8,7 +8,7 @@
         <property name="margin-start">50</property>
         <property name="margin-end">50</property>
         <property name="margin-top">50</property>
-        <property name="margin-end">50</property>
+        <property name="margin-bottom">50</property>
         <property name="spacing">10</property>
         <child>
           <object class="GtkButton">

demos/gtk-demo/suggestionentry.css

@@ -0,0 +1,28 @@
+entry.suggestion > popover.menu.background > contents {
+  padding: 0;
+}
+
+entry.suggestion arrow {
+  -gtk-icon-source: -gtk-icontheme('pan-down-symbolic');
+  min-height: 16px;
+  min-width: 16px;
+}
+
+entry.suggestion > popover {
+  margin-top: 6px;
+  padding: 0;
+}
+
+entry.suggestion > popover listview {
+  margin: 8px 0;
+}
+
+entry.suggestion > popover listview > row {
+  padding: 8px;
+}
+
+entry.suggestion > popover listview > row:selected {
+  outline-color: rgba(1,1,1,0.2);
+  color: @theme_text_color;
+  background-color: shade(#f6f5f4, 0.97);
+}

demos/gtk-demo/suggestionentry.h

@@ -0,0 +1,66 @@
+#pragma once
+
+#include <gtk/gtk.h>
+
+G_BEGIN_DECLS
+
+
+#define MATCH_TYPE_OBJECT                 (match_object_get_type ())
+#define MATCH_OBJECT(obj)                 (G_TYPE_CHECK_INSTANCE_CAST ((obj), MATCH_TYPE_OBJECT, MatchObject))
+#define MATCH_IS_OBJECT(obj)              (G_TYPE_CHECK_INSTANCE_TYPE ((obj), MATCH_TYPE_OBJECT))
+
+typedef struct _MatchObject MatchObject;
+
+GType            match_object_get_type (void) G_GNUC_CONST;
+
+gpointer         match_object_get_item        (MatchObject *object);
+const char *     match_object_get_string      (MatchObject *object);
+guint            match_object_get_match_start (MatchObject *object);
+guint            match_object_get_match_end   (MatchObject *object);
+guint            match_object_get_score       (MatchObject *object);
+void             match_object_set_match       (MatchObject *object,
+                                               guint        start,
+                                               guint        end,
+                                               guint        score);
+
+#define SUGGESTION_TYPE_ENTRY               (suggestion_entry_get_type ())
+#define SUGGESTION_ENTRY(obj)               (G_TYPE_CHECK_INSTANCE_CAST ((obj), SUGGESTION_TYPE_ENTRY, SuggestionEntry))
+#define SUGGESTION_IS_ENTRY(obj)            (G_TYPE_CHECK_INSTANCE_TYPE ((obj), SUGGESTION_TYPE_ENTRY))
+
+typedef struct _SuggestionEntry       SuggestionEntry;
+
+GType           suggestion_entry_get_type (void) G_GNUC_CONST;
+
+GtkWidget*      suggestion_entry_new                (void);
+
+void            suggestion_entry_set_model          (SuggestionEntry     *self,
+                                                     GListModel          *model);
+GListModel *    suggestion_entry_get_model          (SuggestionEntry     *self);
+
+void            suggestion_entry_set_factory        (SuggestionEntry     *self,
+                                                     GtkListItemFactory  *factory);
+GtkListItemFactory *
+                suggestion_entry_get_factory        (SuggestionEntry     *self);
+
+void            suggestion_entry_set_use_filter     (SuggestionEntry     *self,
+                                                     gboolean             use_ilter);
+gboolean        suggestion_entry_get_use_filter     (SuggestionEntry     *self);
+
+void            suggestion_entry_set_expression     (SuggestionEntry     *self,
+                                                     GtkExpression       *expression);
+GtkExpression * suggestion_entry_get_expression     (SuggestionEntry     *self);
+
+void            suggestion_entry_set_show_arrow     (SuggestionEntry     *self,
+                                                     gboolean             show_arrow);
+gboolean        suggestion_entry_get_show_arrow     (SuggestionEntry     *self);
+
+typedef void (* SuggestionEntryMatchFunc)           (MatchObject *object,
+                                                     const char  *search,
+                                                     gpointer     user_data);
+
+void            suggestion_entry_set_match_func     (SuggestionEntry          *self,
+                                                     SuggestionEntryMatchFunc  func,
+                                                     gpointer                  user_data,
+                                                     GDestroyNotify            destroy);
+
+G_END_DECLS

demos/gtk-demo/svgpaintable.c

@@ -0,0 +1,166 @@
+#include "svgpaintable.h"
+
+#include <gtk/gtk.h>
+#include <librsvg/rsvg.h>
+
+struct _SvgPaintable
+{
+  GObject parent_instance;
+  GFile *file;
+  RsvgHandle *handle;
+};
+
+struct _SvgPaintableClass
+{
+  GObjectClass parent_class;
+};
+
+enum {
+  PROP_FILE = 1,
+  NUM_PROPERTIES
+};
+
+static void
+svg_paintable_snapshot (GdkPaintable *paintable,
+                        GdkSnapshot  *snapshot,
+                        double        width,
+                        double        height)
+{
+  SvgPaintable *self = SVG_PAINTABLE (paintable);
+  cairo_t *cr;
+  GError *error = NULL;
+
+  cr = gtk_snapshot_append_cairo (GTK_SNAPSHOT (snapshot),
+                                  &GRAPHENE_RECT_INIT (0, 0, width, height));
+
+  if (!rsvg_handle_render_document (self->handle, cr,
+                                    &(RsvgRectangle) {0, 0, width, height},
+                                    &error))
+    {
+      g_error ("%s", error->message);
+    }
+
+  cairo_destroy (cr);
+}
+
+static int
+svg_paintable_get_intrinsic_width (GdkPaintable *paintable)
+{
+  SvgPaintable *self = SVG_PAINTABLE (paintable);
+  RsvgDimensionData data;
+
+  rsvg_handle_get_dimensions (self->handle, &data);
+
+  return data.width;
+}
+
+static int
+svg_paintable_get_intrinsic_height (GdkPaintable *paintable)
+{
+  SvgPaintable *self = SVG_PAINTABLE (paintable);
+  RsvgDimensionData data;
+
+  rsvg_handle_get_dimensions (self->handle, &data);
+
+  return data.height;
+}
+
+static void
+svg_paintable_init_interface (GdkPaintableInterface *iface)
+{
+  iface->snapshot = svg_paintable_snapshot;
+  iface->get_intrinsic_width = svg_paintable_get_intrinsic_width;
+  iface->get_intrinsic_height = svg_paintable_get_intrinsic_height;
+}
+
+G_DEFINE_TYPE_WITH_CODE (SvgPaintable, svg_paintable, G_TYPE_OBJECT,
+                         G_IMPLEMENT_INTERFACE (GDK_TYPE_PAINTABLE,
+                                                svg_paintable_init_interface))
+
+static void
+svg_paintable_init (SvgPaintable *self)
+{
+}
+
+static void
+svg_paintable_dispose (GObject *object)
+{
+  SvgPaintable *self = SVG_PAINTABLE (object);
+
+  g_clear_object (&self->file);
+  g_clear_object (&self->handle);
+
+  G_OBJECT_CLASS (svg_paintable_parent_class)->dispose (object);
+}
+
+static void
+svg_paintable_set_property (GObject      *object,
+                            guint         prop_id,
+                            const GValue *value,
+                            GParamSpec   *pspec)
+{
+  SvgPaintable *self = SVG_PAINTABLE (object);
+
+  switch (prop_id)
+    {
+    case PROP_FILE:
+      {
+        GFile *file = g_value_get_object (value);
+        RsvgHandle *handle = rsvg_handle_new_from_gfile_sync (file,
+                                                              RSVG_HANDLE_FLAGS_NONE,
+                                                              NULL,
+                                                              NULL);
+        rsvg_handle_set_dpi (handle, 90);
+
+        g_set_object (&self->file, file);
+        g_set_object (&self->handle, handle);
+      }
+      break;
+
+    default:
+      G_OBJECT_WARN_INVALID_PROPERTY_ID (object, prop_id, pspec);
+    }
+}
+
+static void
+svg_paintable_get_property (GObject    *object,
+                            guint       prop_id,
+                            GValue     *value,
+                            GParamSpec *pspec)
+{
+  SvgPaintable *self = SVG_PAINTABLE (object);
+
+  switch (prop_id)
+    {
+    case PROP_FILE:
+      g_value_set_object (value, self->file);
+      break;
+
+    default:
+      G_OBJECT_WARN_INVALID_PROPERTY_ID (object, prop_id, pspec);
+    }
+}
+
+
+static void
+svg_paintable_class_init (SvgPaintableClass *class)
+{
+  GObjectClass *object_class = G_OBJECT_CLASS (class);
+
+  object_class->dispose = svg_paintable_dispose;
+  object_class->set_property = svg_paintable_set_property;
+  object_class->get_property = svg_paintable_get_property;
+
+  g_object_class_install_property (object_class, PROP_FILE,
+                                   g_param_spec_object ("file", "File", "File",
+                                                        G_TYPE_FILE,
+                                                        G_PARAM_READWRITE));
+}
+
+GdkPaintable *
+svg_paintable_new (GFile *file)
+{
+  return g_object_new (SVG_TYPE_PAINTABLE,
+                       "file", file,
+                       NULL);
+}

demos/gtk-demo/svgpaintable.h

@@ -0,0 +1,13 @@
+#pragma once
+
+#include <gtk/gtk.h>
+
+G_BEGIN_DECLS
+
+#define SVG_TYPE_PAINTABLE (svg_paintable_get_type ())
+
+G_DECLARE_FINAL_TYPE (SvgPaintable, svg_paintable, SVG, PAINTABLE, GObject)
+
+GdkPaintable * svg_paintable_new (GFile *file);
+
+G_END_DECLS

demos/gtk-demo/tagged_entry.c

@@ -66,6 +66,7 @@ do_tagged_entry (GtkWidget *do_widget)
       gtk_window_set_display (GTK_WINDOW (window),
                               gtk_widget_get_display (do_widget));
       gtk_window_set_title (GTK_WINDOW (window), "Tagged Entry");
+      gtk_window_set_default_size (GTK_WINDOW (window), 260, -1);
       gtk_window_set_resizable (GTK_WINDOW (window), FALSE);
 
       g_object_add_weak_pointer (G_OBJECT (window), (gpointer *)&window);

demos/gtk-demo/tagstyle.css

@@ -1,5 +1,5 @@
 tag {
-  margin: 4px;
+  margin: 4px 0px;
   padding: 4px;
   border-radius: 4px;
   background: lightskyblue;
@@ -17,3 +17,7 @@ tag button {
   padding: 0;
   border: 1px solid white;
 }
+
+entry.tagged {
+  border-spacing: 4px;
+}

demos/gtk-demo/textview.c

@@ -545,6 +545,7 @@ recursive_attach_view (int                 depth,
     return;
 
   child_view = gtk_text_view_new_with_buffer (gtk_text_view_get_buffer (view));
+  gtk_widget_set_size_request (child_view, 260 - 20 * depth, -1);
 
   /* Frame is to add a black border around each child view */
   frame = gtk_frame_new (NULL);
@@ -590,6 +591,8 @@ easter_egg_callback (GtkWidget *button,
   g_object_unref (buffer);
 
   window = gtk_window_new ();
+  gtk_window_set_transient_for (GTK_WINDOW (window), GTK_WINDOW (gtk_widget_get_root (button)));
+  gtk_window_set_modal (GTK_WINDOW (window), TRUE);
   sw = gtk_scrolled_window_new ();
   gtk_scrolled_window_set_policy (GTK_SCROLLED_WINDOW (sw),
                                   GTK_POLICY_AUTOMATIC,

demos/gtk-demo/themes.ui

@@ -11,6 +11,7 @@
   </object>
   <object class="GtkWindow" id="window">
     <property name="resizable">0</property>
+    <property name="title">Themes</property>
     <child type="titlebar">
       <object class="GtkHeaderBar" id="header">
         <child type="start">

demos/print-editor/print-editor.c

@@ -164,7 +164,7 @@ save_file (GFile *save_filename)
                            NULL,
                            &error);
 
-  if (error != NULL)
+  if (error == NULL)
     {
       if (save_filename != filename)
 	{

demos/widget-factory/widget-factory.c

@@ -91,6 +91,16 @@ change_theme_state (GSimpleAction *action,
 
 static GtkWidget *page_stack;
 
+static void
+transition_speed_changed (GtkRange *range,
+                          gpointer  data)
+{
+  double value;
+
+  value = gtk_range_get_value (range);
+  gtk_stack_set_transition_duration (GTK_STACK (page_stack), (int)value);
+}
+
 static void
 change_transition_state (GSimpleAction *action,
                          GVariant      *state,
@@ -250,6 +260,8 @@ activate_about (GSimpleAction *action,
                 gpointer       user_data)
 {
   GtkApplication *app = user_data;
+  GtkWindow *window;
+  GtkWidget *button;
   const char *authors[] = {
     "Andrea Cimitan",
     "Cosimo Cecchi",
@@ -267,6 +279,10 @@ activate_about (GSimpleAction *action,
 
   s = g_string_new ("");
 
+  window = gtk_application_get_active_window (app);
+  button = GTK_WIDGET (g_object_get_data (G_OBJECT (window), "open_menubutton"));
+  gtk_menu_button_popdown (GTK_MENU_BUTTON (button));
+
   os_name = g_get_os_info (G_OS_INFO_KEY_NAME);
   os_version = g_get_os_info (G_OS_INFO_KEY_VERSION_ID);
   if (os_name && os_version)
@@ -292,6 +308,7 @@ activate_about (GSimpleAction *action,
 
   dialog = g_object_new (GTK_TYPE_ABOUT_DIALOG,
                          "transient-for", gtk_application_get_active_window (app),
+                         "modal", TRUE,
                          "program-name", "GTK Widget Factory",
                          "version", version,
                          "copyright", "© 1997—2020 The GTK Team",
@@ -315,6 +332,21 @@ activate_about (GSimpleAction *action,
   g_free (os_version);
 }
 
+static void
+activate_shortcuts_window (GSimpleAction *action,
+                           GVariant      *parameter,
+                           gpointer       user_data)
+{
+  GtkApplication *app = user_data;
+  GtkWindow *window;
+  GtkWidget *button;
+
+  window = gtk_application_get_active_window (app);
+  button = GTK_WIDGET (g_object_get_data (G_OBJECT (window), "open_menubutton"));
+  gtk_menu_button_popdown (GTK_MENU_BUTTON (button));
+  gtk_widget_activate_action (GTK_WIDGET (window), "win.show-help-overlay", NULL);
+}
+
 static void
 activate_quit (GSimpleAction *action,
                GVariant      *parameter,
@@ -2022,6 +2054,7 @@ activate (GApplication *app)
           "validate_more_details", (GCallback)validate_more_details,
           "mode_switch_state_set", (GCallback)mode_switch_state_set,
           "level_scale_value_changed", (GCallback)level_scale_value_changed,
+          "transition_speed_changed", (GCallback)transition_speed_changed,
           NULL);
   gtk_builder_set_scope (builder, scope);
   g_object_unref (scope);
@@ -2359,6 +2392,7 @@ main (int argc, char *argv[])
   GAction *action;
   static GActionEntry app_entries[] = {
     { "about", activate_about, NULL, NULL, NULL },
+    { "shortcuts", activate_shortcuts_window, NULL, NULL, NULL },
     { "quit", activate_quit, NULL, NULL, NULL },
     { "inspector", activate_inspector, NULL, NULL, NULL },
     { "main", NULL, "s", "'steak'", NULL },

demos/widget-factory/widget-factory.ui

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <interface>
-  <menu id="gear_menu">
+  <menu id="gear_menu_model">
     <section>
       <item>
         <attribute name="label" translatable="yes">Get Busy</attribute>
@@ -40,6 +40,9 @@
         <attribute name="label" translatable="yes">Transition Pages</attribute>
         <attribute name="action">win.transition</attribute>
       </item>
+      <item>
+        <attribute name="custom">transition-speed</attribute>
+      </item>
     </section>
     <section>
       <item>
@@ -48,7 +51,7 @@
       </item>
       <item>
         <attribute name="label" translatable="yes">_Keyboard Shortcuts</attribute>
-        <attribute name="action">win.show-help-overlay</attribute>
+        <attribute name="action">app.shortcuts</attribute>
       </item>
       <item>
         <attribute name="label" translatable="yes">_About Widget Factory</attribute>
@@ -444,7 +447,26 @@ Suspendisse feugiat quam quis dolor accumsan cursus.</property>
         <child type="end">
           <object class="GtkMenuButton" id="gear_menu_button">
             <property name="valign">center</property>
-            <property name="menu-model">gear_menu</property>
+            <property name="popover">
+              <object class="GtkPopoverMenu" id="gear_menu">
+                <property name="menu-model">gear_menu_model</property>
+                <child type="transition-speed">
+                  <object class="GtkScale">
+                    <property name="adjustment">
+                      <object class="GtkAdjustment">
+                        <property name="lower">0</property>
+                        <property name="upper">1000</property>
+                        <property name="value">250</property>
+                        <property name="step-increment">50</property>
+                        <property name="page-increment">50</property>
+                        <property name="page-size">0</property>
+                      </object>
+                    </property>
+                    <signal name="value-changed" handler="transition_speed_changed"/>
+                  </object>
+                </child>
+              </object>
+            </property>
             <property name="icon-name">open-menu-symbolic</property>
           </object>
         </child>
@@ -3198,7 +3220,7 @@ bad things might happen.</property>
           <object class="GtkMenuButton">
             <property name="halign">end</property>
             <property name="icon-name">emblem-system-symbolic</property>
-            <property name="menu-model">gear_menu</property>
+            <property name="menu-model">gear_menu_model</property>
             <property name="tooltip-text">This is a menu button</property>
             <layout>
               <property name="column">1</property>

docs/reference/gdk/gdk4-docs.xml

@@ -16,14 +16,16 @@
     </releaseinfo>
   </bookinfo>
 
-  <reference id="reference">
+  <chapter>
     <title>API Reference</title>
     <xi:include href="xml/general.xml" />
     <xi:include href="xml/gdkdisplaymanager.xml" />
     <xi:include href="xml/gdkdisplay.xml" />
     <xi:include href="xml/gdkseat.xml" />
     <xi:include href="xml/gdkdevice.xml" />
-    <xi:include href="xml/gdkdevicepad.xml" />
+    <section>
+      <xi:include href="xml/gdkdevicepad.xml" />
+    </section>
     <xi:include href="xml/gdkmonitor.xml" />
     <xi:include href="xml/regions.xml" />
     <xi:include href="xml/textures.xml" />
@@ -32,16 +34,24 @@
     <xi:include href="xml/cursors.xml" />
     <xi:include href="xml/gdksurface.xml" />
     <xi:include href="xml/gdktoplevel.xml" />
-    <xi:include href="xml/gdktoplevellayout.xml" />
-    <xi:include href="xml/gdktoplevelsize.xml" />
+    <section>
+      <xi:include href="xml/gdktoplevellayout.xml" />
+      <xi:include href="xml/gdktoplevelsize.xml" />
+    </section>
     <xi:include href="xml/gdkpopup.xml" />
-    <xi:include href="xml/gdkpopuplayout.xml" />
+    <section>
+      <xi:include href="xml/gdkpopuplayout.xml" />
+    </section>
     <xi:include href="xml/gdkframeclock.xml" />
-    <xi:include href="xml/gdkframetimings.xml" />
+    <section>
+      <xi:include href="xml/gdkframetimings.xml" />
+    </section>
     <xi:include href="xml/gdkdrawcontext.xml" />
-    <xi:include href="xml/gdkglcontext.xml" />
-    <xi:include href="xml/gdkvulkancontext.xml" />
-    <xi:include href="xml/gdkcairocontext.xml" />
+    <section>
+      <xi:include href="xml/gdkglcontext.xml" />
+      <xi:include href="xml/gdkvulkancontext.xml" />
+      <xi:include href="xml/gdkcairocontext.xml" />
+    </section>
     <xi:include href="xml/events.xml" />
     <xi:include href="xml/keys.xml" />
     <xi:include href="xml/gdkclipboard.xml" />
@@ -50,13 +60,16 @@
     <xi:include href="xml/gdkcontentprovider.xml" />
     <xi:include href="xml/gdkcontentserializer.xml" />
     <xi:include href="xml/gdkcontentdeserializer.xml" />
-    <xi:include href="xml/gdkapplaunchcontext.xml" />
     <xi:include href="xml/pixbufs.xml" />
     <xi:include href="xml/pango_interaction.xml" />
     <xi:include href="xml/cairo_interaction.xml" />
+  </chapter>
+  <chapter>
+    <title>GDK Platform Support</title>
+    <xi:include href="xml/gdkapplaunchcontext.xml" />
     <xi:include href="xml/x_interaction.xml" />
     <xi:include href="xml/wayland_interaction.xml" />
-  </reference>
+  </chapter>
 
   <index id="api-index-full">
     <title>Index of all symbols</title>

docs/reference/gdk/gdk4-overrides.txt

@@ -10,8 +10,8 @@
 </MACRO>
 
 <MACRO>
-<NAME>GDK_WINDOWING_QUARTZ</NAME>
-#define GDK_WINDOWING_QUARTZ
+<NAME>GDK_WINDOWING_MACOS</NAME>
+#define GDK_WINDOWING_MACOS
 </MACRO>
 
 <MACRO>

docs/reference/gdk/gdk4-sections.txt

@@ -8,7 +8,7 @@
 <SUBSECTION>
 GDK_WINDOWING_X11
 GDK_WINDOWING_WIN32
-GDK_WINDOWING_QUARTZ
+GDK_WINDOWING_MACOS
 GDK_WINDOWING_WAYLAND
 
 <SUBSECTION>
@@ -303,11 +303,8 @@ gdk_cairo_draw_from_gl
 </SECTION>
 
 <SECTION>
-<TITLE>Points, Rectangles and Regions</TITLE>
+<TITLE>Rectangles and Regions</TITLE>
 <FILE>regions</FILE>
-GdkPoint
-
-<SUBSECTION>
 GdkRectangle
 gdk_rectangle_intersect
 gdk_rectangle_union
@@ -961,7 +958,6 @@ gdk_wayland_display_query_registry
 gdk_wayland_display_set_cursor_theme
 gdk_wayland_display_get_startup_notification_id
 gdk_wayland_display_set_startup_notification_id
-gdk_wayland_display_prefers_ssd
 gdk_wayland_display_query_registry
 
 <SUBSECTION Device>
@@ -970,7 +966,6 @@ gdk_wayland_device_get_wl_seat
 gdk_wayland_device_get_wl_pointer
 gdk_wayland_device_get_wl_keyboard
 gdk_wayland_device_get_node_ath
-gdk_wayland_device_pad_set_feedback
 
 <SUBSECTION Monitor>
 gdk_wayland_monitor_get_wl_output
@@ -982,9 +977,6 @@ gdk_wayland_toplevel_export_handle
 gdk_wayland_toplevel_unexport_handle
 gdk_wayland_toplevel_set_transient_for_exported
 gdk_wayland_toplevel_set_application_id
-gdk_wayland_toplevel_announce_csd
-gdk_wayland_toplevel_inhibit_idle
-gdk_wayland_toplevel_uninhibit_idle
 
 <SUBSECTION Standard>
 GDK_TYPE_WAYLAND_DEVICE

docs/reference/gtk/getting_started.md

@@ -586,53 +586,53 @@ print_hello (GtkWidget *widget,
 }
 
 static void
-quit_cb (GtkWidget *widget, gpointer data)
+quit_cb (GtkWindow *window)
 {
-  gboolean *done = data;
-
-  *done = TRUE;
-
-  g_main_context_wakeup (NULL);
+  gtk_window_close (window);
 }
 
-int
-main (int   argc,
-      char *argv[])
+static void
+activate (GtkApplication *app,
+          gpointer        user_data)
 {
-  GtkBuilder *builder;
-  GObject *window;
-  GObject *button;
-  gboolean done = FALSE;
-
-#ifdef GTK_SRCDIR
-  g_chdir (GTK_SRCDIR);
-#endif
-
-  gtk_init ();
-
   /* Construct a GtkBuilder instance and load our UI description */
-  builder = gtk_builder_new ();
+  GtkBuilder *builder = gtk_builder_new ();
   gtk_builder_add_from_file (builder, "builder.ui", NULL);
 
   /* Connect signal handlers to the constructed widgets. */
-  window = gtk_builder_get_object (builder, "window");
-  g_signal_connect (window, "destroy", G_CALLBACK (quit_cb), &done);
+  GObject *window = gtk_builder_get_object (builder, "window");
+  gtk_window_set_application (GTK_WINDOW (window), app);
 
-  button = gtk_builder_get_object (builder, "button1");
+  GObject *button = gtk_builder_get_object (builder, "button1");
   g_signal_connect (button, "clicked", G_CALLBACK (print_hello), NULL);
 
   button = gtk_builder_get_object (builder, "button2");
   g_signal_connect (button, "clicked", G_CALLBACK (print_hello), NULL);
 
   button = gtk_builder_get_object (builder, "quit");
-  g_signal_connect (button, "clicked", G_CALLBACK (quit_cb), &done);
+  g_signal_connect_swapped (button, "clicked", G_CALLBACK (quit_cb), window);
 
   gtk_widget_show (GTK_WIDGET (window));
 
-  while (!done)
-    g_main_context_iteration (NULL, TRUE);
+  /* We do not need the builder any more */
+  g_object_unref (builder);
+}
 
-  return 0;
+int
+main (int   argc,
+      char *argv[])
+{
+#ifdef GTK_SRCDIR
+  g_chdir (GTK_SRCDIR);
+#endif
+
+  GtkApplication *app = gtk_application_new ("org.gtk.example", G_APPLICATION_FLAGS_NONE);
+  g_signal_connect (app, "activate", G_CALLBACK (activate), NULL);
+
+  int status = g_application_run (G_APPLICATION (app), argc, argv);
+  g_object_unref (app);
+
+  return status;
 }
 ```
 

docs/reference/gtk/gtk4-sections.txt

@@ -971,6 +971,7 @@ gtk_editable_get_enable_undo
 gtk_editable_set_enable_undo
 <SUBSECTION>
 gtk_editable_install_properties
+gtk_editable_get_delegate
 gtk_editable_init_delegate
 gtk_editable_finish_delegate
 gtk_editable_delegate_set_property
@@ -1431,6 +1432,7 @@ GTK_TYPE_BOOKMARK_LIST
 <FILE>gtkfilter</FILE>
 <TITLE>GtkFilter</TITLE>
 GtkFilter
+GtkFilterMatch
 gtk_filter_match
 gtk_filter_get_strictness
 <SUBSECTION>
@@ -2106,6 +2108,7 @@ gtk_native_dialog_get_type
 <TITLE>GtkNotebook</TITLE>
 GtkNotebook
 GtkNotebookPage
+GtkNotebookTab
 gtk_notebook_new
 gtk_notebook_get_page
 gtk_notebook_get_pages
@@ -2162,7 +2165,6 @@ GTK_NOTEBOOK_GET_CLASS
 <SUBSECTION Private>
 gtk_notebook_get_type
 gtk_notebook_page_get_type
-GtkNotebookTab
 GtkNotebookPrivate
 </SECTION>
 
@@ -6150,6 +6152,8 @@ gtk_popover_get_has_arrow
 gtk_popover_set_offset
 gtk_popover_get_offset
 gtk_popover_set_default_widget
+gtk_popover_set_cascade_popdown
+gtk_popover_get_cascade_popdown
 <SUBSECTION Standard>
 GTK_TYPE_POPOVER
 GTK_IS_POPOVER
@@ -6174,6 +6178,8 @@ gtk_popover_menu_new_from_model
 gtk_popover_menu_new_from_model_full
 gtk_popover_menu_set_menu_model
 gtk_popover_menu_get_menu_model
+gtk_popover_menu_add_child
+gtk_popover_menu_remove_child
 
 <SUBSECTION Standard>
 GTK_TYPE_POPOVER_MENU
@@ -6192,6 +6198,8 @@ GtkPopoverMenuBar
 gtk_popover_menu_bar_new_from_model
 gtk_popover_menu_bar_set_menu_model
 gtk_popover_menu_bar_get_menu_model
+gtk_popover_menu_bar_add_child
+gtk_popover_menu_bar_remove_child
 
 <SUBSECTION Standard>
 GTK_TYPE_POPOVER_MENU_BAR

docs/reference/gtk/meson.build

@@ -240,11 +240,14 @@ images = [
   'images/border1.png',
   'images/border2.png',
   'images/border3.png',
+  'images/box.png',
   'images/box-expand.png',
   'images/box-packing.png',
   'images/builder-shortcuts.png',
   'images/button.png',
+  'images/calendar.png',
   'images/capture-bubble.png',
+  'images/centerbox.png',
   'images/check-button.png',
   'images/checks.png',
   'images/clocks-shortcuts.png',
@@ -258,14 +261,17 @@ images = [
   'images/down-start.png',
   'images/drop-down.png',
   'images/drawing.png',
+  'images/drawingarea.png',
   'images/ease-in-out.png',
   'images/ease-in.png',
   'images/ease-out.png',
   'images/ease.png',
   'images/editable-label.png',
+  'images/emojichooser.png',
   'images/entry.png',
   'images/exampleapp.png',
   'images/expanders.png',
+  'images/expander.png',
   'images/extensions.png',
   'images/figure-hierarchical-drawing.png',
   'images/figure-windowed-label.png',
@@ -293,6 +299,7 @@ images = [
   'images/gradient2.png',
   'images/gradient3.png',
   'images/gradient4.png',
+  'images/grid.png',
   'images/grid-packing.png',
   'images/handles.png',
   'images/headerbar.png',
@@ -324,16 +331,19 @@ images = [
   'images/lockbutton-sorry.png',
   'images/lockbutton-unlocked.png',
   'images/media-controls.png',
+  'images/menu.png',
   'images/menubar.png',
   'images/menu-button.png',
   'images/messagedialog.png',
   'images/multiline-text.png',
   'images/notebook.png',
   'images/options.png',
+  'images/overlay.png',
   'images/pagesetupdialog.png',
   'images/panes.png',
   'images/password-entry.png',
   'images/picture.png',
+  'images/popover.png',
   'images/popup-anchors.png',
   'images/popup-at.svg',
   'images/popup-flip.png',
@@ -349,6 +359,7 @@ images = [
   'images/search-bar.png',
   'images/search-entry.png',
   'images/separator.png',
+  'images/shortcuts-window.png',
   'images/sidebar.png',
   'images/slices.png',
   'images/sliders.png',
@@ -367,6 +378,7 @@ images = [
   'images/video.png',
   'images/volumebutton.png',
   'images/widget-hvalign.png',
+  'images/windowcontrols.png',
   'images/window-default.png',
   'images/window.png',
   'images/rich-list.png',

docs/reference/gtk/migrating-3to4.md

@@ -239,6 +239,39 @@ you get to the point that you actually build your application against
 GTK 4. Making it possible to prepare for these in GTK 3 would
 have been either impossible or impractical.
 
+### Larger changes
+
+Some of the larger themes of GTK 4 development are hard to cover in the form
+of checklist items, so we mention them separately up-front.
+
+#### Subclassing
+
+Compared to previous versions, GTK 4 emphasizes composition and delegation
+over subclassing. As a consequence, many widgets can no longer be subclassed.
+In most cases, you should look deriving your widget directly from GtkWidget
+and use complex widgets as child widgets instead of deriving from them.
+
+#### Life-cycle handling
+
+Widgets in GTK 4 are treated like any other objects - their parent widget
+holds a reference on them, and GTK holds a reference on toplevel windows.
+gtk_window_destroy() will drop the reference on the toplevel window, and
+cause the whole widget hierarchy to be finalized unless there are other
+references that keep widgets alive.
+
+The #GtkWidget::destroy signal is emitted when a widget is disposed, and
+therefore can no longer be used to break reference cycles. A typical sign
+of a reference cycle involving a toplevel window is when closing the window
+does not make the application quit.
+
+A good rule to follow is: If you set a widget pointer with
+gtk_widget_class_bind_template_child() in class_init(), you need to
+unparent it in dispose(). The slight complication here is that you need
+to respect the widget hierarchy while doing so. Ie if you set both `field1`
+and `field2`, but `field1` is an ancestor of `field2`, then you only need
+to unparent `field1` — doing so will remove the the entire subtree below
+`field1`, including `field2`.
+
 ### Stop using GdkScreen
 
 The GdkScreen object has been removed in GTK 4. Most of its APIs already
@@ -412,6 +445,9 @@ gtk4-builder-tool simplify command can perform many of the
 necessary changes automatically, when called with the --3to4
 option. You should always review the resulting changes.
 
+The <requires> tag now supports for the 'lib' attribute the
+'gtk' value only, instead of the 'gtk+' one previously.
+
 ### Adapt to event controller API changes
 
 A few changes to the event controller and #GtkGesture APIs
@@ -1037,14 +1073,22 @@ of a #GtkIconInfo. It always returns a paintable in the requested size, and
 never fails. A number of no-longer-relevant lookup flags and API variants
 have been removed.
 
+Note that while GTK 4 is moving towards #GdkPaintable as a primary API
+for paintable content, it is meant to be a 'pure' content producer, therefore
+a #GtkIconPaintable for a symbolic icon will *not* get recolored depending
+on the context it is rendered it. To properly render a symbolic icon that
+is provided in the form of a #GtkIconPaintable (this can be checked with
+gtk_icon_paintable_is_symbolic()), you have to call
+gtk_icon_paintable_get_icon_name() and set the icon name on a #GtkImage.
+
 ### Update to GtkFileChooser API changes
 
-GtkFileChooser moved to a GFile-based API. If you need to convert a
-path or a URI, use g_file_new_for_path(), g_file_new_for_commandline_arg(),
-or g_file_new_for_uri(); similarly, if you need to get a path or a URI
-from a GFile, use g_file_get_path(), or g_file_get_uri(). With the
-removal or path and URI-based functions, the "local-only" property has
-been removed; GFile can be used to access non-local as well as local
+GtkFileChooser moved to a GFile-based API. If you need to convert a path
+or a URI, use g_file_new_for_path(), g_file_new_for_commandline_arg(),
+or g_file_new_for_uri(); similarly, if you need to get a path, name or URI
+from a GFile, use g_file_get_path(), g_file_get_basename() or g_file_get_uri().
+With the removal or path and URI-based functions, the "local-only" property
+has been removed; GFile can be used to access non-local as well as local
 resources.
 
 The GTK_FILE_CHOOSER_ACTION_CREATE_FOLDER action has been removed. Use

docs/reference/gtk/question_index.md

@@ -71,12 +71,12 @@ the question you have, this list is a good place to start.
 6.  How do I use GTK with threads?
 
     GTK requires that all GTK API calls are made from the same thread in which
-    gtk_init() was called (the _main thread_).
+    the #GtkApplication was created, or gtk_init() was called (the _main thread_).
 
     If you want to take advantage of multi-threading in a GTK application,
     it is usually best to send long-running tasks to worker threads, and feed
-    the results back to the main thread using g_idle_add() or GAsyncQueue. GIO
-    offers useful tools for such an approach such as GTask.
+    the results back to the main thread using g_idle_add() or #GAsyncQueue. GIO
+    offers useful tools for such an approach such as #GTask.
 
 7.  How do I internationalize a GTK program?
 

docs/reference/gtk/running.md

@@ -11,9 +11,9 @@ environment variables.
 
 ### GTK_DEBUG {#GTK_Debug-Options}
 
-Unless GTK has been configured with `-Ddebug=false`, this variable
-can be set to a list of debug options, which cause GTK to print out
-different types of debugging information.
+This variable can be set to a list of debug options, which cause GTK to
+print out different types of debugging information. Some of these options
+are only available when GTK has been configured with `-Ddebug=true`.
 
 actions
  : Actions and menu models
@@ -98,6 +98,14 @@ be used for the default IM module. This also can be a colon-separated
 list of input-methods, which GTK will try in turn until it finds one
 available on the system.
 
+### GTK_MEDIA
+
+Specifies what backend to load for #GtkMediaFile. The possible values
+depend on what options GTK was built with, and can include 'gstreamer',
+'ffmpeg' and 'none'. If set to 'none', media playback will be unavailable.
+The special value 'help' can be used to obtain a list of all supported
+media backends.
+
 ### GTK_EXE_PREFIX
 
 If set, GTK uses `$GTK_EXE_PREFIX/lib` instead of the libdir
@@ -133,9 +141,9 @@ The `loaders.cache` file is generated by the
 
 ### GDK_DEBUG
 
-Unless GTK has been configured with `-Ddebug=false`, this variable
-can be set to a list of debug options, which cause GDK to print out
-different types of debugging information.
+This variable can be set to a list of debug options, which cause GDK to
+print out different types of debugging information. Some of these options
+are only available when GTK has been configured with `-Ddebug=true`.
 
 cursor
  : Information about cursor objects (only win32)
@@ -183,10 +191,9 @@ to obtain a list of all supported debug options.
 
 ### GSK_DEBUG {#GSK-Debug-Options}
 
-Unless GTK has been configured with `-Ddebug=false`,
-this variable can be set to a list of debug options,
-which cause GSK to print out different types of debugging
-information.
+This variable can be set to a list of debug options, which cause GSK to
+print out different types of debugging information. Some of these options
+are only available when GTK has been configured with `-Ddebug=true`.
 
 renderer
  : General renderer information
@@ -285,6 +292,24 @@ CSD is always used for windows with a custom titlebar widget set,
 as the WM should not draw another titlebar or other decorations
 around the custom one.
 
+### GTK_A11Y
+
+If set, selects the accessibility backend to use. The following
+backends can be selected, provided they are included in the GTK
+library you are using:
+
+help
+ : Prints information about available options
+atspi
+ : Selects the AT-SPI accessibility backend
+test
+ : Selects the test backend
+none
+ : Disables the accessibility backend
+
+The `test` accessibility backend is recommended for test suites and remote
+continuous integration pipelines.
+
 ### XDG_DTA_HOME, XDG_DATA_DIRS
 
 GTK uses these environment variables to locate icon themes

docs/reference/gtk/section-accessibility.md

@@ -48,18 +48,35 @@ Each role name is part of the #GtkAccessibleRole enumeration.
 | `BUTTON` | A control that performs an action when pressed | #GtkButton, #GtkLinkButton, #GtkExpander |
 | `CHECKBOX` | A control that has three possible value: `true`, `false`, or `undefined` | #GtkCheckButton |
 | `COMBOBOX` | A control that can be expanded to show a list of possible values to select | #GtkComboBox |
+| `COLUMN_HEADER` | A header in a columned list | #GtkColumnView |
 | `DIALOG` | A dialog that prompts the user to enter information or require a response | #GtkDialog and subclasses |
+| `GRID` | A grid of items | #GtkFlowBox, #GtkGridView |
+| `GRID_CELL` | An item in a grid | #GtkFlowBoxChild, #GtkGridView, #GtkColumnView |
 | `IMG` | An image | #GtkImage, #GtkPicture |
 | `LABEL` | A visible name or caption for a user interface component | #GtkLabel |
+| `LINK` | A clickable hyperlink | #GtkLinkButton |
+| `LIST` | A list of items | #GtkListBox |
+| `LIST_ITEM` | An item in a list | #GtkListBoxRow |
+| `MENU` | A menu | #GtkPopoverMenu |
+| `MENU_BAR` | A menubar | #GtkPopoverMenuBar |
+| `MENU_ITEM` | A menu item | Items in #GtkPopoverMenu |
+| `MENU_ITEM_CHECKBOX` | Check menu item | Items in #GtkPopoverMenu |
+| `MENU_ITEM_RADIO` | Radio menu item | Items in #GtkPopoverMenu |
 | `METER` | Represents a value within a known range | #GtkLevelBar |
+| `NONE` | Not represented in the accessibility tree | the slider of a #GtkScale |
 | `PROGRESS_BAR` | An element that display progress | #GtkProgressBar |
 | `RADIO` | A checkable input in a group of radio roles | #GtkCheckButton |
+| `ROW` | A row in a columned list | #GtkColumnView |
 | `SCROLLBAR` | A graphical object controlling the scrolling of content | #GtkScrollbar |
 | `SEARCH_BOX` | A text box for entering search criteria | #GtkSearchEntry |
 | `SEPARATOR` | A divider that separates sections of content or groups of items | #GtkSeparator |
 | `SPIN_BUTTON` | A range control that allows seelcting among discrete choices | #GtkSpinButton |
 | `SWITCH` | A control that represents on/off values | #GtkSwitch |
+| `TAB` | A tab in a list of tabs for switching pages | #GtkStackSwitcher, #GtkNotebook |
+| `TAB_LIST` | A list of tabs for switching pages | #GtkStackSwitcher, #GtkNotebook |
+| `TAB_PANEL` | A page in a notebook or stack | #GtkStack |
 | `TEXT_BOX` | A type of input that allows free-form text as its value. | #GtkEntry, #GtkPasswordEntry, #GtkTextView |
+| `TREE_GRID` | A treeview-like columned list | #GtkColumnView |
 | `WINDOW` | An application window | #GtkWindow |
 | `...` | … |
 
@@ -96,9 +113,9 @@ for instance:
 See the [WAI-ARIA](https://www.w3.org/WAI/PF/aria/appendices#quickref) list
 of attributes for additional information.
 
-#### List of accessible properties
+#### List of accessible states
 
-Each state name is part of the #GtkAccessibleProperty enumeration.
+Each state name is part of the #GtkAccessibleState enumeration.
 
 | State name | ARIA attribute | Value type | Notes |
 |------------|----------------|------------|-------|
@@ -111,9 +128,9 @@ Each state name is part of the #GtkAccessibleProperty enumeration.
 | %GTK_ACCESSIBLE_STATE_PRESSED | “aria-pressed” | #GtkAccessibleTristate | Indicates the current state of a #GtkToggleButton |
 | %GTK_ACCESSIBLE_STATE_SELECTED | “aria-selected” | boolean or undefined | Set when a widget is selected |
 
-#### List of accessible relations
+#### List of accessible properties
 
-Each state name is part of the #GtkAccessibleRelation enumeration.
+Each property name is part of the #GtkAccessibleProperty enumeration.
 
 | State name | ARIA attribute | Value type |
 |------------|----------------|------------|
@@ -137,9 +154,9 @@ Each state name is part of the #GtkAccessibleRelation enumeration.
 | %GTK_ACCESSIBLE_PROPERTY_VALUE_NOW | “aria-valuenow” | double |
 | %GTK_ACCESSIBLE_PROPERTY_VALUE_TEXT | “aria-valuetext” | translatable string |
 
-#### List of accessible states
+#### List of accessible relations
 
-Each state name is part of the #GtkAccessibleState enumeration.
+Each relation name is part of the #GtkAccessibleRelation enumeration.
 
 | State name | ARIA attribute | Value type |
 |------------|----------------|------------|
@@ -148,13 +165,13 @@ Each state name is part of the #GtkAccessibleState enumeration.
 | %GTK_ACCESSIBLE_RELATION_COL_INDEX | “aria-colindex” | integer |
 | %GTK_ACCESSIBLE_RELATION_COL_INDEX_TEXT | “aria-colindextext” | translatable string |
 | %GTK_ACCESSIBLE_RELATION_COL_SPAN | “aria-colspan” | integer |
-| %GTK_ACCESSIBLE_RELATION_CONTROLS | “aria-controls” | a #GList of #GtkAccessible |
-| %GTK_ACCESSIBLE_RELATION_DESCRIBED_BY | “aria-describedby” | a #GList of #GtkAccessible |
-| %GTK_ACCESSIBLE_RELATION_DETAILS | “aria-details” | a #GList of #GtkAccessible |
+| %GTK_ACCESSIBLE_RELATION_CONTROLS | “aria-controls” | a list of #GtkAccessible |
+| %GTK_ACCESSIBLE_RELATION_DESCRIBED_BY | “aria-describedby” | a list of #GtkAccessible |
+| %GTK_ACCESSIBLE_RELATION_DETAILS | “aria-details” | a list of #GtkAccessible |
 | %GTK_ACCESSIBLE_RELATION_ERROR_MESSAGE | “aria-errormessage” | #GtkAccessible |
-| %GTK_ACCESSIBLE_RELATION_FLOW_TO | “aria-flowto” | a #GList of #GtkAccessible |
-| %GTK_ACCESSIBLE_RELATION_LABELLED_BY | “aria-labelledby” | a #GList of #GtkAccessible |
-| %GTK_ACCESSIBLE_RELATION_OWNS | “aria-owns” | a #GList of #GtkAccessible |
+| %GTK_ACCESSIBLE_RELATION_FLOW_TO | “aria-flowto” | a list of #GtkAccessible |
+| %GTK_ACCESSIBLE_RELATION_LABELLED_BY | “aria-labelledby” | a list of #GtkAccessible |
+| %GTK_ACCESSIBLE_RELATION_OWNS | “aria-owns” | a list of #GtkAccessible |
 | %GTK_ACCESSIBLE_RELATION_POS_IN_SET | “aria-posinset” | integer |
 | %GTK_ACCESSIBLE_RELATION_ROW_COUNT | “aria-rowcount” | integer |
 | %GTK_ACCESSIBLE_RELATION_ROW_INDEX | “aria-rowindex” | integer |
@@ -162,6 +179,10 @@ Each state name is part of the #GtkAccessibleState enumeration.
 | %GTK_ACCESSIBLE_RELATION_ROW_SPAN | “aria-rowspan” | integer |
 | %GTK_ACCESSIBLE_RELATION_SET_SIZE | “aria-setsize” | integer |
 
+*Note*: When using gtk_accessible_update_relation() with a relation that
+requires a list of #GtkAccessible instances, you should pass every
+accessible object separately, followed by %NULL. 
+
 ## Application development rules
 
 Even if standard UI controls provided by GTK have accessibility information
@@ -173,7 +194,7 @@ with a form to fill out, you should ensure that:
  * each text entry widget in the form has the `GTK_ACCESSIBLE_RELATION_LABELLED_BY`
    relation pointing to the label widget that describes it
 
-Another example: if you create a tool bar containing buttons with only icons,
+Another example: if you create a toolbar containing buttons with only icons,
 you should ensure that:
 
  * the container has a `GTK_ACCESSIBLE_ROLE_TOOLBAR` role
@@ -182,7 +203,7 @@ you should ensure that:
    "Paste", "Add layer", or "Remove"
 
 GTK will try to fill in some information by using ancillary UI control
-property, for instance the accessible label will be taken from the label or
+properties, for instance the accessible label will be taken from the label or
 placeholder text used by the UI control, or from its tooltip, if the
 `GTK_ACCESSIBLE_PROPERTY_LABEL` property or the `GTK_ACCESSIBLE_RELATION_LABELLED_BY`
 relation are unset. Nevertheless, it is good practice and project hygiene
@@ -210,3 +231,137 @@ which acts as a proxy to the specific platform's accessibility API:
 
 Additionally, an ad hoc accessibility backend is available for the GTK
 testsuite, to ensure reproducibility of issues in the CI pipeline.
+
+## Authoring practices {#authoring-practices}
+
+The authoring practices are aimed at application developers, as well as
+developers of GUI elements based on GTK.
+
+Functionally, #GtkAccessible roles, states, properties, and relations are
+analogous to a CSS for assistive technologies. For screen reader users, for
+instance, the various accessible attributes control the rendering of their
+non-visual experience. Incorrect roles and attributes may result in a
+completely inaccessible user interface.
+
+### A role is a promise
+
+The following code:
+
+```c
+gtk_widget_class_set_accessible_role (widget_class, GTK_ACCESSIBLE_ROLE_BUTTON);
+```
+
+is a promise that the widget being created will provide the same keyboard
+interactions expected for a button. An accessible role of a button will not
+turn automatically any widget into a #GtkButton; but if your widget behaves
+like a button, using the %GTK_ACCESSIBLE_ROLE_BUTTON will allow any
+assistive technology to handle it like they would a #GtkButton.
+
+### Attributes can both hide and enhance
+
+Accessible attributes can be used to override the content of a UI element,
+for instance:
+
+```c
+gtk_label_set_text (GTK_LABEL (label), "Some text");
+gtk_accessible_update_property (GTK_ACCESSIBLE (label),
+				GTK_ACCESSIBLE_PROPERTY_LABEL,
+				"Assistive technologies users will perceive "
+				"this text, not the contents of the label",
+				-1);
+```
+
+In the example above, the "label" property will override the contents of the
+label widget.
+
+The attributes can also enhance the UI:
+
+```c
+gtk_button_set_label (GTK_BUTTON (button), "Download");
+gtk_box_append (GTK_BOX (button), button);
+
+gtk_label_set_text (GTK_LABEL (label), "Final report.pdf");
+gtk_box_append (GTK_BOX (box), label);
+
+gtk_accessible_update_relation (GTK_ACCESSIBLE (button),
+				GTK_ACCESSIBLE_RELATION_LABELLED_BY,
+				g_list_append (NULL, label),
+				-1);
+```
+
+In the example above, an assistive technology will read the button's
+accessible label as "Download Final report.pdf".
+
+The power of hiding and enhancing can be a double-edged sword, as it can
+lead to inadvertently overriding the accessible semantics of existing
+widgets.
+
+## Hiding UI elements from the accessible tree
+
+The accessibility API is mainly used to express semantics useful for
+assistive technologies, but it can also be used to hide elements. The
+canonical way to do so is to use the %GTK_ACCESSIBLE_ROLE_PRESENTATION,
+which declares that a UI element is purely meant for presentation purposes,
+and as such it has no meaningful impact on the accessibility of the
+interface.
+
+A "presentation" role should not be confused with the
+%GTK_ACCESSIBLE_STATE_HIDDEN state; the "hidden" state is transient, and is
+typically controlled by showing and hiding a widget using the #GtkWidget
+API.
+
+## Design patterns and custom widgets
+
+When creating custom widgets, following established patterns can help
+ensuring that the widgets work well for users of accessible technologies
+as well.
+
+### Buttons
+
+A button is a widget that enables users to trigger an action. While it is
+recommended you use #GtkButton for anything that looks and behaves like a
+button, it is possible to apply a button behavior to UI elements like images
+by using a #GtkGestureClick gesture. When doing so, you should:
+
+  - Give your widget the role %GTK_ACCESSIBLE_ROLE_BUTTON
+  - Install an action with no parameters, which will activate the widget
+
+### Custom entries
+
+For custom entries, it is highly recommended that you implement the
+#GtkEditable interface by using a #GtkText widget as delegate. If you
+do this, GTK will make your widgets text editing functionality accessible
+in the same way as a #GtkSpinButton or #GtkSearchEntry.
+
+### Tab-based UI
+
+If you make a tab-based interface, you should consider using #GtkStack
+as the core, and just make a custom tab widget to control the active
+stack page. When doing so, the following extra steps will ensure that
+your tabs are accessible in the same way as #GtkStackSwitcher or #GtkNotebook:
+
+- Give your tab container the role %GTK_ACCESSIBLE_ROLE_TAB_LIST
+- Give your tab widgets the role %GTK_ACCESSIBLE_ROLE_TAB
+- Set up the %GTK_ACCESSIBLE_RELATION_CONTROLS relation between each
+  tab and the #GtkStackPage object for its page
+- Set the %GTK_ACCESSIBLE_PROPERTY_SELECTED property on each tab, with
+  the active tab getting the value %TRUE, all others %FALSE
+
+To allow changing the active tab via accessible technologies, you can
+export actions. Since the accessibility interfaces only support actions
+without parameters, you can either provide `previous-tab` and `next-tab`
+actions on the tab container that let users step through the tabs one-by-one,
+or add a `activate-tab` action on each tab.
+
+### Value controls
+
+A value control (ie a widget that controls a one-dimensional quantity
+that can be represented by a #GtkAdjustment) can be represented to
+accessible technologies by setting the %GTK_ACCESSIBLE_PROPERTY_VALUE_MIN,
+%GTK_ACCESSIBLE_PROPERTY_VALUE_MAX, and %GTK_ACCESSIBLE_PROPERTY_VALUE_NOW
+properties.
+
+To allow changing the value via accessible technologies, you can export
+actions.  Since the accessibility interfaces only support actions
+without parameters, you should provide actions such as `increase-value`
+and `decrease-value`.

docs/reference/gtk/visual_index.xml

@@ -6,210 +6,104 @@
 <section id="visual-display">
   <title>Display</title>
   <para role="gallery">
-    <link linkend="GtkLabel">
-      <inlinegraphic fileref="label.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkSpinner">
-      <inlinegraphic fileref="spinner.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkStatusbar">
-      <inlinegraphic fileref="statusbar.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkLevelBar">
-      <inlinegraphic fileref="levelbar.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkProgressBar">
-      <inlinegraphic fileref="progressbar.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkInfoBar">
-      <inlinegraphic fileref="info-bar.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkScrollbar">
-      <inlinegraphic fileref="scrollbar.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkImage">
-      <inlinegraphic fileref="image.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkSeparator">
-      <inlinegraphic fileref="separator.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkTextView">
-      <inlinegraphic fileref="multiline-text.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkScale">
-      <inlinegraphic fileref="scales.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkGLArea">
-      <inlinegraphic fileref="glarea.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkPicture">
-      <inlinegraphic fileref="picture.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkVideo">
-      <inlinegraphic fileref="video.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkMediaControls">
-      <inlinegraphic fileref="media-controls.png" format="PNG"></inlinegraphic>
-    </link>
+    <link linkend="GtkLabel"><inlinegraphic fileref="label.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkSpinner"><inlinegraphic fileref="spinner.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkStatusbar"><inlinegraphic fileref="statusbar.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkLevelBar"><inlinegraphic fileref="levelbar.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkProgressBar"><inlinegraphic fileref="progressbar.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkInfoBar"><inlinegraphic fileref="info-bar.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkScrollbar"><inlinegraphic fileref="scrollbar.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkImage"><inlinegraphic fileref="image.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkPicture"><inlinegraphic fileref="picture.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkSeparator"><inlinegraphic fileref="separator.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkTextView"><inlinegraphic fileref="multiline-text.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkScale"><inlinegraphic fileref="scales.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkCalendar"><inlinegraphic fileref="calendar.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkGLArea"><inlinegraphic fileref="glarea.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkDrawingArea"><inlinegraphic fileref="drawingarea.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkVideo"><inlinegraphic fileref="video.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkMediaControls"><inlinegraphic fileref="media-controls.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkWindowControls"><inlinegraphic fileref="windowcontrols.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkEmojiChooser"><inlinegraphic fileref="emojichooser.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkPopoverMenu"><inlinegraphic fileref="menu.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkPopoverMenuBar"><inlinegraphic fileref="menubar.png" format="PNG"></inlinegraphic></link>
   </para>
 </section>
 
 <section id="visual-buttons">
   <title>Buttons</title>
   <para role="gallery">
-    <link linkend="GtkButton">
-      <inlinegraphic fileref="button.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkCheckButton">
-      <inlinegraphic fileref="check-button.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkToggleButton">
-      <inlinegraphic fileref="toggle-button.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkLinkButton">
-      <inlinegraphic fileref="link-button.png" format="PNG"></inlinegraphic>
-    </link>
-
-    <link linkend="GtkMenuButton">
-      <inlinegraphic fileref="menu-button.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkLockButton">
-      <inlinegraphic fileref="lockbutton.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkSpinButton">
-      <inlinegraphic fileref="spinbutton.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkColorButton">
-      <inlinegraphic fileref="color-button.png" format="PNG"></inlinegraphic>
-    </link>
-
-    <link linkend="GtkSwitch">
-      <inlinegraphic fileref="switch.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkComboBox">
-      <inlinegraphic fileref="combo-box.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkComboBoxText">
-      <inlinegraphic fileref="combo-box-text.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkFontButton">
-      <inlinegraphic fileref="font-button.png" format="PNG"></inlinegraphic>
-    </link>
-
-    <link linkend="GtkAppChooserButton">
-      <inlinegraphic fileref="appchooserbutton.png" format="PNG"></inlinegraphic>
-    </link>
-   <link linkend="GtkVolumeButton">
-      <inlinegraphic fileref="volumebutton.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkFileChooserButton">
-      <inlinegraphic fileref="file-button.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkDropDown">
-      <inlinegraphic fileref="drop-down.png" format="PNG"></inlinegraphic>
-    </link>
+    <link linkend="GtkButton"><inlinegraphic fileref="button.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkToggleButton"><inlinegraphic fileref="toggle-button.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkLinkButton"><inlinegraphic fileref="link-button.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkCheckButton"><inlinegraphic fileref="check-button.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkMenuButton"><inlinegraphic fileref="menu-button.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkLockButton"><inlinegraphic fileref="lockbutton.png" format="PNG"></inlinegraphic></link>
+   <link linkend="GtkVolumeButton"><inlinegraphic fileref="volumebutton.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkSwitch"><inlinegraphic fileref="switch.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkComboBox"><inlinegraphic fileref="combo-box.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkComboBoxText"><inlinegraphic fileref="combo-box-text.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkDropDown"><inlinegraphic fileref="drop-down.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkColorButton"><inlinegraphic fileref="color-button.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkFontButton"><inlinegraphic fileref="font-button.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkAppChooserButton"><inlinegraphic fileref="appchooserbutton.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkFileChooserButton"><inlinegraphic fileref="file-button.png" format="PNG"></inlinegraphic></link>
   </para>
 </section>
 
 <section id="visual-entries">
   <title>Entries</title>
   <para role="gallery">
-    <link linkend="GtkEntry">
-      <inlinegraphic fileref="entry.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkSearchEntry">
-      <inlinegraphic fileref="search-entry.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkPasswordEntry">
-      <inlinegraphic fileref="password-entry.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkEditableLabel">
-      <inlinegraphic fileref="editable-label.png" format="PNG"></inlinegraphic>
-    </link>
+    <link linkend="GtkEntry"><inlinegraphic fileref="entry.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkSearchEntry"><inlinegraphic fileref="search-entry.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkPasswordEntry"><inlinegraphic fileref="password-entry.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkSpinButton"><inlinegraphic fileref="spinbutton.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkEditableLabel"><inlinegraphic fileref="editable-label.png" format="PNG"></inlinegraphic></link>
   </para>
 </section>
 
 <section id="visual-containers">
   <title>Containers</title>
   <para role="gallery">
-    <link linkend="GtkScrolledWindow">
-      <inlinegraphic fileref="scrolledwindow.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkHeaderBar">
-      <inlinegraphic fileref="headerbar.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkSearchBar">
-      <inlinegraphic fileref="search-bar.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkActionBar">
-      <inlinegraphic fileref="action-bar.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkListBox">
-      <inlinegraphic fileref="list-box.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkFlowBox">
-      <inlinegraphic fileref="flow-box.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkStack">
-      <inlinegraphic fileref="stack.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkStackSwitcher">
-      <inlinegraphic fileref="stackswitcher.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkStackSidebar">
-      <inlinegraphic fileref="sidebar.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkTreeView">
-      <inlinegraphic fileref="list-and-tree.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkIconView">
-      <inlinegraphic fileref="icon-view.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkNotebook">
-      <inlinegraphic fileref="notebook.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkFrame">
-      <inlinegraphic fileref="frame.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkPaned">
-      <inlinegraphic fileref="panes.png" format="PNG"></inlinegraphic>
-    </link>
+    <link linkend="GtkBox"><inlinegraphic fileref="box.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkGrid"><inlinegraphic fileref="grid.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkCenterBox"><inlinegraphic fileref="centerbox.png" format="PNG"></inlinegraphic></link>
+  </para>
+  <para role="gallery">
+    <link linkend="GtkScrolledWindow"><inlinegraphic fileref="scrolledwindow.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkPaned"><inlinegraphic fileref="panes.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkFrame"><inlinegraphic fileref="frame.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkExpander"><inlinegraphic fileref="expander.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkSearchBar"><inlinegraphic fileref="search-bar.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkActionBar"><inlinegraphic fileref="action-bar.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkHeaderBar"><inlinegraphic fileref="headerbar.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkNotebook"><inlinegraphic fileref="notebook.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkListBox"><inlinegraphic fileref="list-box.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkFlowBox"><inlinegraphic fileref="flow-box.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkTreeView"><inlinegraphic fileref="list-and-tree.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkIconView"><inlinegraphic fileref="icon-view.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkOverlay"><inlinegraphic fileref="overlay.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkStack"><inlinegraphic fileref="stack.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkStackSwitcher"><inlinegraphic fileref="stackswitcher.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkStackSidebar"><inlinegraphic fileref="sidebar.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkPopover"><inlinegraphic fileref="popover.png" format="PNG"></inlinegraphic></link>
   </para>
 </section>
 
 <section id="visual-windows">
   <title>Windows</title>
   <para role="gallery">
-    <link linkend="GtkWindow">
-      <inlinegraphic fileref="window.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkMessageDialog">
-      <inlinegraphic fileref="messagedialog.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkAboutDialog">
-      <inlinegraphic fileref="aboutdialog.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkAssistant">
-      <inlinegraphic fileref="assistant.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkColorChooserDialog">
-      <inlinegraphic fileref="colorchooser.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkFileChooserDialog">
-      <inlinegraphic fileref="filechooser.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkFontChooserDialog">
-      <inlinegraphic fileref="fontchooser.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkAppChooserDialog">
-      <inlinegraphic fileref="appchooserdialog.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkPageSetupUnixDialog">
-      <inlinegraphic fileref="pagesetupdialog.png" format="PNG"></inlinegraphic>
-    </link>
-    <link linkend="GtkPrintUnixDialog">
-      <inlinegraphic fileref="printdialog.png" format="PNG"></inlinegraphic>
-    </link>
+    <link linkend="GtkWindow"><inlinegraphic fileref="window.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkMessageDialog"><inlinegraphic fileref="messagedialog.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkAboutDialog"><inlinegraphic fileref="aboutdialog.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkAssistant"><inlinegraphic fileref="assistant.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkColorChooserDialog"><inlinegraphic fileref="colorchooser.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkFileChooserDialog"><inlinegraphic fileref="filechooser.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkFontChooserDialog"><inlinegraphic fileref="fontchooser.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkAppChooserDialog"><inlinegraphic fileref="appchooserdialog.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkPageSetupUnixDialog"><inlinegraphic fileref="pagesetupdialog.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkPrintUnixDialog"><inlinegraphic fileref="printdialog.png" format="PNG"></inlinegraphic></link>
+    <link linkend="GtkShortcutsWindow"><inlinegraphic fileref="shortcuts-window.png" format="PNG"></inlinegraphic></link>
   </para>
 </section>
 </para>

docs/tools/meson.build

@@ -1,4 +1,8 @@
 if get_option('gtk_doc')
+  doc_shooter_resources = gnome.compile_resources('shooter_resources',
+                                                  'shooter.gresource.xml',
+                                                  source_dir: '.')
+
   doc_shooter_sources = [
     'shooter.c',
     'shadow.c',
@@ -6,7 +10,8 @@ if get_option('gtk_doc')
     '../../tests/gtkgears.c',
   ]
 
-  doc_shooter = executable('doc-shooter', doc_shooter_sources,
+  doc_shooter = executable('doc-shooter',
+                           doc_shooter_sources, doc_shooter_resources,
                            include_directories: [ confinc, gdkinc, gtkinc, testinc, ],
                            dependencies: libgtk_dep)
 endif

docs/tools/shooter.c

@@ -112,11 +112,19 @@ snapshot_widget (GtkWidget *widget)
 
   g_main_loop_unref (loop);
   g_object_unref (paintable);
-  gtk_window_destroy (GTK_WINDOW (widget));
+  gtk_window_destroy (GTK_WINDOW (gtk_widget_get_root (widget)));
 
   return surface;
 }
 
+static gboolean
+quit_cb (gpointer data)
+{
+  *(gboolean *)data = TRUE;
+  g_main_context_wakeup (NULL);
+  return G_SOURCE_REMOVE;
+}
+
 int
 main (int argc, char **argv)
 {
@@ -132,6 +140,7 @@ main (int argc, char **argv)
       char *filename;
       cairo_surface_t *surface;
       GdkPixbuf *pixbuf;
+      GtkWidget *widget;
 
       info = node->data;
 
@@ -144,9 +153,29 @@ main (int argc, char **argv)
                                      NULL);
         }
 
-      //while (1) g_main_context_iteration (NULL, 1);
+      if (info->snapshot_popover)
+        {
+          GtkWidget *button = gtk_window_get_child (GTK_WINDOW (info->window));
 
-      surface = snapshot_widget (info->window);
+          gtk_menu_button_popup (GTK_MENU_BUTTON (button));
+          widget = GTK_WIDGET (gtk_menu_button_get_popover (GTK_MENU_BUTTON (button)));
+        }
+      else
+        {
+          widget = info->window;
+        }
+
+      if (info->wait > 0)
+        {
+          gboolean quit = FALSE;
+
+          g_timeout_add (info->wait, quit_cb, &quit);
+
+          while (!quit)
+            g_main_context_iteration (NULL, TRUE);
+        }
+
+      surface = snapshot_widget (widget);
 
       pixbuf = gdk_pixbuf_get_from_surface (surface, 0, 0,
                                             cairo_image_surface_get_width (surface),

docs/tools/shooter.gresource.xml

@@ -0,0 +1,5 @@
+<gresources>
+  <gresource prefix="/">
+    <file>shortcuts-boxes.ui</file>
+  </gresource>
+</gresources>

docs/tools/shortcuts-boxes.ui

@@ -0,0 +1,120 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<interface>
+  <object class="GtkShortcutsWindow" id="shortcuts-boxes">
+    <property name="modal">1</property>
+    <child>
+      <object class="GtkShortcutsSection">
+        <property name="section-name">shortcuts</property>
+        <property name="max-height">12</property>
+        <child>
+          <object class="GtkShortcutsGroup">
+            <property name="title" translatable="yes">Overview</property>
+            <property name="view">overview</property>
+            <child>
+              <object class="GtkShortcutsShortcut">
+                <property name="accelerator">F1</property>
+                <property name="title" translatable="yes">Help</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkShortcutsShortcut">
+                <property name="accelerator">&lt;Ctrl&gt;n</property>
+                <property name="title" translatable="yes">Create a new box</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkShortcutsShortcut">
+                <property name="accelerator">&lt;Ctrl&gt;f</property>
+                <property name="title" translatable="yes">Search</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkShortcutsShortcut">
+                <property name="accelerator">&lt;Ctrl&gt;k</property>
+                <property name="title" translatable="yes">Keyboard shortcuts</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkShortcutsShortcut">
+                <property name="accelerator">&lt;Ctrl&gt;q</property>
+                <property name="title" translatable="yes">Close Window/Quit Boxes</property>
+              </object>
+            </child>
+          </object>
+        </child>
+        <child>
+          <object class="GtkShortcutsGroup">
+            <property name="title" translatable="yes">Box Creation and Properties</property>
+            <property name="view">wizard</property>
+            <child>
+              <object class="GtkShortcutsShortcut">
+                <property name="direction">ltr</property>
+                <property name="accelerator">&lt;Alt&gt;Right</property>
+                <property name="title" translatable="yes">Switch to the next page</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkShortcutsShortcut">
+                <property name="direction">ltr</property>
+                <property name="accelerator">&lt;Alt&gt;Left</property>
+                <property name="title" translatable="yes">Switch to the previous page</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkShortcutsShortcut">
+                <property name="direction">rtl</property>
+                <property name="accelerator">&lt;Alt&gt;Left</property>
+                <property name="title" translatable="yes">Switch to the next page</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkShortcutsShortcut">
+                <property name="direction">rtl</property>
+                <property name="accelerator">&lt;Alt&gt;Right</property>
+                <property name="title" translatable="yes">Switch to the previous page</property>
+              </object>
+            </child>
+          </object>
+        </child>
+        <child>
+          <object class="GtkShortcutsGroup">
+            <property name="title" translatable="yes">Box Display</property>
+            <property name="view">display</property>
+            <child>
+              <object class="GtkShortcutsShortcut">
+                <property name="accelerator">Control_L+Alt_L</property>
+                <property name="title" translatable="yes">Grab/Ungrab keyboard</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkShortcutsShortcut">
+                <property name="direction">ltr</property>
+                <property name="accelerator">&lt;Alt&gt;Left</property>
+                <property name="title" translatable="yes">Back to overview</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkShortcutsShortcut">
+                <property name="direction">rtl</property>
+                <property name="accelerator">&lt;Alt&gt;Right</property>
+                <property name="title" translatable="yes">Back to overview</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkShortcutsShortcut">
+                <property name="accelerator">&lt;Ctrl&gt;q</property>
+                <property name="title" translatable="yes">Close window/Quit Boxes</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkShortcutsShortcut">
+                <property name="accelerator">F11</property>
+                <property name="title" translatable="yes">Fullscreen/Restore from fullscreen</property>
+              </object>
+            </child>
+          </object>
+        </child>
+      </object>
+    </child>
+  </object>
+</interface>

docs/tools/widgets.c

@@ -33,6 +33,19 @@ new_widget_info (const char *name,
       gtk_window_set_resizable (GTK_WINDOW (info->window), FALSE);
       info->include_decorations = TRUE;
     }
+  else if (GTK_IS_POPOVER (widget))
+    {
+      GtkWidget *button;
+
+      info->snapshot_popover = TRUE;
+      info->window = gtk_window_new ();
+      gtk_window_set_default_size (GTK_WINDOW (info->window), 200, 200);
+      gtk_window_set_decorated (GTK_WINDOW (info->window), FALSE);
+      info->include_decorations = TRUE;
+      button = gtk_menu_button_new ();
+      gtk_menu_button_set_popover (GTK_MENU_BUTTON (button), widget);
+      gtk_window_set_child (GTK_WINDOW (info->window), button);
+    }
   else
     {
       info->window = gtk_window_new ();
@@ -54,7 +67,7 @@ new_widget_info (const char *name,
       gtk_widget_set_size_request (info->window, 240, 240);
       break;
     default:
-	break;
+      break;
     }
 
   return info;
@@ -666,8 +679,9 @@ create_editable_label (void)
 
   add_margin (vbox);
 
-  return new_widget_info ("editable-label", vbox, MEDIUM);
+  return new_widget_info ("editable-label", vbox, SMALL);
 }
+
 static WidgetInfo *
 create_separator (void)
 {
@@ -1067,6 +1081,7 @@ create_picture (void)
   GtkWidget *vbox;
   GtkIconTheme *theme;
   GdkPaintable *paintable;
+  GtkWidget *box;
 
   theme = gtk_icon_theme_get_for_display (gdk_display_get_default ());
   paintable = GDK_PAINTABLE (gtk_icon_theme_lookup_icon (theme,
@@ -1080,8 +1095,12 @@ create_picture (void)
   gtk_widget_set_halign (widget, GTK_ALIGN_CENTER);
   gtk_widget_set_valign (widget, GTK_ALIGN_CENTER);
 
+  box = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 0);
+  gtk_box_append (GTK_BOX (box), g_object_new (GTK_TYPE_IMAGE, "hexpand", TRUE, NULL));
+  gtk_box_append (GTK_BOX (box), widget);
+  gtk_box_append (GTK_BOX (box), g_object_new (GTK_TYPE_IMAGE, "hexpand", TRUE, NULL));
   vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 3);
-  gtk_box_append (GTK_BOX (vbox), widget);
+  gtk_box_append (GTK_BOX (vbox), box);
   gtk_box_append (GTK_BOX (vbox), gtk_label_new ("Picture"));
 
   add_margin (vbox);
@@ -1094,10 +1113,13 @@ create_video (void)
 {
   GtkWidget *widget;
   GtkWidget *vbox;
+  WidgetInfo *info;
 
-  widget = gtk_video_new_for_filename ("../../demos/gtk-demo/gtk-logo.webm");
-  gtk_widget_set_halign (widget, GTK_ALIGN_CENTER);
-  gtk_widget_set_valign (widget, GTK_ALIGN_CENTER);
+  widget = gtk_video_new_for_filename ("demos/gtk-demo/gtk-logo.webm");
+  gtk_video_set_autoplay (GTK_VIDEO (widget), TRUE);
+
+  gtk_widget_set_halign (widget, GTK_ALIGN_FILL);
+  gtk_widget_set_valign (widget, GTK_ALIGN_FILL);
 
   vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 3);
   gtk_box_append (GTK_BOX (vbox), widget);
@@ -1105,7 +1127,10 @@ create_video (void)
 
   add_margin (vbox);
 
-  return new_widget_info ("video", vbox, SMALL);
+  info = new_widget_info ("video", vbox, MEDIUM);
+  info->wait = 2000;
+
+  return info;
 }
 
 static WidgetInfo *
@@ -1113,8 +1138,13 @@ create_media_controls (void)
 {
   GtkWidget *widget;
   GtkWidget *vbox;
+  GtkMediaStream *stream;
+  WidgetInfo *info;
 
-  widget = gtk_media_controls_new (NULL);
+  stream = gtk_media_file_new_for_filename ("demos/gtk-demo/gtk-logo.webm");
+  gtk_media_stream_play (stream);
+  widget = gtk_media_controls_new (stream);
+  gtk_widget_set_size_request (widget, 210, -1);
   gtk_widget_set_halign (widget, GTK_ALIGN_CENTER);
   gtk_widget_set_valign (widget, GTK_ALIGN_CENTER);
 
@@ -1124,7 +1154,10 @@ create_media_controls (void)
 
   add_margin (vbox);
 
-  return new_widget_info ("media-controls", vbox, SMALL);
+  info = new_widget_info ("media-controls", vbox, SMALL);
+  info->wait = 2000;
+
+  return info;
 }
 
 static WidgetInfo *
@@ -1151,25 +1184,18 @@ create_spinner (void)
 static WidgetInfo *
 create_volume_button (void)
 {
-  GtkWidget *button, *box;
-  GtkWidget *widget;
-  GtkWidget *popup;
+  GtkWidget *widget, *vbox;
 
-  widget = gtk_window_new ();
-  gtk_widget_set_size_request (widget, 100, 250);
+  widget = gtk_volume_button_new ();
+  gtk_scale_button_set_value (GTK_SCALE_BUTTON (widget), 33);
 
-  box = gtk_box_new (GTK_ORIENTATION_VERTICAL, 0);
-  gtk_window_set_child (GTK_WINDOW (widget), box);
+  vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 3);
+  gtk_widget_set_halign (widget, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (widget, GTK_ALIGN_CENTER);
+  gtk_box_append (GTK_BOX (vbox), widget);
+  gtk_box_append (GTK_BOX (vbox), gtk_label_new ("Volume Button"));
 
-  button = gtk_volume_button_new ();
-  gtk_box_append (GTK_BOX (box), button);
-
-  gtk_scale_button_set_value (GTK_SCALE_BUTTON (button), 33);
-  popup = gtk_scale_button_get_popup (GTK_SCALE_BUTTON (button));
-  gtk_widget_realize (widget);
-  gtk_widget_show (popup);
-
-  return new_widget_info ("volumebutton", widget, ASIS);
+  return new_widget_info ("volumebutton", vbox, SMALL);
 }
 
 static WidgetInfo *
@@ -1358,6 +1384,7 @@ create_sidebar (void)
   gtk_widget_add_css_class (view, "view");
   gtk_widget_set_halign (view, GTK_ALIGN_FILL);
   gtk_widget_set_valign (view, GTK_ALIGN_FILL);
+  gtk_widget_set_hexpand (view, TRUE);
   gtk_stack_add_titled (GTK_STACK (stack), view, "page1", "Page 1");
   view = gtk_text_view_new ();
   gtk_stack_add_titled (GTK_STACK (stack), view, "page2", "Page 2");
@@ -1373,7 +1400,7 @@ create_sidebar (void)
   gtk_box_append (GTK_BOX (hbox), stack);
   gtk_frame_set_child (GTK_FRAME (frame), hbox);
 
-  return new_widget_info ("sidebar", frame, ASIS);
+  return new_widget_info ("sidebar", frame, MEDIUM);
 }
 
 static WidgetInfo *
@@ -1471,6 +1498,7 @@ create_flow_box (void)
 static WidgetInfo *
 create_gl_area (void)
 {
+  GtkWidget *vbox;
   WidgetInfo *info;
   GtkWidget *widget;
   GtkWidget *gears;
@@ -1487,12 +1515,598 @@ create_gl_area (void)
   gtk_style_context_add_provider (gtk_widget_get_style_context (gears), GTK_STYLE_PROVIDER (provider), 800);
   g_object_unref (provider);
 
+  vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 3);
+  gtk_widget_set_halign (widget, GTK_ALIGN_FILL);
+  gtk_widget_set_valign (widget, GTK_ALIGN_FILL);
+  gtk_box_append (GTK_BOX (vbox), widget);
+  gtk_box_append (GTK_BOX (vbox), gtk_label_new ("GL Area"));
+
+  add_margin (vbox);
+
+  info = new_widget_info ("glarea", vbox, MEDIUM);
+
+  return info;
+}
+
+static WidgetInfo *
+create_window_controls (void)
+{
+  GtkWidget *controls;
+  GtkWidget *vbox;
+
+  controls = gtk_window_controls_new (GTK_PACK_END);
+  gtk_window_controls_set_decoration_layout (GTK_WINDOW_CONTROLS (controls),
+                                             ":minimize,maximize,close");
+  vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 3);
+  gtk_widget_set_halign (controls, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (controls, GTK_ALIGN_CENTER);
+  gtk_box_append (GTK_BOX (vbox), controls);
+  gtk_box_append (GTK_BOX (vbox), gtk_label_new ("Window Controls"));
+
+  add_margin (vbox);
+
+  return new_widget_info ("windowcontrols", vbox, SMALL);
+}
+
+static WidgetInfo *
+create_calendar (void)
+{
+  GtkWidget *widget;
+  GtkWidget *vbox;
+
+  widget = gtk_calendar_new ();
+
+  vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 3);
+  gtk_widget_set_halign (widget, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (widget, GTK_ALIGN_CENTER);
+  gtk_box_append (GTK_BOX (vbox), widget);
+  gtk_box_append (GTK_BOX (vbox), gtk_label_new ("Calendar"));
+
+  add_margin (vbox);
+
+  return new_widget_info ("calendar", vbox, MEDIUM);
+}
+
+static WidgetInfo *
+create_emojichooser (void)
+{
+  GtkWidget *widget;
+  WidgetInfo *info;
+
+  widget = gtk_emoji_chooser_new ();
+  g_object_set (widget, "autohide", FALSE, NULL);
+
+  info = new_widget_info ("emojichooser", widget, ASIS);
+  info->wait = 2000;
+
+  return info;
+}
+
+static WidgetInfo *
+create_expander (void)
+{
+  GtkWidget *widget;
+
+  widget = gtk_expander_new ("Expander");
+  gtk_expander_set_child (GTK_EXPANDER (widget), gtk_label_new ("Hidden Content"));
+  gtk_widget_set_halign (widget, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (widget, GTK_ALIGN_CENTER);
+
+  return new_widget_info ("expander", widget, SMALL);
+}
+
+static void
+mapped_cb (GtkWidget *widget)
+{
+  gtk_widget_child_focus (widget, GTK_DIR_RIGHT);
+}
+
+static WidgetInfo *
+create_menu_bar (void)
+{
+  GtkWidget *widget;
+  GtkWidget *vbox;
+  GMenu *menu, *menu1;
+  GMenuItem *item;
+
+  menu = g_menu_new ();
+  menu1 = g_menu_new ();
+  item = g_menu_item_new ("Item", "action");
+  g_menu_append_item (menu1, item);
+  g_menu_append_submenu (menu, "File", G_MENU_MODEL (menu1));
+  g_object_unref (item);
+  g_object_unref (menu1);
+  menu1 = g_menu_new ();
+  item = g_menu_item_new ("Item", "action");
+  g_menu_append_item (menu1, item);
+  g_menu_append_submenu (menu, "Edit", G_MENU_MODEL (menu1));
+  g_object_unref (item);
+  g_object_unref (menu1);
+  menu1 = g_menu_new ();
+  item = g_menu_item_new ("Item", "action");
+  g_menu_append_item (menu1, item);
+  g_menu_append_submenu (menu, "View", G_MENU_MODEL (menu1));
+  g_object_unref (item);
+  g_object_unref (menu1);
+
+  widget = gtk_popover_menu_bar_new_from_model (G_MENU_MODEL (menu));
+
+  g_object_unref (menu);
+
+  vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 6);
+  gtk_widget_set_halign (widget, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (widget, GTK_ALIGN_CENTER);
+  gtk_box_append (GTK_BOX (vbox), widget);
+  gtk_box_append (GTK_BOX (vbox), gtk_label_new ("Menu Bar"));
+
+  add_margin (vbox);
+
+  g_signal_connect (widget, "map", G_CALLBACK (mapped_cb), NULL);
+
+  return new_widget_info ("menubar", vbox, SMALL);
+}
+
+static WidgetInfo *
+create_popover (void)
+{
+  GtkWidget *widget;
+  GtkWidget *child;
+  WidgetInfo *info;
+
+  widget = gtk_popover_new ();
+  gtk_widget_set_size_request (widget, 180, 180);
+  gtk_widget_set_halign (widget, GTK_ALIGN_CENTER);
+  g_object_set (widget, "autohide", FALSE, NULL);
+  child = gtk_label_new ("Popover");
+  gtk_widget_set_halign (child, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (child, GTK_ALIGN_CENTER);
+  gtk_popover_set_child (GTK_POPOVER (widget), child);
+
+  info = new_widget_info ("popover", widget, ASIS);
+  info->wait = 100;
+
+  return info;
+}
+
+static WidgetInfo *
+create_menu (void)
+{
+  GtkWidget *widget;
+  GMenu *menu, *menu1;
+  GMenuItem *item;
+  GSimpleActionGroup *group;
+  GSimpleAction *action;
+  GtkEventController *controller;
+  GtkShortcut *shortcut;
+
+  menu = g_menu_new ();
+  menu1 = g_menu_new ();
+  item = g_menu_item_new ("Item", "action");
+  g_menu_append_item (menu1, item);
+  g_menu_append_submenu (menu, "Style", G_MENU_MODEL (menu1));
+  g_object_unref (item);
+  g_object_unref (menu1);
+  item = g_menu_item_new ("Transition", "menu.transition");
+  g_menu_append_item (menu, item);
+  g_object_unref (item);
+
+  menu1 = g_menu_new ();
+  item = g_menu_item_new ("Inspector", "menu.inspector");
+  g_menu_append_item (menu1, item);
+  g_object_unref (item);
+  item = g_menu_item_new ("About", "menu.about");
+  g_menu_append_item (menu1, item);
+  g_object_unref (item);
+  g_menu_append_section (menu, NULL, G_MENU_MODEL (menu1));
+  g_object_unref (menu1);
+
+  widget = gtk_popover_menu_new_from_model (G_MENU_MODEL (menu));
+
+  g_object_unref (menu);
+
+  group = g_simple_action_group_new ();
+  action = g_simple_action_new_stateful ("transition", NULL, g_variant_new_boolean (TRUE));
+  g_action_map_add_action (G_ACTION_MAP (group), G_ACTION (action));
+  g_object_unref (action);
+  action = g_simple_action_new ("inspector", NULL);
+  g_action_map_add_action (G_ACTION_MAP (group), G_ACTION (action));
+  g_object_unref (action);
+  action = g_simple_action_new ("about", NULL);
+  g_action_map_add_action (G_ACTION_MAP (group), G_ACTION (action));
+  g_object_unref (action);
+
+  gtk_widget_insert_action_group (widget, "menu", G_ACTION_GROUP (group));
+
+  g_object_unref (group);
+
+  g_object_set (widget, "autohide", FALSE, NULL);
+
+  controller = gtk_shortcut_controller_new ();
+  shortcut = gtk_shortcut_new (gtk_keyval_trigger_new (GDK_KEY_F1, 0),
+                               gtk_named_action_new ("menu.about"));
+  gtk_shortcut_controller_add_shortcut (GTK_SHORTCUT_CONTROLLER (controller), shortcut);
+
+  gtk_widget_add_controller (widget, controller);
+
+  return new_widget_info ("menu", widget, ASIS);
+}
+
+static WidgetInfo *
+create_shortcuts_window (void)
+{
+  GtkBuilder *builder;
+  GtkWidget *overlay;
+
+  builder = gtk_builder_new_from_resource ("/shortcuts-boxes.ui");
+  overlay = GTK_WIDGET (gtk_builder_get_object (builder, "shortcuts-boxes"));
+  g_object_set (overlay, "view-name", "display", NULL);
+  g_object_ref (overlay);
+  g_object_unref (builder);
+
+  return new_widget_info ("shortcuts-window", overlay, ASIS);
+}
+
+static void
+oval_path (cairo_t *cr,
+           double xc, double yc,
+           double xr, double yr)
+{
+  cairo_save (cr);
+
+  cairo_translate (cr, xc, yc);
+  cairo_scale (cr, 1.0, yr / xr);
+  cairo_move_to (cr, xr, 0.0);
+  cairo_arc (cr,
+             0, 0,
+             xr,
+             0, 2 * G_PI);
+  cairo_close_path (cr);
+
+  cairo_restore (cr);
+}
+
+static void
+fill_checks (cairo_t *cr,
+             int x,     int y,
+             int width, int height)
+{
+  int i, j;
+
+#define CHECK_SIZE 16
+
+  cairo_rectangle (cr, x, y, width, height);
+  cairo_set_source_rgb (cr, 0.4, 0.4, 0.4);
+  cairo_fill (cr);
+
+  /* Only works for CHECK_SIZE a power of 2 */
+  j = x & (-CHECK_SIZE);
+
+  for (; j < height; j += CHECK_SIZE)
+    {
+      i = y & (-CHECK_SIZE);
+      for (; i < width; i += CHECK_SIZE)
+        if ((i / CHECK_SIZE + j / CHECK_SIZE) % 2 == 0)
+          cairo_rectangle (cr, i, j, CHECK_SIZE, CHECK_SIZE);
+    }
+
+  cairo_set_source_rgb (cr, 0.7, 0.7, 0.7);
+  cairo_fill (cr);
+
+#undef CHECK_SIZE
+}
+
+static void
+draw_3circles (cairo_t *cr,
+               double xc, double yc,
+               double radius,
+               double alpha)
+{
+  double subradius = radius * (2 / 3. - 0.1);
+
+  cairo_set_source_rgba (cr, 1., 0., 0., alpha);
+  oval_path (cr,
+             xc + radius / 3. * cos (G_PI * (0.5)),
+             yc - radius / 3. * sin (G_PI * (0.5)),
+             subradius, subradius);
+  cairo_fill (cr);
+
+  cairo_set_source_rgba (cr, 0., 1., 0., alpha);
+  oval_path (cr,
+             xc + radius / 3. * cos (G_PI * (0.5 + 2/.3)),
+             yc - radius / 3. * sin (G_PI * (0.5 + 2/.3)),
+             subradius, subradius);
+  cairo_fill (cr);
+
+  cairo_set_source_rgba (cr, 0., 0., 1., alpha);
+  oval_path (cr,
+             xc + radius / 3. * cos (G_PI * (0.5 + 4/.3)),
+             yc - radius / 3. * sin (G_PI * (0.5 + 4/.3)),
+             subradius, subradius);
+  cairo_fill (cr);
+}
+
+static void
+groups_draw (GtkDrawingArea *darea,
+             cairo_t        *cr,
+             int             width,
+             int             height,
+             gpointer        data)
+{
+  cairo_surface_t *overlay, *punch, *circles;
+  cairo_t *overlay_cr, *punch_cr, *circles_cr;
+
+  /* Fill the background */
+  double radius = 0.5 * (width < height ? width : height) - 10;
+  double xc = width / 2.;
+  double yc = height / 2.;
+
+  overlay = cairo_surface_create_similar (cairo_get_target (cr),
+                                          CAIRO_CONTENT_COLOR_ALPHA,
+                                          width, height);
+
+  punch = cairo_surface_create_similar (cairo_get_target (cr),
+                                        CAIRO_CONTENT_ALPHA,
+                                        width, height);
+
+  circles = cairo_surface_create_similar (cairo_get_target (cr),
+                                          CAIRO_CONTENT_COLOR_ALPHA,
+                                          width, height);
+
+  fill_checks (cr, 0, 0, width, height);
+
+  /* Draw a black circle on the overlay
+   */
+  overlay_cr = cairo_create (overlay);
+  cairo_set_source_rgb (overlay_cr, 0., 0., 0.);
+  oval_path (overlay_cr, xc, yc, radius, radius);
+  cairo_fill (overlay_cr);
+
+  /* Draw 3 circles to the punch surface, then cut
+   * that out of the main circle in the overlay
+   */
+  punch_cr = cairo_create (punch);
+  draw_3circles (punch_cr, xc, yc, radius, 1.0);
+  cairo_destroy (punch_cr);
+
+  cairo_set_operator (overlay_cr, CAIRO_OPERATOR_DEST_OUT);
+  cairo_set_source_surface (overlay_cr, punch, 0, 0);
+  cairo_paint (overlay_cr);
+
+  /* Now draw the 3 circles in a subgroup again
+   * at half intensity, and use OperatorAdd to join up
+   * without seams.
+   */
+  circles_cr = cairo_create (circles);
+
+  cairo_set_operator (circles_cr, CAIRO_OPERATOR_OVER);
+  draw_3circles (circles_cr, xc, yc, radius, 0.5);
+  cairo_destroy (circles_cr);
+
+  cairo_set_operator (overlay_cr, CAIRO_OPERATOR_ADD);
+  cairo_set_source_surface (overlay_cr, circles, 0, 0);
+  cairo_paint (overlay_cr);
+
+  cairo_destroy (overlay_cr);
+
+  cairo_set_source_surface (cr, overlay, 0, 0);
+  cairo_paint (cr);
+
+  cairo_surface_destroy (overlay);
+  cairo_surface_destroy (punch);
+  cairo_surface_destroy (circles);
+}
+
+
+static WidgetInfo *
+create_drawing_area (void)
+{
+  GtkWidget *vbox;
+  WidgetInfo *info;
+  GtkWidget *widget;
+  GtkWidget *da;
+
+  widget = gtk_frame_new (NULL);
+  da = gtk_drawing_area_new ();
+  gtk_widget_set_size_request (da, 96, 96);
+  gtk_drawing_area_set_draw_func (GTK_DRAWING_AREA (da), groups_draw, NULL, NULL);
+  gtk_frame_set_child (GTK_FRAME (widget), da);
+
+  vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 6);
   gtk_widget_set_halign (widget, GTK_ALIGN_FILL);
   gtk_widget_set_valign (widget, GTK_ALIGN_FILL);
 
-  add_margin (widget);
+  gtk_box_append (GTK_BOX (vbox), widget);
+  gtk_box_append (GTK_BOX (vbox), gtk_label_new ("Drawing Area"));
 
-  info = new_widget_info ("glarea", widget, MEDIUM);
+  add_margin (vbox);
+
+  info = new_widget_info ("drawingarea", vbox, MEDIUM);
+
+  return info;
+}
+
+static WidgetInfo *
+create_box (void)
+{
+  GtkWidget *hbox;
+  GtkWidget *vbox;
+  GtkWidget *widget;
+
+  vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 3);
+  hbox = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 40);
+  gtk_widget_set_margin_top (hbox, 20);
+  gtk_widget_set_margin_bottom (hbox, 20);
+  gtk_widget_set_halign (hbox, GTK_ALIGN_CENTER);
+  widget = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 4);
+  for (int i = 0; i < 2; i++)
+    {
+      GtkWidget *button = gtk_button_new ();
+      gtk_widget_add_css_class (button, "small");
+      gtk_widget_set_halign (button, GTK_ALIGN_CENTER);
+      gtk_widget_set_valign (button, GTK_ALIGN_CENTER);
+      gtk_box_append (GTK_BOX (widget), button);
+    }
+  gtk_box_append (GTK_BOX (widget), gtk_label_new ("⋯"));
+  gtk_widget_set_halign (widget, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (widget, GTK_ALIGN_CENTER);
+  gtk_box_append (GTK_BOX (hbox), widget);
+  widget = gtk_box_new (GTK_ORIENTATION_VERTICAL, 4);
+  for (int i = 0; i < 2; i++)
+    {
+      GtkWidget *button = gtk_button_new ();
+      gtk_widget_add_css_class (button, "small");
+      gtk_widget_set_halign (button, GTK_ALIGN_CENTER);
+      gtk_widget_set_valign (button, GTK_ALIGN_CENTER);
+      gtk_box_append (GTK_BOX (widget), button);
+    }
+  gtk_box_append (GTK_BOX (widget), gtk_label_new ("⋮"));
+  gtk_widget_set_halign (widget, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (widget, GTK_ALIGN_CENTER);
+  gtk_box_append (GTK_BOX (hbox), widget);
+  gtk_box_append (GTK_BOX (vbox), hbox);
+  gtk_box_append (GTK_BOX (vbox), g_object_new (GTK_TYPE_LABEL,
+                                                "label", "Horizontal and Vertical Boxes",
+                                                "justify", GTK_JUSTIFY_CENTER,
+                                                NULL));
+  add_margin (vbox);
+
+  return new_widget_info ("box", vbox, MEDIUM);
+}
+
+static WidgetInfo *
+create_center_box (void)
+{
+  GtkWidget *vbox;
+  GtkWidget *widget;
+  GtkWidget *button;
+
+  vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 3);
+  widget = gtk_center_box_new ();
+  gtk_widget_set_margin_top (widget, 10);
+  gtk_widget_set_margin_bottom (widget, 10);
+  gtk_widget_set_margin_start (widget, 20);
+  gtk_widget_set_margin_end (widget, 20);
+  gtk_widget_set_halign (widget, GTK_ALIGN_FILL);
+  gtk_widget_set_valign (widget, GTK_ALIGN_CENTER);
+
+  button = gtk_button_new ();
+  gtk_widget_add_css_class (button, "small");
+  gtk_widget_set_halign (button, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (button, GTK_ALIGN_CENTER);
+  gtk_center_box_set_start_widget (GTK_CENTER_BOX (widget), button);
+
+  button = gtk_button_new ();
+  gtk_widget_add_css_class (button, "small");
+  gtk_widget_set_halign (button, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (button, GTK_ALIGN_CENTER);
+  gtk_center_box_set_center_widget (GTK_CENTER_BOX (widget), button);
+
+  button = gtk_button_new ();
+  gtk_widget_add_css_class (button, "small");
+  gtk_widget_set_halign (button, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (button, GTK_ALIGN_CENTER);
+  gtk_center_box_set_end_widget (GTK_CENTER_BOX (widget), button);
+
+  gtk_box_append (GTK_BOX (vbox), widget);
+  gtk_box_append (GTK_BOX (vbox), g_object_new (GTK_TYPE_LABEL,
+                                                "label", "Center Box",
+                                                "justify", GTK_JUSTIFY_CENTER,
+                                                NULL));
+  add_margin (vbox);
+
+  return new_widget_info ("centerbox", vbox, SMALL);
+}
+
+static WidgetInfo *
+create_grid (void)
+{
+  GtkWidget *vbox;
+  GtkWidget *widget;
+  GtkWidget *button;
+
+  vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 3);
+  widget = gtk_grid_new ();
+  gtk_grid_set_row_spacing (GTK_GRID (widget), 4);
+  gtk_grid_set_column_spacing (GTK_GRID (widget), 4);
+  gtk_widget_set_margin_top (widget, 20);
+  gtk_widget_set_margin_bottom (widget, 20);
+  gtk_widget_set_margin_start (widget, 20);
+  gtk_widget_set_margin_end (widget, 20);
+  gtk_widget_set_halign (widget, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (widget, GTK_ALIGN_CENTER);
+
+  button = gtk_button_new ();
+  gtk_widget_add_css_class (button, "small");
+  gtk_widget_set_halign (button, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (button, GTK_ALIGN_CENTER);
+  gtk_grid_attach (GTK_GRID (widget), button, 0, 0, 1, 1);
+
+  button = gtk_button_new ();
+  gtk_widget_add_css_class (button, "small");
+  gtk_widget_set_halign (button, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (button, GTK_ALIGN_CENTER);
+  gtk_grid_attach (GTK_GRID (widget), button, 0, 1, 1, 1);
+
+  button = gtk_button_new ();
+  gtk_widget_add_css_class (button, "small");
+  gtk_widget_set_halign (button, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (button, GTK_ALIGN_CENTER);
+  gtk_grid_attach (GTK_GRID (widget), button, 1, 0, 1, 1);
+
+  button = gtk_button_new ();
+  gtk_widget_add_css_class (button, "small");
+  gtk_widget_set_halign (button, GTK_ALIGN_CENTER);
+  gtk_widget_set_valign (button, GTK_ALIGN_CENTER);
+  gtk_grid_attach (GTK_GRID (widget), button, 1, 1, 1, 1);
+
+  gtk_grid_attach (GTK_GRID (widget), gtk_label_new ("⋯"), 2, 0, 1, 1);
+  gtk_grid_attach (GTK_GRID (widget), gtk_label_new ("⋮"), 0, 2, 1, 1);
+
+  gtk_box_append (GTK_BOX (vbox), widget);
+  gtk_box_append (GTK_BOX (vbox), g_object_new (GTK_TYPE_LABEL,
+                                                "label", "Grid",
+                                                "justify", GTK_JUSTIFY_CENTER,
+                                                NULL));
+  add_margin (vbox);
+
+  return new_widget_info ("grid", vbox, MEDIUM);
+}
+
+static WidgetInfo *
+create_overlay (void)
+{
+  GtkWidget *vbox;
+  WidgetInfo *info;
+  GtkWidget *widget;
+  GtkWidget *overlay;
+  GtkWidget *label;
+  GtkWidget *child;
+
+  widget = gtk_frame_new (NULL);
+  overlay = gtk_overlay_new ();
+  gtk_widget_add_css_class (widget, "view");
+  label = gtk_label_new ("Content");
+  gtk_widget_set_vexpand (label, TRUE);
+  gtk_frame_set_child (GTK_FRAME (widget), overlay);
+  gtk_overlay_set_child (GTK_OVERLAY (overlay), label);
+
+  child = gtk_frame_new (NULL);
+  gtk_widget_add_css_class (child, "app-notification");
+  gtk_frame_set_child (GTK_FRAME (child), gtk_label_new ("Overlay"));
+  gtk_widget_set_valign (child, GTK_ALIGN_START);
+  gtk_widget_set_halign (child, GTK_ALIGN_CENTER);
+  gtk_overlay_add_overlay (GTK_OVERLAY (overlay), child);
+
+  vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 6);
+  gtk_widget_set_halign (widget, GTK_ALIGN_FILL);
+  gtk_widget_set_valign (widget, GTK_ALIGN_FILL);
+
+  gtk_box_append (GTK_BOX (vbox), widget);
+  gtk_box_append (GTK_BOX (vbox), gtk_label_new ("Overlay"));
+
+  add_margin (vbox);
+
+  info = new_widget_info ("overlay", vbox, MEDIUM);
 
   return info;
 }
@@ -1501,6 +2115,18 @@ GList *
 get_all_widgets (void)
 {
   GList *retval = NULL;
+  GtkCssProvider *provider;
+
+  provider = gtk_css_provider_new ();
+  gtk_css_provider_load_from_data (provider,
+                                   "button.small {\n"
+                                   "  min-width: 16px;\n"
+                                   "  min-height: 16px;\n"
+                                   "  padding: 0;\n"
+                                   "}", -1);
+  gtk_style_context_add_provider_for_display (gdk_display_get_default (),
+                                              GTK_STYLE_PROVIDER (provider),
+                                              800);
 
   retval = g_list_prepend (retval, create_search_bar ());
   retval = g_list_prepend (retval, create_action_bar ());
@@ -1562,6 +2188,19 @@ get_all_widgets (void)
   retval = g_list_prepend (retval, create_password_entry ());
   retval = g_list_prepend (retval, create_editable_label ());
   retval = g_list_prepend (retval, create_drop_down ());
+  retval = g_list_prepend (retval, create_window_controls ());
+  retval = g_list_prepend (retval, create_calendar ());
+  retval = g_list_prepend (retval, create_emojichooser ());
+  retval = g_list_prepend (retval, create_expander ());
+  retval = g_list_prepend (retval, create_menu_bar ());
+  retval = g_list_prepend (retval, create_popover ());
+  retval = g_list_prepend (retval, create_menu ());
+  retval = g_list_prepend (retval, create_shortcuts_window ());
+  retval = g_list_prepend (retval, create_drawing_area ());
+  retval = g_list_prepend (retval, create_box ());
+  retval = g_list_prepend (retval, create_center_box ());
+  retval = g_list_prepend (retval, create_grid ());
+  retval = g_list_prepend (retval, create_overlay ());
 
   return retval;
 }