Fix positioning of text and icon layers to avoid setting values that are not a multiple of the gui scale

This commit is contained in:
Martín Capello 2022-12-07 15:47:14 -03:00 committed by David Capello
parent d3f01ebe17
commit 1783704a53
4 changed files with 47 additions and 23 deletions

View File

@ -543,9 +543,9 @@
<background-border part="button_hot" state="mouse" /> <background-border part="button_hot" state="mouse" />
<background-border part="button_selected" state="selected" /> <background-border part="button_selected" state="selected" />
<icon part="warning_box" align="right" /> <icon part="warning_box" align="right" />
<text color="button_normal_text" align="left" /> <text color="button_normal_text" align="left" y="1" />
<text color="button_hot_text" align="left" state="mouse" /> <text color="button_hot_text" align="left" y="1" state="mouse" />
<text color="button_selected_text" align="left" state="selected" /> <text color="button_selected_text" align="left" y="1" state="selected" />
</style> </style>
<style id="view" border="3" border-top="4"> <style id="view" border="3" border-top="4">
<background color="window_face" /> <background color="window_face" />
@ -761,8 +761,8 @@
<text color="tab_active_text" state="focus" /> <text color="tab_active_text" state="focus" />
</style> </style>
<style id="tab_text"> <style id="tab_text">
<text color="tab_normal_text" align="left middle" x="4" y="1" /> <text color="tab_normal_text" align="left middle" x="4" y="2" />
<text color="tab_active_text" align="left middle" x="4" y="1" state="focus" /> <text color="tab_active_text" align="left middle" x="4" y="2" state="focus" />
</style> </style>
<style id="tab_bottom"> <style id="tab_bottom">
<background color="tab_active_face" state="focus" /> <background color="tab_active_face" state="focus" />
@ -778,14 +778,14 @@
<background part="tab_icon_bg_clicked" state="selected" /> <background part="tab_icon_bg_clicked" state="selected" />
</style> </style>
<style id="tab_close_icon" extends="tab_icon"> <style id="tab_close_icon" extends="tab_icon">
<icon part="tab_close_icon_normal" align="left middle" x="3" /> <icon part="tab_close_icon_normal" align="left middle" x="3" y="1" />
<icon part="tab_close_icon_active" align="left middle" x="3" state="focus" /> <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" state="selected" /> <icon part="tab_close_icon_normal" align="left middle" x="3" y="1" state="selected" />
</style> </style>
<style id="tab_modified_icon" extends="tab_icon"> <style id="tab_modified_icon" extends="tab_icon">
<icon part="tab_modified_icon_normal" align="left middle" x="3" /> <icon part="tab_modified_icon_normal" align="left middle" x="3" y="1" />
<icon part="tab_modified_icon_active" align="left middle" x="3" state="focus" /> <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" state="selected" /> <icon part="tab_modified_icon_normal" align="left middle" x="3" y="1" state="selected" />
</style> </style>
<style id="tab_home"> <style id="tab_home">
<icon part="tab_home_icon_normal" align="left middle" x="4" y="1" /> <icon part="tab_home_icon_normal" align="left middle" x="4" y="1" />

View File

@ -455,15 +455,19 @@ void Theme::paintLayer(Graphics* g,
pt.x = rc.x+padding.left(); pt.x = rc.x+padding.left();
else if (layer.align() & RIGHT) else if (layer.align() & RIGHT)
pt.x = rc.x+rc.w-textSize.w-padding.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; pt.x = rc.x+padding.left()+(rc.w-padding.width())/2-textSize.w/2;
ADJUST_TO_GUISCALE(pt.x);
}
if (layer.align() & TOP) if (layer.align() & TOP)
pt.y = rc.y+padding.top(); pt.y = rc.y+padding.top();
else if (layer.align() & BOTTOM) else if (layer.align() & BOTTOM)
pt.y = rc.y+rc.h-textSize.h-padding.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; pt.y = rc.y+padding.top()+(rc.h-padding.height())/2-textSize.h/2;
ADJUST_TO_GUISCALE(pt.y);
}
pt += layer.offset(); pt += layer.offset();
@ -494,15 +498,19 @@ void Theme::paintLayer(Graphics* g,
pt.x = rc.x+padding.left(); pt.x = rc.x+padding.left();
else if (layer.align() & RIGHT) else if (layer.align() & RIGHT)
pt.x = rc.x+rc.w-iconSize.w-padding.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; pt.x = rc.x+padding.left()+(rc.w-padding.width())/2-iconSize.w/2;
ADJUST_TO_GUISCALE(pt.x);
}
if (layer.align() & TOP) if (layer.align() & TOP)
pt.y = rc.y+padding.top(); pt.y = rc.y+padding.top();
else if (layer.align() & BOTTOM) else if (layer.align() & BOTTOM)
pt.y = rc.y+rc.h-iconSize.h-padding.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; pt.y = rc.y+padding.top()+(rc.h-padding.height())/2-iconSize.h/2;
ADJUST_TO_GUISCALE(pt.y);
}
pt += layer.offset(); pt += layer.offset();

View File

@ -16,6 +16,9 @@
#include "ui/base.h" #include "ui/base.h"
#include "ui/cursor_type.h" #include "ui/cursor_type.h"
#include "ui/style.h" #include "ui/style.h"
#include "ui/scale.h"
#define ADJUST_TO_GUISCALE(v) v -= (v % guiscale());
namespace gfx { namespace gfx {
class Region; class Region;

View File

@ -968,15 +968,22 @@ void Widget::getTextIconInfo(
// Box position // Box position
if (align() & RIGHT) if (align() & RIGHT)
box_x = bounds.x2() - box_w - border().right(); box_x = bounds.x2() - box_w - border().right();
else if (align() & CENTER) else if (align() & CENTER) {
box_x = (bounds.x+bounds.x2())/2 - box_w/2; 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 else
box_x = bounds.x + border().left(); box_x = bounds.x + border().left();
if (align() & BOTTOM) if (align() & BOTTOM)
box_y = bounds.y2() - box_h - border().bottom(); box_y = bounds.y2() - box_h - border().bottom();
else if (align() & MIDDLE) else if (align() & MIDDLE) {
box_y = (bounds.y+bounds.y2())/2 - box_h/2; 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 else
box_y = bounds.y + border().top(); box_y = bounds.y + border().top();
@ -988,8 +995,11 @@ void Widget::getTextIconInfo(
icon_x = box_x + box_w - icon_w; icon_x = box_x + box_w - icon_w;
} }
else if (icon_align & CENTER) { else if (icon_align & CENTER) {
text_x = box_x + box_w/2 - text_w/2; text_x = box_x + (box_w - text_w)/2;
icon_x = box_x + box_w/2 - icon_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 { else {
text_x = box_x + box_w - text_w; text_x = box_x + box_w - text_w;
@ -1002,8 +1012,11 @@ void Widget::getTextIconInfo(
icon_y = box_y + box_h - icon_h; icon_y = box_y + box_h - icon_h;
} }
else if (icon_align & MIDDLE) { else if (icon_align & MIDDLE) {
text_y = box_y + box_h/2 - text_h/2; text_y = box_y + (box_h - text_h)/2;
icon_y = box_y + box_h/2 - icon_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 { else {
text_y = box_y + box_h - text_h; text_y = box_y + box_h - text_h;