Use GSK for drawing custom widget

Fixes #3

data/rugby.css

-/*
- * SPDX-FileCopyrightText: 2012-2020 Bruce Cowan <bruce@bcowan.me.uk>
- * SPDX-License-Identifier: GPL-3.0-or-later
- */
-
-.possibility.score-block
-{
-    border-radius: 15px;
-}
-
-.possibility.score-block.try
-{
-    /* Chameleon */
-    background-image: linear-gradient(to top,
-                                      #4e9a06,
-                                      #73d216);
-}
-
-.possibility.score-block.utry
-{
-    /* Scarlet red */
-    background-image: linear-gradient(to top,
-                                      #a40000,
-                                      #cc0000);
-}
-
-.possibility.score-block.kick
-{
-    /* Butter */
-    background-image: linear-gradient(to top,
-                                      #c4a000,
-                                      #edd400);
-}

data/rugby.gresource.xml

@@ -8,6 +8,5 @@
   <gresource prefix="/uk/me/bcowan/rugby">
     <file preprocess="xml-stripblanks" compressed="true">interface.ui</file>
     <file preprocess="xml-stripblanks" compressed="true">prefs.ui</file>
-    <file compressed="true">rugby.css</file>
   </gresource>
 </gresources>

src/main.c

@@ -67,14 +67,6 @@ on_startup (GApplication          *app,
                                      app_entries,
                                      G_N_ELEMENTS (app_entries),
                                      app);
-
-    // CSS styling
-    g_autoptr (GtkCssProvider) provider = gtk_css_provider_new ();
-    gtk_css_provider_load_from_resource (provider, "/uk/me/bcowan/rugby/rugby.css");
-
-    gtk_style_context_add_provider_for_display (gdk_display_get_default (),
-                                                GTK_STYLE_PROVIDER (provider),
-                                                GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
 }
 
 int

src/rugby-possibility-widget.c

@@ -11,13 +11,13 @@
 
 struct _RugbyPossibilityWidget
 {
-    GtkDrawingArea parent_instance;
+    GtkWidget parent_instance;
 
     GSettings *settings;
     RugbyPossibility *possibility;
 };
 
-G_DEFINE_TYPE (RugbyPossibilityWidget, rugby_possibility_widget, GTK_TYPE_DRAWING_AREA)
+G_DEFINE_TYPE (RugbyPossibilityWidget, rugby_possibility_widget, GTK_TYPE_WIDGET)
 
 enum
 {
@@ -76,40 +76,49 @@ rugby_possibility_widget_set_property (GObject      *object,
 }
 
 static void
-render_bar (cairo_t         *cr,
-            GtkStyleContext *context,
-            double           x,
-            double           y,
-            double           w,
-            double           h,
-            const char      *style)
+render_bar (GtkSnapshot        *snapshot,
+            double              x,
+            double              y,
+            double              w,
+            double              h,
+            const GskColorStop *stops)
 {
-    gtk_style_context_save (context);
-    gtk_style_context_add_class (context, style);
-    gtk_render_background (context, cr, x, y, w, h);
-    gtk_style_context_restore (context);
+    GskRoundedRect rounded;
+    gsk_rounded_rect_init_from_rect (&rounded,
+                                     &GRAPHENE_RECT_INIT (x, y, w, h),
+                                     h / 2.0);
+
+    gtk_snapshot_push_rounded_clip (snapshot, &rounded);
+    gtk_snapshot_append_linear_gradient (snapshot,
+                                         &GRAPHENE_RECT_INIT (x, y, w, h),
+                                         &GRAPHENE_POINT_INIT (0, 0),
+                                         &GRAPHENE_POINT_INIT (0, h),
+                                         stops,
+                                         2);
+    gtk_snapshot_pop (snapshot);
+
+    GdkRGBA black = { 0.0, 0.0, 0.0, 1.0 };
+    gtk_snapshot_append_border (snapshot,
+                                &rounded,
+                                (float[]) { 2., 2., 2., 2. },
+                                (GdkRGBA[]) { black, black, black, black });
 }
 
 static void
-draw_func (GtkDrawingArea        *drawing_area,
-           cairo_t               *cr,
-           int                    width,
-           int                    height,
-           G_GNUC_UNUSED gpointer user_data)
+rugby_possibility_widget_snapshot (GtkWidget   *widget,
+                                   GtkSnapshot *snapshot)
 {
-    RugbyPossibilityWidget *self = RUGBY_POSSIBILITY_WIDGET (drawing_area);
+    RugbyPossibilityWidget *self = RUGBY_POSSIBILITY_WIDGET (widget);
 
-    GtkStyleContext *context = gtk_widget_get_style_context (GTK_WIDGET (drawing_area));
-    gtk_widget_add_css_class (GTK_WIDGET (drawing_area), "possibility");
-
-    double x = 0.0;
-    gtk_render_background (context, cr, x, 0.0, width, height);
     int try_points = g_settings_get_int (self->settings, "try-points");
     int utry_points = g_settings_get_int (self->settings, "utry-points");
     int kick_points = g_settings_get_int (self->settings, "kick-points");
 
-    int tries, utries, kicks;
+    int width = gtk_widget_get_width (widget);
+    int height = gtk_widget_get_height (widget);
+    double x = 0.0;
 
+    int tries, utries, kicks;
     g_object_get (self->possibility,
                   "tries", &tries,
                   "utries", &utries,
@@ -117,13 +126,29 @@ draw_func (GtkDrawingArea        *drawing_area,
                   NULL);
     int score = tries * try_points + utries * utry_points + kicks * kick_points;
 
-    gtk_widget_add_css_class (GTK_WIDGET (drawing_area), "score-block");
+    // Green
+    const GskColorStop green_stops[] = {
+        { 0.0, { 0.15, 0.64, 0.41, 1.0 } },
+        { 1.0, { 0.56, 0.94, 0.64, 1.0 } },
+    };
+
+    // Red
+    const GskColorStop red_stops[] = {
+        { 0.0, { 0.65, 0.11, 0.18, 1.0 } },
+        { 1.0, { 0.97, 0.38, 0.32, 1.0 } },
+    };
+
+    // Yellow
+    const GskColorStop yellow_stops[] = {
+        { 0.0, { 0.90, 0.65, 0.04, 1.0 } },
+        { 1.0, { 0.98, 0.94, 0.42, 1.0 } },
+    };
 
     // Tries
     double w = width / (score / (double) try_points);
     for (int i = 0; i < tries; i++)
     {
-        render_bar (cr, context, x, 0.0, w, height, "try");
+        render_bar (snapshot, x, 0.0, w, height, green_stops);
         x += w;
     }
 
@@ -131,7 +156,7 @@ draw_func (GtkDrawingArea        *drawing_area,
     w = width / (score / (double) utry_points);
     for (int i = 0; i < utries; i++)
     {
-        render_bar (cr, context, x, 0.0, w, height, "utry");
+        render_bar (snapshot, x, 0.0, w, height, red_stops);
         x += w;
     }
 
@@ -139,7 +164,7 @@ draw_func (GtkDrawingArea        *drawing_area,
     w = width / (score / (double) kick_points);
     for (int i = 0; i < kicks; i++)
     {
-        render_bar (cr, context, x, 0.0, w, height, "kick");
+        render_bar (snapshot, x, 0.0, w, height, yellow_stops);
         x += w;
     }
 }
@@ -189,17 +214,21 @@ static void
 rugby_possibility_widget_class_init (RugbyPossibilityWidgetClass *klass)
 {
     GObjectClass *object_class = G_OBJECT_CLASS (klass);
+    GtkWidgetClass *widget_class = GTK_WIDGET_CLASS (klass);
 
     object_class->constructed = rugby_possibility_widget_constructed;
     object_class->dispose = rugby_possibility_widget_dispose;
     object_class->get_property = rugby_possibility_widget_get_property;
     object_class->set_property = rugby_possibility_widget_set_property;
 
-    properties[PROP_POSSIBILITY] = g_param_spec_object ("possibility",
-                                                        "Possibility",
-                                                        "Possibility to be represented",
-                                                        RUGBY_TYPE_POSSIBILITY,
-                                                        G_PARAM_READWRITE | G_PARAM_CONSTRUCT_ONLY);
+    widget_class->snapshot = rugby_possibility_widget_snapshot;
+
+    properties[PROP_POSSIBILITY] =
+        g_param_spec_object ("possibility",
+                             "Possibility",
+                             "Possibility to be represented",
+                             RUGBY_TYPE_POSSIBILITY,
+                             G_PARAM_READWRITE | G_PARAM_CONSTRUCT_ONLY);
 
     g_object_class_install_properties (object_class,
                                        N_PROPS,
@@ -209,9 +238,6 @@ rugby_possibility_widget_class_init (RugbyPossibilityWidgetClass *klass)
 static void
 rugby_possibility_widget_init (RugbyPossibilityWidget *self)
 {
-    gtk_drawing_area_set_draw_func (GTK_DRAWING_AREA (self),
-                                    draw_func, NULL, NULL);
-
     self->settings = g_settings_new ("uk.me.bcowan.Rugby");
 }
 

src/rugby-possibility-widget.h

 /*
- * SPDX-FileCopyrightText: 2018 Bruce Cowan <bruce@bcowan.me.uk>
+ * SPDX-FileCopyrightText: 2018-2021 Bruce Cowan <bruce@bcowan.me.uk>
+ *
  * SPDX-License-Identifier: GPL-3.0-or-later
  */
 
@@ -13,7 +14,7 @@ G_BEGIN_DECLS
 
 #define RUGBY_TYPE_POSSIBILITY_WIDGET (rugby_possibility_widget_get_type())
 
-G_DECLARE_FINAL_TYPE (RugbyPossibilityWidget, rugby_possibility_widget, RUGBY, POSSIBILITY_WIDGET, GtkDrawingArea)
+G_DECLARE_FINAL_TYPE (RugbyPossibilityWidget, rugby_possibility_widget, RUGBY, POSSIBILITY_WIDGET, GtkWidget)
 
 GtkWidget * rugby_possibility_widget_new (RugbyPossibility *possibility);