UI fix bundle V (#3921)

* Use font height

* Smarter space

* Smarter space

* Better space to avoid bad looking ui

* Smarter space

* Use font height

* Better height

* Better skill bar look

* Better skill bars look
This commit is contained in:
dumaosen 2019-05-18 03:42:45 +08:00 committed by Deve
parent ec485bae4c
commit 2d3ae6aefc
9 changed files with 28 additions and 46 deletions

View File

@ -36,7 +36,7 @@
icon="gui/icons/back.png"
I18N="Add-on screen action" text="Back" />
</buttonbar>
<progressbar id="progress" x="0" y="20%" width="100%" height="30%" />
<progressbar id="progress" x="0" y="20%" width="100%" height="2f" />
</div>
</div>
</stkgui>

View File

@ -3,16 +3,16 @@
<div x="2%" y="10%" width="96%" height="80%" layout="vertical-row" >
<label id="title" width="100%" text_align="center" word_wrap="true" proportion="1" />
<spacer height="25" width="10" />
<spacer height="4%" width="10" />
<button id="accept" I18N="In the 'confirm resolution' dialog, that's shown when switching resoluton"
text="Keep this resolution" align="center"/>
<spacer height="15" width="10" />
<spacer height="3%" width="10" />
<button id="cancel" I18N="In the 'confirm resolution' dialog, that's shown when switching resoluton"
text="Cancel" align="center"/>
<spacer height="10" width="10" />
<spacer height="2%" width="10" />
</div>
</stkgui>

View File

@ -2,7 +2,7 @@
<stkgui>
<div x="2%" y="0%" width="96%" height="100%" layout="vertical-row" >
<header id="title" width="96%" proportion="4" text_align="center" word_wrap="true"/>
<spacer height="1%" width="5"/>
<spacer height="1f" width="5"/>
<div width="90%" height="fit" layout="horizontal-row">
<label id="server-info-1" align="top" proportion="2" text_align="left" word_wrap="true" text=""/>
<label id="server-info-2" align="top" proportion="2" text_align="left" word_wrap="true" text=""/>
@ -25,6 +25,6 @@
<icon-button id="cancel" width="128" height="128" icon="gui/icons/main_quit.png"
I18N="In the server info dialog" text="Cancel" label_location="bottom"/>
</buttonbar>
<spacer height="3%" width="5"/>
<spacer height="1f" width="5"/>
</div>
</stkgui>

View File

@ -4,7 +4,7 @@
<header id="title" width="96%" height="fit" text_align="center" word_wrap="true"
I18N="User info dialog" text="User Info"/>
<spacer height="15" width="50"/>
<spacer height="1f" width="50"/>
<div width="80%" align="center" layout="vertical-row" height="fit" >
<div width="100%" height="fit" layout="horizontal-row">
@ -12,11 +12,11 @@
</div>
</div>
<spacer height="15" width="50"/>
<spacer height="3%" width="50"/>
<label id="info" proportion="1" width="90%" align="center" text_align="center" word_wrap="true" text=""/>
<spacer height="15" width="50"/>
<spacer height="3%" width="50"/>
<buttonbar id="options" width="90%" height="20%" align="center">
<icon-button id="remove" width="64" height="64" icon="gui/icons/package-uninstall.png"

View File

@ -13,7 +13,7 @@
<!-- Contents is added programatically -->
</placeholder>
<spacer height="15" width="25"/>
<spacer height="1f" width="25"/>
<box proportion="2" width="100%" layout="vertical-row" padding="2">
<ribbon_grid id="karts" proportion="1" square_items="true" width="100%" align="center"

View File

@ -9,21 +9,21 @@
<textbox proportion="1" id="name" I18N="In the server creation screen"/>
</div>
<spacer height="10" width="20"/>
<spacer height="2%" width="20"/>
<div width="100%" height="fit" layout="horizontal-row" >
<label proportion="1" text_align="left" I18N="In the server creation screen" text="Max. number of players"/>
<gauge id="max_players" proportion="1" min_value="2"/>
</div>
<spacer height="10" width="20"/>
<spacer height="2%" width="20"/>
<div width="100%" height="fit" layout="horizontal-row" >
<label proportion="1" text_align="left" I18N="In the server creation screen" text="Password for private server (optional)"/>
<textbox proportion="1" id="password" I18N="In the server creation screen"/>
</div>
<spacer height="5" width="20"/>
<spacer height="1%" width="20"/>
<label width="100%" height="fit" text_align="left" I18N="In the server creation screen" text="Difficulty"/>
<ribbon id="difficulty" height="15%" width="90%" align="center">
@ -48,7 +48,7 @@
I18N="Multiplayer game mode" text="Soccer"/>
</ribbon>
<spacer height="10" width="20"/>
<spacer height="2%" width="20"/>
<div width="100%" height="fit" layout="horizontal-row" >
<label id="more-options" proportion="1" text_align="left"/>
<spinner id="more-options-spinner" proportion="1" wrap_around="true"/>
@ -63,9 +63,9 @@
I18N="In the server creation screen" text="Cancel" label_location="bottom"/>
</buttonbar>
<spacer width="10" height="20"/>
<spacer width="10" height="1f"/>
</box>
<spacer width="10" height="10"/>
<spacer width="10" height="2%"/>
</div>
</stkgui>

View File

@ -14,7 +14,7 @@
</box>
<!-- Populated dynamically at runtime -->
<tabs width="100%" height="2f" id="trackgroups"> </tabs>
<tabs width="100%" height="1f" id="trackgroups"> </tabs>
<spacer width="100%" height="2%" />
<box id="rect-box" width="100%" height="20%" padding="15" layout="vertical-row">
@ -41,5 +41,5 @@
</box>
</div>
</div>
<progressbar x="2%" y="93%" id="timer" height="4%" width="96%"></progressbar>
<progressbar x="2%" y="93%" id="timer" height="1f" width="96%"></progressbar>
</stkgui>

View File

@ -165,10 +165,8 @@ void KartStatsWidget::move(int x, int y, int w, int h)
{
Widget::move(x,y,w,h);
setSize(m_x, m_y, m_w, m_h);
int margin = m_h / SKILL_COUNT - m_skill_bar_h / 2;
if (margin > m_skill_bar_h)
margin = m_skill_bar_h;
int offset = (m_h - (SKILL_COUNT * margin)) / 2;
int margin = m_h / SKILL_COUNT / 2;
int offset = m_h / 4;
for (int i = 0; i < SKILL_COUNT; ++i)
{
m_skills[i]->move(m_skill_bar_x,
@ -192,7 +190,7 @@ void KartStatsWidget::setValue(Stats type, float value)
float KartStatsWidget::getValue(Stats type)
{
return m_skills[type]->getValue();
} // getVAlue
} // getValue
// -----------------------------------------------------------------------------
/** Set size for widgets inside KartStatsWidget
@ -205,18 +203,10 @@ void KartStatsWidget::setSize(const int x, const int y, const int w, const int h
m_h = h;
// -- sizes
m_skill_bar_w = w;
m_skill_bar_h = (m_title_font ? GUIEngine::getTitleFontHeight() : GUIEngine::getFontHeight());
// for shrinking effect
if (h < 175)
{
const float factor = h / 175.0f;
m_skill_bar_h = (int)(m_skill_bar_h*factor);
}
m_skill_bar_w = w - m_w / 32; // make sure the bars can't be out of screen
m_skill_bar_h = m_h / SKILL_COUNT / 4;
m_skill_bar_x = x;
m_skill_bar_y = y + h/2 - m_skill_bar_h/2;
} // setSize
// -----------------------------------------------------------------------------

View File

@ -120,28 +120,20 @@ void SkillLevelWidget::setSize(const int x, const int y, const int w, const int
m_w = w;
m_h = h;
int iconbox_h = h; //within icon box, icon is drawn at 75% size
int iconbox_w = h; //assuming square icon
int iconbox_h = h * 4 / 3;
int iconbox_w = h * 4 / 3; //assuming square icon
m_iconbutton_h = iconbox_h * 3 / 4;
m_iconbutton_w = iconbox_w * 3 / 4;
m_iconbutton_h = iconbox_h;
m_iconbutton_w = iconbox_w;
// -- sizes
m_bar_w = m_w - iconbox_w - 25; //leaving just enough space for icon + its margin
m_bar_h = h;
// for shrinking effect
if (h < 175)
{
const float factor = h / 175.0f;
m_bar_h = (int)(m_bar_h*factor);
// no scale effect for icon (becomes too small otherwise)
}
m_bar_x = x + iconbox_w;
m_bar_y = y + h/2 - m_bar_h/2; //align to midpoint in y direction
m_iconbutton_x = x;
m_iconbutton_x = x - m_w / 32; //make sure icon has enough space on the right
m_iconbutton_y = y + h/2 - m_iconbutton_h/2; //align to midpoint in y direction
} // setSize