Better fix for icon button alignment

This commit is contained in:
Deve 2019-11-10 10:25:19 +01:00
parent 60d5233782
commit fb4ecf6a00
6 changed files with 19 additions and 18 deletions

View File

@ -1,9 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<stkgui> <stkgui>
<div x="1%" y="0" width="98%" layout="horizontal-row" height="9%"> <div x="1%" y="0" width="98%" layout="horizontal-row" height="9%">
<icon-button id="back" height="100%" align="left" icon="gui/icons/back.png"/> <icon-button id="back" height="100%" icon_align="left" icon="gui/icons/back.png"/>
<spacer proportion="1" height="5"/> <spacer proportion="1" height="1"/>
<icon-button id="reload" y="5%" height="90%" align="right" icon="gui/icons/restart.png"/> <icon-button id="reload" y="5%" height="90%" icon_align="right" icon="gui/icons/restart.png"/>
</div> </div>
<div x="0%" y="1%" width="100%" height="98%" layout="vertical-row" > <div x="0%" y="1%" width="100%" height="98%" layout="vertical-row" >

View File

@ -1,9 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<stkgui> <stkgui>
<div x="1%" y="0" width="98%" layout="horizontal-row" height="9%"> <div x="1%" y="0" width="98%" layout="horizontal-row" height="9%">
<icon-button id="back" height="100%" x="0%" icon="gui/icons/back.png"/> <icon-button id="back" height="100%" icon_align="left" icon="gui/icons/back.png"/>
<spacer proportion="1" height="5"/> <spacer proportion="1" height="1"/>
<icon-button id="reload" y="5%" height="90%" x="0%" icon="gui/icons/restart.png"/> <icon-button id="reload" y="5%" height="90%" icon_align="right" icon="gui/icons/restart.png"/>
</div> </div>
<div x="0%" y="1%" width="100%" height="98%" layout="vertical-row" > <div x="0%" y="1%" width="100%" height="98%" layout="vertical-row" >

View File

@ -1,9 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<stkgui> <stkgui>
<div x="1%" y="0" width="98%" layout="horizontal-row" height="9%"> <div x="1%" y="0" width="98%" layout="horizontal-row" height="9%">
<icon-button id="back" height="100%" x="0%" icon="gui/icons/back.png"/> <icon-button id="back" height="100%" icon_align="left" icon="gui/icons/back.png"/>
<spacer proportion="1" height="5"/> <spacer proportion="1" height="1"/>
<icon-button id="reload" y="5%" height="90%" x="0%" icon="gui/icons/restart.png"/> <icon-button id="reload" y="5%" height="90%" icon_align="right" icon="gui/icons/restart.png"/>
</div> </div>
<div x="0%" y="1%" width="100%" height="98%" layout="vertical-row" > <div x="0%" y="1%" width="100%" height="98%" layout="vertical-row" >

View File

@ -213,6 +213,7 @@ if(prop_name != NULL) widget.m_properties[prop_flag] = core::stringc(prop_name).
READ_PROPERTY(layout, PROP_LAYOUT); READ_PROPERTY(layout, PROP_LAYOUT);
READ_PROPERTY(align, PROP_ALIGN); READ_PROPERTY(align, PROP_ALIGN);
READ_PROPERTY(custom_ratio, PROP_CUSTOM_RATIO); READ_PROPERTY(custom_ratio, PROP_CUSTOM_RATIO);
READ_PROPERTY(icon_align, PROP_ICON_ALIGN);
READ_PROPERTY(icon, PROP_ICON); READ_PROPERTY(icon, PROP_ICON);
READ_PROPERTY(focus_icon, PROP_FOCUS_ICON); READ_PROPERTY(focus_icon, PROP_FOCUS_ICON);

View File

@ -114,6 +114,7 @@ namespace GUIEngine
PROP_DIV_PADDING, PROP_DIV_PADDING,
PROP_KEEP_SELECTION, PROP_KEEP_SELECTION,
PROP_CUSTOM_RATIO, PROP_CUSTOM_RATIO,
PROP_ICON_ALIGN,
}; };
bool isWithinATextBox(); bool isWithinATextBox();

View File

@ -146,15 +146,14 @@ void IconButtonWidget::add()
suggested_h = (int)(suggested_h*needed_scale_factor); suggested_h = (int)(suggested_h*needed_scale_factor);
} }
// This is a bit messy, because m_x gives position of left side of an image, bool left_horizontal = m_properties[PROP_ICON_ALIGN] == "left";
// but in most cases we need to scale it based on center of the image, so bool right_horizontal = m_properties[PROP_ICON_ALIGN] == "right";
// this is the default action here.
// There are some cases when it causes issues though, for example when we // Assume left align if align property is not specified, but x property is specified
// explicitly want particular widget position or left/right align. So let's if (m_properties[PROP_X].size() > 0 && m_properties[PROP_ICON_ALIGN].empty())
// just use left/right align in this case. {
bool left_horizontal = m_properties[PROP_X].size() > 0 || left_horizontal = true;
m_properties[PROP_ALIGN] == "left"; }
bool right_horizontal = m_properties[PROP_ALIGN] == "right";
const int x_from = right_horizontal ? m_x + (m_w - suggested_w) : const int x_from = right_horizontal ? m_x + (m_w - suggested_w) :
left_horizontal ? m_x : left_horizontal ? m_x :