From 0e958088238fc848dc9492b97751e4d1c738f6e8 Mon Sep 17 00:00:00 2001
From: Benjamin Otte <otte@redhat.com>
Date: Thu, 23 Sep 2021 05:31:07 +0200
Subject: [PATCH] widget-factory: Add gradient rendering test

Test how GTK draws gradients, by adding an sRGB and a linear colorspace
gradient and draw one with CSS.

Have a look which one (if any) matches.
---
 .../widget-factory/linear-gradient-color.png  | Bin 0 -> 213 bytes
 .../linear-gradient-monochrome.png            | Bin 0 -> 220 bytes
 demos/widget-factory/srgb-gradient-color.png  | Bin 0 -> 154 bytes
 .../srgb-gradient-monochrome.png              | Bin 0 -> 164 bytes
 demos/widget-factory/widget-factory.css       |   7 +
 .../widget-factory.gresource.xml              |   4 +
 demos/widget-factory/widget-factory.ui        | 166 +++++++++++++++++-
 7 files changed, 174 insertions(+), 3 deletions(-)
 create mode 100644 demos/widget-factory/linear-gradient-color.png
 create mode 100644 demos/widget-factory/linear-gradient-monochrome.png
 create mode 100644 demos/widget-factory/srgb-gradient-color.png
 create mode 100644 demos/widget-factory/srgb-gradient-monochrome.png

