From 1783704a53854bfeb830efe7262f1a38df0a6519 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mart=C3=ADn=20Capello?= <martin@igara.com>
Date: Wed, 7 Dec 2022 15:47:14 -0300
Subject: [PATCH] Fix positioning of text and icon layers to avoid setting
 values that are not a multiple of the gui scale

---
 data/extensions/aseprite-theme/theme.xml | 22 +++++++++---------
 src/ui/theme.cpp                         | 16 +++++++++----
 src/ui/theme.h                           |  3 +++
 src/ui/widget.cpp                        | 29 +++++++++++++++++-------
 4 files changed, 47 insertions(+), 23 deletions(-)

diff --git a/data/extensions/aseprite-theme/theme.xml b/data/extensions/aseprite-theme/theme.xml
index b84421616..e52307ee2 100644
--- a/data/extensions/aseprite-theme/theme.xml
+++ b/data/extensions/aseprite-theme/theme.xml
@@ -543,9 +543,9 @@
             <background-border part="button_hot" state="mouse" />
             <background-border part="button_selected" state="selected" />
             <icon part="warning_box" align="right" />
-            <text color="button_normal_text" align="left" />
-            <text color="button_hot_text" align="left" state="mouse" />
-            <text color="button_selected_text" align="left" state="selected" />
+            <text color="button_normal_text" align="left" y="1" />
+            <text color="button_hot_text" align="left" y="1" state="mouse" />
+            <text color="button_selected_text" align="left" y="1" state="selected" />
         </style>
         <style id="view" border="3" border-top="4">
             <background color="window_face" />
@@ -761,8 +761,8 @@
             <text color="tab_active_text" state="focus" />
         </style>
         <style id="tab_text">
-            <text color="tab_normal_text" align="left middle" x="4" y="1" />
-            <text color="tab_active_text" align="left middle" x="4" y="1" state="focus" />
+            <text color="tab_normal_text" align="left middle" x="4" y="2" />
+            <text color="tab_active_text" align="left middle" x="4" y="2" state="focus" />
         </style>
         <style id="tab_bottom">
             <background color="tab_active_face" state="focus" />
@@ -778,14 +778,14 @@
             <background part="tab_icon_bg_clicked" state="selected" />
         </style>
         <style id="tab_close_icon" extends="tab_icon">
-            <icon part="tab_close_icon_normal" align="left middle" x="3" />
-            <icon part="tab_close_icon_active" align="left middle" x="3" state="focus" />
-            <icon part="tab_close_icon_normal" align="left middle" x="3" state="selected" />
+            <icon part="tab_close_icon_normal" align="left middle" x="3" y="1" />
+            <icon part="tab_close_icon_active" align="left middle" x="3" y="1" state="focus" />
+            <icon part="tab_close_icon_normal" align="left middle" x="3" y="1" state="selected" />
         </style>
         <style id="tab_modified_icon" extends="tab_icon">
-            <icon part="tab_modified_icon_normal" align="left middle" x="3" />
-            <icon part="tab_modified_icon_active" align="left middle" x="3" state="focus" />
-            <icon part="tab_modified_icon_normal" align="left middle" x="3" state="selected" />
+            <icon part="tab_modified_icon_normal" align="left middle" x="3" y="1" />
+            <icon part="tab_modified_icon_active" align="left middle" x="3" y="1" state="focus" />
+            <icon part="tab_modified_icon_normal" align="left middle" x="3" y="1" state="selected" />
         </style>
         <style id="tab_home">
             <icon part="tab_home_icon_normal" align="left middle" x="4" y="1" />
