[gtk/wip/otte/color-profiles: 52/82] widget-factory: Add gradient rendering test




commit 3b6ce78400138ad6dc91f647af035a5a8bc0046c
Author: Benjamin Otte <otte redhat com>
Date:   Thu Sep 23 05:31:07 2021 +0200

    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.

 demos/widget-factory/linear-gradient-color.png     | Bin 0 -> 213 bytes
 .../widget-factory/linear-gradient-monochrome.png  | Bin 0 -> 220 bytes
 demos/widget-factory/srgb-gradient-color.png       | Bin 0 -> 154 bytes
 demos/widget-factory/srgb-gradient-monochrome.png  | Bin 0 -> 164 bytes
 demos/widget-factory/widget-factory.css            |   7 +
 demos/widget-factory/widget-factory.gresource.xml  |   4 +
 demos/widget-factory/widget-factory.ui             | 166 ++++++++++++++++++++-
 7 files changed, 174 insertions(+), 3 deletions(-)
---
diff --git a/demos/widget-factory/linear-gradient-color.png b/demos/widget-factory/linear-gradient-color.png
new file mode 100644
index 0000000000..3e640faf66
Binary files /dev/null and b/demos/widget-factory/linear-gradient-color.png differ
diff --git a/demos/widget-factory/linear-gradient-monochrome.png 
b/demos/widget-factory/linear-gradient-monochrome.png
new file mode 100644
index 0000000000..52d4fbc491
Binary files /dev/null and b/demos/widget-factory/linear-gradient-monochrome.png differ
diff --git a/demos/widget-factory/srgb-gradient-color.png b/demos/widget-factory/srgb-gradient-color.png
new file mode 100644
index 0000000000..0b815ade0f
Binary files /dev/null and b/demos/widget-factory/srgb-gradient-color.png differ
diff --git a/demos/widget-factory/srgb-gradient-monochrome.png 
b/demos/widget-factory/srgb-gradient-monochrome.png
new file mode 100644
index 0000000000..7acbd918d7
Binary files /dev/null and b/demos/widget-factory/srgb-gradient-monochrome.png differ
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 2af832c00f..dca1b43e68 100644
--- a/demos/widget-factory/widget-factory.gresource.xml
+++ b/demos/widget-factory/widget-factory.gresource.xml
@@ -118,5 +118,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 7c190d08cb..2d11bc806c 100644
--- a/demos/widget-factory/widget-factory.ui
+++ b/demos/widget-factory/widget-factory.ui
@@ -1342,13 +1342,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>


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]