replaced some plain ribbons with tabs (help, preferences)

git-svn-id: svn+ssh://svn.code.sf.net/p/supertuxkart/code/main/branches/irrlicht@3445 178a84e3-b1eb-0310-8ba1-8eac791a3b58
This commit is contained in:
auria 2009-05-02 19:20:31 +00:00
parent 1a481fb227
commit f6d8943c70
10 changed files with 100 additions and 30 deletions

View File

@ -1,12 +1,12 @@
<div x="2%" y="2%" width="96%" height="96%" layout="vertical-row" >
<label align="center" text="SuperTuxKart Options"/>
<label align="center" text="SuperTuxKart Help"/>
<ribbon id="category" height="20%" width="75%" align="center">
<tabs id="category" height="130" width="75%" align="center">
<icon-button id="page1" width="128" height="128" icon="gui/track_random.png" text="General"/>
<icon-button id="page2" width="128" height="128" icon="gui/mode_normal.png" text="Weapons"/>
<icon-button id="page3" width="128" height="128" icon="gui/mode_ftl.png" text="Game Modes"/>
</ribbon>
</tabs>
<spacer proportion="1" width="10" proportion="1"/>

View File

@ -1,12 +1,12 @@
<div x="2%" y="2%" width="96%" height="96%" layout="vertical-row" >
<label align="center" text="SuperTuxKart Options"/>
<label align="center" text="SuperTuxKart Help"/>
<ribbon id="category" height="20%" width="75%" align="center">
<tabs id="category" height="130" width="75%" align="center">
<icon-button id="page1" width="128" height="128" icon="gui/track_random.png" text="General"/>
<icon-button id="page2" width="128" height="128" icon="gui/mode_normal.png" text="Weapons"/>
<icon-button id="page3" width="128" height="128" icon="gui/mode_ftl.png" text="Game Modes"/>
</ribbon>
</tabs>
<spacer proportion="1" width="10" proportion="1"/>

View File

@ -1,13 +1,13 @@
<div x="2%" y="2%" width="96%" height="96%" layout="vertical-row" >
<label align="center" text="SuperTuxKart Options"/>
<label align="center" text="SuperTuxKart Help"/>
<ribbon id="category" height="20%" width="75%" align="center">
<tabs id="category" height="130" width="75%" align="center">
<icon-button id="page1" width="128" height="128" icon="gui/track_random.png" text="General"/>
<icon-button id="page2" width="128" height="128" icon="gui/mode_normal.png" text="Weapons"/>
<icon-button id="page3" width="128" height="128" icon="gui/mode_ftl.png" text="Game Modes"/>
</ribbon>
</tabs>
<spacer proportion="1" width="10" proportion="1"/>

View File

@ -17,5 +17,7 @@
<button text="All"/>
</tabs>
<spacer height="15" width="25"/>
</div>

View File

@ -2,11 +2,11 @@
<label align="center" text="SuperTuxKart Options"/>
<ribbon id="options_choice" height="20%" width="75%" align="center">
<tabs id="options_choice" height="130" width="75%" align="center">
<icon-button id="audio_video" width="128" height="128" icon="gui/options_audio_video.png" text="Audio/Video"/>
<icon-button id="players" width="128" height="128" icon="gui/options_players.png" text="Players"/>
<icon-button id="controls" width="128" height="128" icon="gui/options_input.png" text="Controls"/>
</ribbon>
</tabs>
<spacer height="25" width="10"/>

View File

@ -2,11 +2,11 @@
<label align="center" text="SuperTuxKart Options"/>
<ribbon id="options_choice" height="20%" width="75%" align="center">
<tabs id="options_choice" height="130" width="75%" align="center">
<icon-button id="audio_video" width="128" height="128" icon="gui/options_audio_video.png" text="Audio/Video"/>
<icon-button id="players" width="128" height="128" icon="gui/options_players.png" text="Players"/>
<icon-button id="controls" width="128" height="128" icon="gui/options_input.png" text="Controls"/>
</ribbon>
</tabs>
<spacer height="15" width="10" />

View File

@ -2,11 +2,11 @@
<label align="center" text="SuperTuxKart Options"/>
<ribbon id="options_choice" height="20%" width="75%" align="center">
<tabs id="options_choice" height="130" width="75%" align="center">
<icon-button id="audio_video" width="128" height="128" icon="gui/options_audio_video.png" text="Audio/Video"/>
<icon-button id="players" width="128" height="128" icon="gui/options_players.png" text="Players"/>
<icon-button id="controls" width="128" height="128" icon="gui/options_input.png" text="Controls"/>
</ribbon>
</tabs>
<spacer proportion="1" width="10" proportion="1"/>

View File

@ -14,6 +14,7 @@ the "buttonbar" subcategory treats children buttons as action buttons, which mea
'selected' state, only focused or not (i.e. there is no selection that remains if you leave this area).
events are triggered only on enter/fire.
the "tabs" subcategory will show a tab bar. behaviour is same as normal ribbon, only looks are different.
Orientation of tabs (up or down) is automatically inferred from on-screen position
Ribbon widgets are of spawn type (<ribbon> ... </ribbon>) and may contain icon-buttons or buttons as children.
Property PROP_SQUARE can be set to tell the engine if the ribbon's contents are rectangular or not (this will
affect the type of highlighting used)

View File

