gtk-demo: Improve the font rendering demobetter-font-rendering-demo

Should outlines as well.

2 files changed, 68 insertions, 16 deletions

diff --git a/demos/gtk-demo/fontrendering.c b/demos/gtk-demo/fontrendering.c
index 749d067663..1dc0f03f69 100644
--- a/demos/gtk-demo/fontrendering.c
+++ b/demos/gtk-demo/fontrendering.c
@@ -17,10 +17,11 @@ static GtkWidget *down_button = NULL;
 static GtkWidget *text_radio = NULL;
 static GtkWidget *show_grid = NULL;
 static GtkWidget *show_extents = NULL;
+static GtkWidget *outline_alpha = NULL;
 
 static PangoContext *context;
 
-static int scale = 9;
+static int scale = 7;
 
 static void
 update_image (void)
@@ -39,6 +40,7 @@ update_image (void)
   cairo_hint_style_t hintstyle;
   cairo_hint_metrics_t hintmetrics;
   cairo_antialias_t antialias;
+  cairo_path_t *path;
 
   if (!context)
     context = gtk_widget_create_pango_context (image);
@@ -94,10 +96,14 @@ update_image (void)
       cairo_set_source_rgb (cr, 1, 1, 1);
       cairo_paint (cr);
 
-      cairo_set_source_rgb (cr, 0, 0, 0);
+      cairo_set_source_rgba (cr, 0, 0, 0, 1.0 - gtk_range_get_value (GTK_RANGE (outline_alpha)) / 100.0);
+
       cairo_move_to (cr, 10, 10);
       pango_cairo_show_layout (cr, layout);
 
+      pango_cairo_layout_path (cr, layout);
+      path = cairo_copy_path (cr);
+
       cairo_destroy (cr);
       g_object_unref (layout);
 
@@ -136,7 +142,7 @@ update_image (void)
 
       if (gtk_check_button_get_active (GTK_CHECK_BUTTON (show_extents)))
         {
-          cairo_set_source_rgba (cr, 0, 0, 1, 1);
+          cairo_set_source_rgb (cr, 0, 0, 1);
 
           cairo_rectangle (cr,
                            scale * (10 + pango_units_to_double (logical.x)) - 0.5,
@@ -149,7 +155,7 @@ update_image (void)
           cairo_line_to (cr, scale * (10 + pango_units_to_double (logical.x + logical.width)) + 1,
                              scale * (10 + pango_units_to_double (baseline)) - 0.5);
           cairo_stroke (cr);
-          cairo_set_source_rgba (cr, 1, 0, 0, 1);
+          cairo_set_source_rgb (cr, 1, 0, 0);
           cairo_rectangle (cr,
                            scale * (10 + pango_units_to_double (pink.x)) + 0.5,
                            scale * (10 + pango_units_to_double (pink.y)) + 0.5,
@@ -158,8 +164,36 @@ update_image (void)
           cairo_stroke (cr);
         }
 
+      for (int i = 0; i < path->num_data; i += path->data[i].header.length)
+        {
+          cairo_path_data_t *data = &path->data[i];
+          switch (data->header.type)
+            {
+            case CAIRO_PATH_CURVE_TO:
+              data[3].point.x *= scale; data[3].point.y *= scale;
+              data[2].point.x *= scale; data[2].point.y *= scale;
+              data[1].point.x *= scale; data[1].point.y *= scale;
+              break;
+            case CAIRO_PATH_LINE_TO:
+            case CAIRO_PATH_MOVE_TO:
+              data[1].point.x *= scale; data[1].point.y *= scale;
+              break;
+            case CAIRO_PATH_CLOSE_PATH:
+              break;
+            default:
+              g_assert_not_reached ();
+            }
+        }
+
+      cairo_set_source_rgba (cr, 0, 0, 0, gtk_range_get_value (GTK_RANGE (outline_alpha)) / 100.0);
+      cairo_move_to (cr, scale * 20 - 0.5, scale * 20 - 0.5);
+      cairo_append_path (cr, path);
+      cairo_stroke (cr);
+
       cairo_surface_destroy (surface);
       cairo_destroy (cr);
+
+      cairo_path_destroy (path);
     }
   else
     {
@@ -281,6 +315,7 @@ do_fontrendering (GtkWidget *do_widget)
       text_radio = GTK_WIDGET (gtk_builder_get_object (builder, "text_radio"));
       show_grid = GTK_WIDGET (gtk_builder_get_object (builder, "show_grid"));
       show_extents = GTK_WIDGET (gtk_builder_get_object (builder, "show_extents"));
+      outline_alpha = GTK_WIDGET (gtk_builder_get_object (builder, "outline_alpha"));
 
       g_signal_connect (up_button, "clicked", G_CALLBACK (scale_up), NULL);
       g_signal_connect (down_button, "clicked", G_CALLBACK (scale_down), NULL);
@@ -292,6 +327,7 @@ do_fontrendering (GtkWidget *do_widget)
       g_signal_connect (text_radio, "notify::active", G_CALLBACK (update_image), NULL);
       g_signal_connect (show_grid, "notify::active", G_CALLBACK (update_image), NULL);
       g_signal_connect (show_extents, "notify::active", G_CALLBACK (update_image), NULL);
+      g_signal_connect (outline_alpha, "value-changed", G_CALLBACK (update_image), NULL);
 
       update_image ();
 
diff --git a/demos/gtk-demo/fontrendering.ui b/demos/gtk-demo/fontrendering.ui
index 9008440f28..833c6f5822 100644
--- a/demos/gtk-demo/fontrendering.ui
+++ b/demos/gtk-demo/fontrendering.ui
@@ -6,8 +6,8 @@
     <property name="page-increment">4</property>
   </object>
   <object class="GtkWindow" id="window">
-    <property name="default-width">1080</property>
-    <property name="default-height">430</property>
+    <property name="default-width">1024</property>
+    <property name="default-height">768</property>
     <child type="titlebar">
       <object class="GtkHeaderBar">
         <child type="title">
@@ -99,16 +99,6 @@
               </object>
             </child>
             <child>
-              <object class="GtkCheckButton" id="antialias">
-                <property name="label">Antialias</property>
-                <property name="active">1</property>
-                <layout>
-                  <property name="column">3</property>
-                  <property name="row">1</property>
-                </layout>
-              </object>
-            </child>
-            <child>
               <object class="GtkComboBoxText" id="hinting">
                 <property name="active">0</property>
                 <property name="valign">center</property>
@@ -133,6 +123,16 @@
               </object>
             </child>
             <child>
+              <object class="GtkCheckButton" id="antialias">
+                <property name="label">Antialias</property>
+                <property name="active">1</property>
+                <layout>
+                  <property name="column">4</property>
+                  <property name="row">2</property>
+                </layout>
+              </object>
+            </child>
+            <child>
               <object class="GtkCheckButton" id="show_extents">
                 <property name="label">Show Extents</property>
                 <layout>
@@ -151,6 +151,22 @@
               </object>
             </child>
             <child>
+              <object class="GtkScale" id="outline_alpha">
+                <property name="orientation">horizontal</property>
+                <property name="adjustment">
+                  <object class="GtkAdjustment">
+                    <property name="lower">0</property>
+                    <property name="upper">100</property>
+                    <property name="value">0</property>
+                  </object>
+                </property>
+                <layout>
+                  <property name="column">5</property>
+                  <property name="row">2</property>
+                </layout>
+              </object>
+            </child>
+            <child>
               <object class="GtkButton" id="up_button">
                 <property name="icon-name">list-add-symbolic</property>
                 <style>