Improve the GP editor's track picker layout and behavior
This improves things for #4378 but is not a comprehensive solution. It also includes unrelated improvements to this screen. - Switch from 2 track rows to 3 track rows. This allows to show more tracks at once. Nonetheless amount of white space between track pictures is still significant. Showing the track name below each track is part of the issue, as it needs space on the bottom and margins on the side to avoid track names overflowing onto each other. Word-wrap for track title would incur a small vertical cost while gaining a lot of horizontal space. Alternatively, the track names could be hidden and only shown on hover (like the game's main track selection screeen). - Select the standard set of tracks by default instead of all. - Reduce the amount of vertical spacing for the buttons below the track picker. - Group laps/reverse and ok/cancel vertically instead of horizontally. This creates clear visual blocks, as the reduced vertical spacing didn't work out well otherwise. - Add a new selected track picture. The selected track's name is always shown as title, but some users may miss it or not know track names well enough. Now, which track is going to be added to the GP when clicking ok is obvious. - When selecting a different track, change the lap number to the track's default.
This commit is contained in:
Alayan
parent
a36c68542e
commit
073e5a4314
@ -5,52 +5,70 @@
|
||||
<header id="selected_track" height="8%" width="80%"
|
||||
I18N="No neeed to translate this, it will be overwritten by the track name"
|
||||
text="" align="center" text_align="center" />
|
||||
<spacer height="1%" />
|
||||
|
||||
<spacer height="2%" />
|
||||
<spacer height="3%" />
|
||||
|
||||
<!-- Track selection -->
|
||||
<box proportion="3" width="100%" layout="vertical-row">
|
||||
<ribbon_grid id="tracks" proportion="1" width="100%" square_items="true"
|
||||
label_location="each" align="center" max_rows="2" child_width="160"
|
||||
label_location="each" align="center" max_rows="3" child_width="160"
|
||||
child_height="120"/>
|
||||
</box>
|
||||
|
||||
<!-- Populated dynamically at runtime -->
|
||||
<tabs width="100%" height="1f" id="trackgroups"> </tabs>
|
||||
|
||||
<spacer height="10%" />
|
||||
<spacer height="3%" />
|
||||
|
||||
|
||||
<!-- Laps and reverse -->
|
||||
<div width="100%" height="fit" layout="horizontal-row" align="center">
|
||||
<!-- Selected track preview picture -->
|
||||
<spacer width="2%" />
|
||||
|
||||
<spacer proportion="1" />
|
||||
<icon-button width="12%" height="100%" id="screenshot" custom_ratio="1.33333"/>
|
||||
|
||||
<label id="laps_label" text_align="left"
|
||||
I18N="In the edit track screen" text="Number of laps:" />
|
||||
<spacer width="20" />
|
||||
<spinner id="laps" proportion="1" width="100" min_value="1"
|
||||
max_value="99" wrap_around="false" />
|
||||
<spacer width="3%" />
|
||||
|
||||
<spacer proportion="1" />
|
||||
<div width="80%" height="fit" layout="vertical-row" align="center">
|
||||
<!-- Laps selection and ok button -->
|
||||
<div width="100%" height="fit" layout="horizontal-row">
|
||||
|
||||
<label id="reverse_label" text_align="left"
|
||||
I18N="In the edit track screen" text="Reverse:" />
|
||||
<spacer width="20" />
|
||||
<checkbox id="reverse" />
|
||||
<spacer width="5%" />
|
||||
|
||||
<spacer proportion="1" />
|
||||
</div>
|
||||
<div width="60%" height="fit" layout="horizontal-row">
|
||||
<label id="laps_label" text_align="left"
|
||||
I18N="In the edit track screen" text="Number of laps:" />
|
||||
<spacer width="0.2f" />
|
||||
<spinner id="laps"width="200" min_value="1"
|
||||
max_value="99" wrap_around="false" />
|
||||
</div>
|
||||
|
||||
<spacer height="5%" />
|
||||
<spacer width="10%" />
|
||||
|
||||
<!-- Dialog buttons -->
|
||||
<div width="100%" height="fit" layout="horizontal-row">
|
||||
<spacer proportion="2" />
|
||||
<button id="ok" text="OK" proportion="1" />
|
||||
<spacer proportion="1" />
|
||||
<button id="cancel" text="Cancel" proportion="1" />
|
||||
<spacer proportion="2" />
|
||||
<button id="ok" text="OK" width="25%" />
|
||||
</div>
|
||||
|
||||
<spacer height="2%" />
|
||||
|
||||
<!-- Reverse selection and cancel button -->
|
||||
<div width="100%" height="fit" layout="horizontal-row">
|
||||
|
||||
<spacer width="5%" />
|
||||
|
||||
<div width="60%" height="fit" layout="horizontal-row">
|
||||
<label id="reverse_label" text_align="left"
|
||||
I18N="In the edit track screen" text="Reverse:" />
|
||||
<spacer width="0.2f" />
|
||||
<checkbox id="reverse" />
|
||||
</div>
|
||||
|
||||
<spacer width="10%" />
|
||||
|
||||
<button id="cancel" text="Cancel" width="25%" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<spacer width="3%" />
|
||||
</div>
|
||||
|
||||
<spacer height="2%" />
|
||||
|
||||
@ -17,6 +17,8 @@
|
||||
|
||||
#include "states_screens/edit_track_screen.hpp"
|
||||
|
||||
#include "graphics/stk_tex_manager.hpp"
|
||||
|
||||
#include "guiengine/widgets/button_widget.hpp"
|
||||
#include "guiengine/widgets/check_box_widget.hpp"
|
||||
#include "guiengine/widgets/dynamic_ribbon_widget.hpp"
|
||||
@ -36,7 +38,7 @@ const char* EditTrackScreen::ALL_TRACKS_GROUP_ID = "all";
|
||||
|
||||
// -----------------------------------------------------------------------------
|
||||
EditTrackScreen::EditTrackScreen()
|
||||
: Screen("edit_track.stkgui"), m_track_group(ALL_TRACKS_GROUP_ID),
|
||||
: Screen("edit_track.stkgui"), m_track_group("standard"),
|
||||
m_track(NULL), m_laps(0), m_reverse(false), m_result(false)
|
||||
{
|
||||
|
||||
@ -89,47 +91,10 @@ void EditTrackScreen::loadedFromFile()
|
||||
DynamicRibbonWidget* tracks_widget = getWidget<DynamicRibbonWidget>("tracks");
|
||||
assert(tracks_widget != NULL);
|
||||
tracks_widget->setMaxLabelLength(MAX_LABEL_LENGTH);
|
||||
}
|
||||
|
||||
// -----------------------------------------------------------------------------
|
||||
void EditTrackScreen::eventCallback(GUIEngine::Widget* widget, const std::string& name,
|
||||
const int playerID)
|
||||
{
|
||||
if (name == "ok")
|
||||
{
|
||||
m_result = true;
|
||||
StateManager::get()->popMenu();
|
||||
}
|
||||
else if (name == "cancel")
|
||||
{
|
||||
m_result = false;
|
||||
StateManager::get()->popMenu();
|
||||
}
|
||||
else if (name == "tracks")
|
||||
{
|
||||
DynamicRibbonWidget* tracks = getWidget<DynamicRibbonWidget>("tracks");
|
||||
assert(tracks != NULL);
|
||||
selectTrack(tracks->getSelectionIDString(PLAYER_ID_GAME_MASTER));
|
||||
}
|
||||
else if (name == "trackgroups")
|
||||
{
|
||||
RibbonWidget* tabs = getWidget<RibbonWidget>("trackgroups");
|
||||
assert(tabs != NULL);
|
||||
m_track_group = tabs->getSelectionIDString(PLAYER_ID_GAME_MASTER);
|
||||
loadTrackList();
|
||||
}
|
||||
else if (name == "laps")
|
||||
{
|
||||
SpinnerWidget* laps = getWidget<SpinnerWidget>("laps");
|
||||
assert(laps != NULL);
|
||||
m_laps = laps->getValue();
|
||||
}
|
||||
else if (name == "reverse")
|
||||
{
|
||||
CheckBoxWidget* reverse = getWidget<CheckBoxWidget>("reverse");
|
||||
assert(reverse != NULL);
|
||||
m_reverse = reverse->getState();
|
||||
}
|
||||
m_screenshot = getWidget<IconButtonWidget>("screenshot");
|
||||
m_screenshot->setFocusable(false);
|
||||
m_screenshot->m_tab_stop = false;
|
||||
}
|
||||
|
||||
// -----------------------------------------------------------------------------
|
||||
@ -173,6 +138,47 @@ void EditTrackScreen::init()
|
||||
selectTrack(m_track->getIdent());
|
||||
}
|
||||
|
||||
// -----------------------------------------------------------------------------
|
||||
void EditTrackScreen::eventCallback(GUIEngine::Widget* widget, const std::string& name,
|
||||
const int playerID)
|
||||
{
|
||||
if (name == "ok")
|
||||
{
|
||||
m_result = true;
|
||||
StateManager::get()->popMenu();
|
||||
}
|
||||
else if (name == "cancel")
|
||||
{
|
||||
m_result = false;
|
||||
StateManager::get()->popMenu();
|
||||
}
|
||||
else if (name == "tracks")
|
||||
{
|
||||
DynamicRibbonWidget* tracks = getWidget<DynamicRibbonWidget>("tracks");
|
||||
assert(tracks != NULL);
|
||||
selectTrack(tracks->getSelectionIDString(PLAYER_ID_GAME_MASTER));
|
||||
}
|
||||
else if (name == "trackgroups")
|
||||
{
|
||||
RibbonWidget* tabs = getWidget<RibbonWidget>("trackgroups");
|
||||
assert(tabs != NULL);
|
||||
m_track_group = tabs->getSelectionIDString(PLAYER_ID_GAME_MASTER);
|
||||
loadTrackList();
|
||||
}
|
||||
else if (name == "laps")
|
||||
{
|
||||
SpinnerWidget* laps = getWidget<SpinnerWidget>("laps");
|
||||
assert(laps != NULL);
|
||||
m_laps = laps->getValue();
|
||||
}
|
||||
else if (name == "reverse")
|
||||
{
|
||||
CheckBoxWidget* reverse = getWidget<CheckBoxWidget>("reverse");
|
||||
assert(reverse != NULL);
|
||||
m_reverse = reverse->getState();
|
||||
}
|
||||
}
|
||||
|
||||
// -----------------------------------------------------------------------------
|
||||
void EditTrackScreen::loadTrackList()
|
||||
{
|
||||
@ -223,10 +229,24 @@ void EditTrackScreen::selectTrack(const std::string& id)
|
||||
tracks->setSelection(m_track->getIdent(), PLAYER_ID_GAME_MASTER, true);
|
||||
selected_track->setText(m_track->getName(), true);
|
||||
|
||||
laps->setValue(m_laps);
|
||||
laps->setValue(m_track->getDefaultNumberOfLaps());
|
||||
|
||||
reverse->setVisible(m_track->reverseAvailable());
|
||||
label_reverse->setVisible(m_track->reverseAvailable());
|
||||
|
||||
// Display the track's preview picture in a box,
|
||||
// so that the current selection remains obvious even
|
||||
// if the player doesn't notice the track name in title
|
||||
irr::video::ITexture* image = STKTexManager::getInstance()
|
||||
->getTexture(m_track->getScreenshotFile(),
|
||||
"While loading screenshot for track '%s':", m_track->getFilename());
|
||||
if(!image)
|
||||
{
|
||||
image = STKTexManager::getInstance()->getTexture(GUIEngine::getSkin()->getThemedIcon("gui/icons/track_unknown.png"),
|
||||
"While loading screenshot for track '%s':", m_track->getFilename());
|
||||
}
|
||||
if (image != NULL)
|
||||
m_screenshot->setImage(image);
|
||||
}
|
||||
else
|
||||
{
|
||||
|
||||
@ -19,7 +19,7 @@
|
||||
#define HEADER_EDIT_TRACK_SCREEN_HPP
|
||||
|
||||
#include "guiengine/screen.hpp"
|
||||
|
||||
#include "guiengine/widgets.hpp"
|
||||
|
||||
namespace GUIEngine { class Widget; }
|
||||
|
||||
@ -51,6 +51,8 @@ class EditTrackScreen :
|
||||
bool m_reverse;
|
||||
bool m_result;
|
||||
|
||||
GUIEngine::IconButtonWidget* m_screenshot;
|
||||
|
||||
public:
|
||||
|
||||
~EditTrackScreen();
|
||||
|
||||
Loading…
Reference in New Issue
Block a user