diff --git a/demos/widget-factory/linear-gradient-color.png b/demos/widget-factory/linear-gradient-color.png
new file mode 100644
index 0000000000000000000000000000000000000000..3e640faf66ca855c215e8384accc9ed18aff2614
GIT binary patch
literal 213
zcmV;`04o29P)<h;3K|Lk000e1NJLTq004jh000391^@s67Sg7+0001-Nkl<ZD9>$;
z!4ASO3`3t=1_*KB|GyH6!=#NQ9GY#J#G$eizqon^@p5<s+yidFHDC&uLQDkR$J_%t
zaM`>cyXL7e@|H|1ugBmTpu(%{n<r21BiYJD$%^V<<{+S1swZ1A`T16U{(I*Q*gCv$
ze!i2HIeW=_`PuKB9Xy_$Rx&Hy`LOIU(DzU_zk*hwC5B%>GcZGY10VPSO}BOc`j=Uw
P00000NkvXXu0mjfRK;4W

literal 0
HcmV?d00001

diff --git a/demos/widget-factory/linear-gradient-monochrome.png b/demos/widget-factory/linear-gradient-monochrome.png
new file mode 100644
index 0000000000000000000000000000000000000000..52d4fbc491a641e48ed9bfad139dbd9d5ef8bcfd
GIT binary patch
literal 220
zcmV<203-j2P)<h;3K|Lk000e1NJLTq004jh000391^@s67Sg7+0001^Nkl<ZD9?3{
z$!^3j3_~ADI}6YNGyngwGY2KM(V_=IG|ff2uAk5A_2xWJj^kk8H@0o3_fG4b-Wu(m
zB=>H#n6!oyT0(5>;Fu&6J0wQ-t@(dSBV=Q(yvF;%gOgE&9&BOhk4_e*wxr6E?(y)*
z#t50oOW=v6>fl#q=_y`DqP+6(%+8sQg;@V8O9oLnPadmgxwCpo2g0L!xp#PKBlrRw
W2?P6_6vv$a0000<MNUMnLSTYr8ewMu

literal 0
HcmV?d00001

diff --git a/demos/widget-factory/srgb-gradient-color.png b/demos/widget-factory/srgb-gradient-color.png
new file mode 100644
index 0000000000000000000000000000000000000000..0b815ade0f084d8b13803068834f6a38353bd664
GIT binary patch
literal 154
zcmeAS@N?(olHy`uVBq!ia0vp^4M5Du!3HG7E-l*zq!K+{978nD&+Yf-V^HLAiog9^
zKGKT2)I`l{J}b9EK$hAiR#~-<PW#IIEy2(ErU@+l$f7O48E3Y)d;7b>-kS4~r(IWm
zuep?d_UbPGm<L8Nm7fFd?tRxSGkc%XwfSH6pJo*|p4r5(mB%j*Xc>d2tDnm{r-UW|
D<_<Qx

literal 0
HcmV?d00001

diff --git a/demos/widget-factory/srgb-gradient-monochrome.png b/demos/widget-factory/srgb-gradient-monochrome.png
new file mode 100644
index 0000000000000000000000000000000000000000..7acbd918d741c6d6d3751bb53eebe52cd70616de
GIT binary patch
literal 164
zcmeAS@N?(olHy`uVBq!ia0vp^4M5Du!3HG7E-l*zq_RC-978nD&z<NfbXb9hdF$%`
z`*+&5uuQt-%_paPJ6V_EL*Qq<j&GMdtW0Lvy-J9x|CRJ+()qp9>neJ!X5CBs7UQ+y
zaz3YuQAAe7ravc-8q}OV_-M!F!gq%@)$h05ecAWvwf*kT-%WmfRKAY!r$6)W;L5Nb
PptTI1u6{1-oD!M<0un_s

literal 0
HcmV?d00001

diff --git a/demos/widget-factory/widget-factory.css b/demos/widget-factory/widget-factory.css
index cdf809a285..e9c63b4618 100644
--- a/demos/widget-factory/widget-factory.css
+++ b/demos/widget-factory/widget-factory.css
@@ -6,3 +6,10 @@
 .toolbar {
   -gtk-icon-style: symbolic;
 }
+
+.gtk-gradient-color {
+  background: linear-gradient(to right, lime, red);
+}
+.gtk-gradient-monochrome {
+  background: linear-gradient(to right, black, white);
+}
diff --git a/demos/widget-factory/widget-factory.gresource.xml b/demos/widget-factory/widget-factory.gresource.xml
index 8e2c88cb29..0b8429a5d8 100644
--- a/demos/widget-factory/widget-factory.gresource.xml
+++ b/demos/widget-factory/widget-factory.gresource.xml
@@ -117,5 +117,9 @@
     <file>portland-rose.jpg</file>
     <file>nyc.jpg</file>
     <file>beach.jpg</file>
+    <file>linear-gradient-color.png</file>
+    <file>linear-gradient-monochrome.png</file>
+    <file>srgb-gradient-color.png</file>
+    <file>srgb-gradient-monochrome.png</file>
   </gresource>
 </gresources>
diff --git a/demos/widget-factory/widget-factory.ui b/demos/widget-factory/widget-factory.ui
index 1d4fc54a32..67814df299 100644
--- a/demos/widget-factory/widget-factory.ui
+++ b/demos/widget-factory/widget-factory.ui
@@ -1344,13 +1344,173 @@ Suspendisse feugiat quam quis dolor accumsan cursus.</property>
                             <child>
                               <object class="GtkNotebookPage">
                                 <property name="child">
-                                  <object class="GtkBox" id="box8">
-                                    <property name="orientation">1</property>
+                                  <object class="GtkGrid">
+                                    <property name="hexpand">0</property>
+                                    <property name="row-spacing">6</property>
+                                    <property name="column-spacing">6</property>
+                                    <property name="margin-start">6</property>
+                                    <property name="margin-end">6</property>
+                                    <property name="margin-top">6</property>
+                                    <property name="margin-bottom">6</property>
+                                    <property name="row-homogeneous">1</property>
+                                    <property name="valign">start</property>
+                                    <child>
+                                      <object class="GtkLabel">
+                                        <property name="label" translatable="yes">color</property>
+                                        <style>
+                                          <class name="caption-heading"/>
+                                        </style>
+                                        <layout>
+                                          <property name="column">0</property>
+                                          <property name="row">0</property>
+                                          <property name="column-span">2</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkLabel">
+                                        <property name="label">sRGB</property>
+                                        <layout>
+                                          <property name="column">0</property>
+                                          <property name="row">1</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkPicture">
+                                        <property name="file">resource:///org/gtk/WidgetFactory4/srgb-gradient-color.png</property>
+                                        <property name="can-shrink">0</property>
+                                        <property name="keep-aspect-ratio">0</property>
+                                        <property name="hexpand">1</property>
+                                        <layout>
+                                          <property name="column">1</property>
+                                          <property name="row">1</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkLabel">
+                                        <property name="label">GTK</property>
+                                        <layout>
+                                          <property name="column">0</property>
+                                          <property name="row">2</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkPicture">
+                                        <property name="width-request">128</property>
+                                        <property name="keep-aspect-ratio">0</property>
+                                        <style>
+                                          <class name="gtk-gradient-color"/>
+                                        </style>
+                                        <layout>
+                                          <property name="column">1</property>
+                                          <property name="row">2</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkLabel">
+                                        <property name="label">linear</property>
+                                        <layout>
+                                          <property name="column">0</property>
+                                          <property name="row">3</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkPicture">
+                                        <property name="file">resource:///org/gtk/WidgetFactory4/linear-gradient-color.png</property>
+                                        <property name="can-shrink">0</property>
+                                        <property name="keep-aspect-ratio">0</property>
+                                        <layout>
+                                          <property name="column">1</property>
+                                          <property name="row">3</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkLabel">
+                                        <property name="label" translatable="yes">monochrome</property>
+                                        <style>
+                                          <class name="caption-heading"/>
+                                        </style>
+                                        <layout>
+                                          <property name="column">0</property>
+                                          <property name="row">4</property>
+                                          <property name="column-span">2</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkLabel">
+                                        <property name="label">sRGB</property>
+                                        <layout>
+                                          <property name="column">0</property>
+                                          <property name="row">5</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkPicture">
+                                        <property name="file">resource:///org/gtk/WidgetFactory4/srgb-gradient-monochrome.png</property>
+                                        <property name="can-shrink">0</property>
+                                        <property name="keep-aspect-ratio">0</property>
+                                        <property name="hexpand">1</property>
+                                        <layout>
+                                          <property name="column">1</property>
+                                          <property name="row">5</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkLabel">
+                                        <property name="label">GTK</property>
+                                        <layout>
+                                          <property name="column">0</property>
+                                          <property name="row">6</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkPicture">
+                                        <property name="width-request">128</property>
+                                        <property name="keep-aspect-ratio">0</property>
+                                        <style>
+                                          <class name="gtk-gradient-monochrome"/>
+                                        </style>
+                                        <layout>
+                                          <property name="column">1</property>
+                                          <property name="row">6</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkLabel">
+                                        <property name="label">linear</property>
+                                        <layout>
+                                          <property name="column">0</property>
+                                          <property name="row">7</property>
+                                        </layout>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkPicture">
+                                        <property name="file">resource:///org/gtk/WidgetFactory4/linear-gradient-monochrome.png</property>
+                                        <property name="can-shrink">0</property>
+                                        <property name="keep-aspect-ratio">0</property>
+                                        <layout>
+                                          <property name="column">1</property>
+                                          <property name="row">7</property>
+                                        </layout>
+                                      </object>
+                                    </child>
                                   </object>
                                 </property>
                                 <property name="tab">
                                   <object class="GtkLabel" id="label8">
-                                    <property name="label" translatable="1">page 1</property>
+                                    <property name="label" translatable="1">Gradients</property>
                                   </object>
                                 </property>
                               </object>