diff --git a/src/ui/theme.cpp b/src/ui/theme.cpp
index 8388aefed..58ef9710f 100644
--- a/src/ui/theme.cpp
+++ b/src/ui/theme.cpp
@@ -455,15 +455,19 @@ void Theme::paintLayer(Graphics* g,
             pt.x = rc.x+padding.left();
           else if (layer.align() & RIGHT)
             pt.x = rc.x+rc.w-textSize.w-padding.right();
-          else
+          else {
             pt.x = rc.x+padding.left()+(rc.w-padding.width())/2-textSize.w/2;
+            ADJUST_TO_GUISCALE(pt.x);
+          }
 
           if (layer.align() & TOP)
             pt.y = rc.y+padding.top();
           else if (layer.align() & BOTTOM)
             pt.y = rc.y+rc.h-textSize.h-padding.bottom();
-          else
+          else {
             pt.y = rc.y+padding.top()+(rc.h-padding.height())/2-textSize.h/2;
+            ADJUST_TO_GUISCALE(pt.y);
+          }
 
           pt += layer.offset();
 
@@ -494,15 +498,19 @@ void Theme::paintLayer(Graphics* g,
           pt.x = rc.x+padding.left();
         else if (layer.align() & RIGHT)
           pt.x = rc.x+rc.w-iconSize.w-padding.right();
-        else
+        else {
           pt.x = rc.x+padding.left()+(rc.w-padding.width())/2-iconSize.w/2;
+          ADJUST_TO_GUISCALE(pt.x);
+        }
 
         if (layer.align() & TOP)
           pt.y = rc.y+padding.top();
         else if (layer.align() & BOTTOM)
           pt.y = rc.y+rc.h-iconSize.h-padding.bottom();
-        else
+        else {
           pt.y = rc.y+padding.top()+(rc.h-padding.height())/2-iconSize.h/2;
+          ADJUST_TO_GUISCALE(pt.y);
+        }
 
         pt += layer.offset();
 
diff --git a/src/ui/theme.h b/src/ui/theme.h
index d1260834f..33773a2a8 100644
--- a/src/ui/theme.h
+++ b/src/ui/theme.h
@@ -16,6 +16,9 @@
 #include "ui/base.h"
 #include "ui/cursor_type.h"
 #include "ui/style.h"
+#include "ui/scale.h"
+
+#define ADJUST_TO_GUISCALE(v) v -= (v % guiscale());
 
 namespace gfx {
   class Region;
diff --git a/src/ui/widget.cpp b/src/ui/widget.cpp
index e538b2807..a5baa8a91 100644
--- a/src/ui/widget.cpp
+++ b/src/ui/widget.cpp
@@ -968,15 +968,22 @@ void Widget::getTextIconInfo(
   // Box position
   if (align() & RIGHT)
     box_x = bounds.x2() - box_w - border().right();
-  else if (align() & CENTER)
-    box_x = (bounds.x+bounds.x2())/2 - box_w/2;
+  else if (align() & CENTER) {
+    box_x = (bounds.x + bounds.x2() - box_w) / 2;
+    // Adjust position when it is not a multiple of guiscale. Without these adjustements
+    // it could happen that an icon or text is displayed a in a fraction of a scaled pixel.
+    ADJUST_TO_GUISCALE(box_x);
+  }
   else
     box_x = bounds.x + border().left();
 
   if (align() & BOTTOM)
     box_y = bounds.y2() - box_h - border().bottom();
-  else if (align() & MIDDLE)
-    box_y = (bounds.y+bounds.y2())/2 - box_h/2;
+  else if (align() & MIDDLE) {
+    box_y = (bounds.y + bounds.y2() - box_h) / 2;
+    // Adjust position when it is not a multiple of guiscale
+    ADJUST_TO_GUISCALE(box_y);
+  }
   else
     box_y = bounds.y + border().top();
 
@@ -988,8 +995,11 @@ void Widget::getTextIconInfo(
       icon_x = box_x + box_w - icon_w;
     }
     else if (icon_align & CENTER) {
-      text_x = box_x + box_w/2 - text_w/2;
-      icon_x = box_x + box_w/2 - icon_w/2;
+      text_x = box_x + (box_w - text_w)/2;
+      icon_x = box_x + (box_w - icon_w)/2;
+      // Adjust position when it is not a multiple of guiscale
+      ADJUST_TO_GUISCALE(text_x);
+      ADJUST_TO_GUISCALE(icon_x);
     }
     else {
       text_x = box_x + box_w - text_w;
@@ -1002,8 +1012,11 @@ void Widget::getTextIconInfo(
       icon_y = box_y + box_h - icon_h;
     }
     else if (icon_align & MIDDLE) {
-      text_y = box_y + box_h/2 - text_h/2;
-      icon_y = box_y + box_h/2 - icon_h/2;
+      text_y = box_y + (box_h - text_h)/2;
+      icon_y = box_y + (box_h - icon_h)/2;
+      // Adjust position when it is not a multiple of guiscale
+      ADJUST_TO_GUISCALE(text_y);
+      ADJUST_TO_GUISCALE(icon_y);
     }
     else {
       text_y = box_y + box_h - text_h;