cssimage: Scale images to contain, not cover
authorBenjamin Otte <otte@redhat.com>
Fri, 13 Jan 2017 02:28:34 +0000 (03:28 +0100)
committerBenjamin Otte <otte@redhat.com>
Fri, 13 Jan 2017 02:39:49 +0000 (03:39 +0100)
Images with just an aspect ratio, but without a size, should be scaled
to be fully visible in the given area.
But we scaled them to completely cover the given area, which made them
partially invisible.

Reftest included.

gtk/gtkcssimage.c
testsuite/reftests/Makefile.am
testsuite/reftests/css-image-aspect-ratio.css [new file with mode: 0644]
testsuite/reftests/css-image-aspect-ratio.ref.ui [new file with mode: 0644]
testsuite/reftests/css-image-aspect-ratio.ui [new file with mode: 0644]

index 3b9ff41a41a84aa81b620f0df8c63f7f934a53a2..eebe013cea46d70613e5704e3ba438036ace0ef1 100644 (file)
@@ -307,13 +307,13 @@ _gtk_css_image_get_concrete_size (GtkCssImage *image,
         {
           if (image_aspect * default_height > default_width)
             {
-              *concrete_width = default_height * image_aspect;
-              *concrete_height = default_height;
+              *concrete_width = default_width;
+              *concrete_height = default_width / image_aspect;
             }
           else
             {
-              *concrete_width = default_width;
-              *concrete_height = default_width / image_aspect;
+              *concrete_width = default_height * image_aspect;
+              *concrete_height = default_height;
             }
         }
       else
index 37df3a9876e4f34baf41ae68346c8617f3ff2439..fa968e9105b7e23178630d8b000a464afa98ae07 100644 (file)
@@ -206,6 +206,9 @@ testdata = \
        css-currentcolor-alpha.css \
        css-currentcolor-alpha.ui \
        css-currentcolor-alpha.ref.ui \
+       css-image-aspect-ratio.css \
+       css-image-aspect-ratio.ui \
+       css-image-aspect-ratio.ref.ui \
        css-match-class.css \
        css-match-class.ref.ui \
        css-match-class.ui \
diff --git a/testsuite/reftests/css-image-aspect-ratio.css b/testsuite/reftests/css-image-aspect-ratio.css
new file mode 100644 (file)
index 0000000..da054da
--- /dev/null
@@ -0,0 +1,8 @@
+window {
+  background-image: -gtk-icontheme("edit-delete");
+  background-repeat: no-repeat;
+}
+
+#reference {
+  background-size: 24px 24px;
+}
diff --git a/testsuite/reftests/css-image-aspect-ratio.ref.ui b/testsuite/reftests/css-image-aspect-ratio.ref.ui
new file mode 100644 (file)
index 0000000..88fbd72
--- /dev/null
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<interface>
+  <!-- interface-requires gtk+ 3.0 -->
+  <object class="GtkWindow" id="window1">
+    <property name="width_request">48</property>
+    <property name="height_request">24</property>
+    <property name="can_focus">False</property>
+    <property name="type">popup</property>
+    <property name="name">reference</property>
+  </object>
+</interface>
diff --git a/testsuite/reftests/css-image-aspect-ratio.ui b/testsuite/reftests/css-image-aspect-ratio.ui
new file mode 100644 (file)
index 0000000..c7f5598
--- /dev/null
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<interface>
+  <!-- interface-requires gtk+ 3.0 -->
+  <object class="GtkWindow" id="window1">
+    <property name="width_request">48</property>
+    <property name="height_request">24</property>
+    <property name="can_focus">False</property>
+    <property name="type">popup</property>
+  </object>
+</interface>