@ -50,7 +50,7 @@ void Skin::drawBoxFromStretchableTexture(const core::rect< s32 > &dest, ITexture
const int left_border, const int right_border,
const int top_border, const int bottom_border,
const bool preserve_h_aspect_ratios,
const float border_out_portion, int areas)
const float border_out_portion, int areas, const bool vertical_flip)
{
// FIXME? - lots of things here will be re-calculated every frame, which is useless since
// widgets won't move, so they'd only need to be calculated once.
@ -187,6 +187,45 @@ void Skin::drawBoxFromStretchableTexture(const core::rect< s32 > &dest, ITexture
core::rect<s32> dest_area_bottom_left = core::rect<s32>(hx, hy, lx, ly);
core::rect<s32> dest_area_bottom_right = core::rect<s32>(jx, jy, nx, ny);
if(vertical_flip)
{
#define FLIP_Y( X ) { const int y1 = X.UpperLeftCorner.Y - ay; \
const int y2 = X.LowerRightCorner.Y - ay; \
X.UpperLeftCorner.Y = ny - y2;\
X.LowerRightCorner.Y = ny - y1;}
FLIP_Y(dest_area_left)
FLIP_Y(dest_area_center)
FLIP_Y(dest_area_right)
FLIP_Y(dest_area_top)
FLIP_Y(dest_area_bottom)
FLIP_Y(dest_area_top_left)
FLIP_Y(dest_area_top_right)
FLIP_Y(dest_area_bottom_left)
FLIP_Y(dest_area_bottom_right)
#undef FLIP_Y
#define FLIP_Y( X ) { const int y1 = X.UpperLeftCorner.Y; \
const int y2 = X.LowerRightCorner.Y; \
X.UpperLeftCorner.Y = y2;\
X.LowerRightCorner.Y = y1;}
FLIP_Y(source_area_left)
FLIP_Y(source_area_center)
FLIP_Y(source_area_right)
FLIP_Y(source_area_top)
FLIP_Y(source_area_bottom)
FLIP_Y(source_area_top_left)
FLIP_Y(source_area_top_right)
FLIP_Y(source_area_bottom_left)
FLIP_Y(source_area_bottom_right)
#undef FLIP_Y
}
if((areas & LEFT) != 0)
{
GUIEngine::getDriver()->draw2DImage(source, dest_area_left, source_area_left,
@ -255,8 +294,7 @@ void Skin::drawButton(const core::rect< s32 > &rect, const bool pressed, const b
void Skin::drawRibbon(const core::rect< s32 > &rect, const Widget* widget, const bool pressed, bool focused)
{
return;
/*
// only combo ribbons need a border
if ( ((RibbonWidget*)widget)->getRibbonType() != RIBBON_COMBO ) return;
@ -280,6 +318,7 @@ void Skin::drawRibbon(const core::rect< s32 > &rect, const Widget* widget, const
GUIEngine::getDriver()->draw2DRectangle( SColor(255, 150, 0, 0), rect );
else
GUIEngine::getDriver()->draw2DRectangle( SColor(255, 0, 150, 0), rect );
*/
}
void Skin::drawRibbonChild(const core::rect< s32 > &rect, const Widget* widget, const bool pressed, bool focused)
@ -289,31 +328,58 @@ void Skin::drawRibbonChild(const core::rect< s32 > &rect, const Widget* widget,
const bool parent_focused = GUIEngine::getGUIEnv()->getFocus() == widget->m_event_handler->m_element;
RibbonType type = ((RibbonWidget*)widget->m_event_handler)->getRibbonType();
/* tab-bar ribbons */
if(widget->m_type == WTYPE_BUTTON)
if(type == RIBBON_TABS)
{
// ribbons containing buttons are actually tabs
// FIXME - specify in file, don't hardcode
const int left_border = 75;
const int right_border = 75;
const int border_above = 0;
const int border_below = 0;
int left_border = 75;
int right_border = 75;
int border_above = 0;
int border_below = 15;
// automatically guess from position on-screen if tabs go up or down
const bool vertical_flip = rect.UpperLeftCorner.Y < GUIEngine::getDriver()->getCurrentRenderTargetSize().Height/2;
float portion_out = 0.2f;
/* when not using plain buttons, it's probably icons, so we need more space */
if(widget->m_type != WTYPE_BUTTON)
{
portion_out = 0.9f;
border_below = 50;
}
core::rect< s32 > rect2 = rect;
if(vertical_flip)
{
// move up a bit
rect2.LowerRightCorner.Y -= 10;
rect2.UpperLeftCorner.Y -= 10;
}
if (mark_selected)
{
core::rect< s32 > rect2 = rect;
rect2.LowerRightCorner.Y += 10;
if(vertical_flip)
rect2.UpperLeftCorner.Y -= 10;
else
rect2.LowerRightCorner.Y += 10;
drawBoxFromStretchableTexture(rect2, (focused || parent_focused ? m_tex_ftab : m_tex_dtab),
left_border, right_border,
border_above, border_below, false /* horizontal aspect ratio not kept */, 0.2f);
border_above, border_below, false /* horizontal aspect ratio not kept */, portion_out,
BODY | LEFT | RIGHT | TOP | BOTTOM, vertical_flip);
}
else
{
drawBoxFromStretchableTexture(rect, m_tex_tab,
drawBoxFromStretchableTexture(rect2, m_tex_tab,
left_border, right_border,
border_above, border_below, false /* horizontal aspect ratio not kept */, 0.0f);
border_above, border_below, false /* horizontal aspect ratio not kept */, portion_out,
BODY | LEFT | RIGHT | TOP | BOTTOM, vertical_flip);
}
}

View File

@ -52,7 +52,8 @@ class Skin : public IGUISkin
const int top_border, const int bottom_border,
const bool preserve_h_aspect_ratios=false,
const float border_out_portion = 0.5,
int areas = BODY | LEFT | RIGHT | TOP | BOTTOM);
int areas = BODY | LEFT | RIGHT | TOP | BOTTOM,
const bool vertical_flip=false);
public:
Skin(IGUISkin* fallback_skin);