mirror of
https://github.com/RetroDECK/ES-DE.git
synced 2025-01-17 22:55:38 +00:00
Multiple layout improvements when running on a vertically oriented screen.
This commit is contained in:
parent
ebcc0f95b0
commit
07951d8d21
|
@ -60,7 +60,7 @@ void NinePatchComponent::buildVertices()
|
||||||
else {
|
else {
|
||||||
// Scale the corner size relative to the screen resolution (using the medium sized
|
// Scale the corner size relative to the screen resolution (using the medium sized
|
||||||
// default font as size reference).
|
// default font as size reference).
|
||||||
relCornerSize = mCornerSize * (Font::get(FONT_SIZE_MEDIUM)->getLetterHeight() *
|
relCornerSize = mCornerSize * (Font::get(FONT_SIZE_MEDIUM_FIXED)->getLetterHeight() *
|
||||||
(mSharpCorners == true ? 0.0568f : 0.09f) / 2.0f);
|
(mSharpCorners == true ? 0.0568f : 0.09f) / 2.0f);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -235,7 +235,7 @@ CarouselComponent<T>::CarouselComponent()
|
||||||
, mColorGradientHorizontal {true}
|
, mColorGradientHorizontal {true}
|
||||||
, mTextColor {0x000000FF}
|
, mTextColor {0x000000FF}
|
||||||
, mTextBackgroundColor {0xFFFFFF00}
|
, mTextBackgroundColor {0xFFFFFF00}
|
||||||
, mFont {Font::get(FONT_SIZE_LARGE)}
|
, mFont {Font::get(FONT_SIZE_LARGE_FIXED)}
|
||||||
, mLetterCase {LetterCase::NONE}
|
, mLetterCase {LetterCase::NONE}
|
||||||
, mLetterCaseAutoCollections {LetterCase::UNDEFINED}
|
, mLetterCaseAutoCollections {LetterCase::UNDEFINED}
|
||||||
, mLetterCaseCustomCollections {LetterCase::UNDEFINED}
|
, mLetterCaseCustomCollections {LetterCase::UNDEFINED}
|
||||||
|
|
|
@ -171,7 +171,7 @@ TextListComponent<T>::TextListComponent()
|
||||||
, mLoopScroll {false}
|
, mLoopScroll {false}
|
||||||
, mGamelistView {std::is_same_v<T, FileData*> ? true : false}
|
, mGamelistView {std::is_same_v<T, FileData*> ? true : false}
|
||||||
, mLegacyMode {false}
|
, mLegacyMode {false}
|
||||||
, mFont {Font::get(FONT_SIZE_MEDIUM)}
|
, mFont {Font::get(FONT_SIZE_MEDIUM_FIXED)}
|
||||||
, mSelectorHeight {mFont->getSize() * 1.5f}
|
, mSelectorHeight {mFont->getSize() * 1.5f}
|
||||||
, mSelectorHorizontalOffset {0.0f}
|
, mSelectorHorizontalOffset {0.0f}
|
||||||
, mSelectorVerticalOffset {0.0f}
|
, mSelectorVerticalOffset {0.0f}
|
||||||
|
|
|
@ -22,6 +22,7 @@ GuiDetectDevice::GuiDetectDevice(bool firstRun,
|
||||||
const std::function<void()>& doneCallback)
|
const std::function<void()>& doneCallback)
|
||||||
: mFirstRun {firstRun}
|
: mFirstRun {firstRun}
|
||||||
, mForcedConfig {forcedConfig}
|
, mForcedConfig {forcedConfig}
|
||||||
|
, mRenderer {Renderer::getInstance()}
|
||||||
, mBackground {":/graphics/frame.svg"}
|
, mBackground {":/graphics/frame.svg"}
|
||||||
, mGrid {glm::ivec2 {1, 5}}
|
, mGrid {glm::ivec2 {1, 5}}
|
||||||
{
|
{
|
||||||
|
@ -81,12 +82,14 @@ GuiDetectDevice::GuiDetectDevice(bool firstRun,
|
||||||
|
|
||||||
// Adjust the width relative to the aspect ratio of the screen to make the GUI look coherent
|
// Adjust the width relative to the aspect ratio of the screen to make the GUI look coherent
|
||||||
// regardless of screen type. The 1.778 aspect ratio value is the 16:9 reference.
|
// regardless of screen type. The 1.778 aspect ratio value is the 16:9 reference.
|
||||||
float aspectValue {1.778f / Renderer::getScreenAspectRatio()};
|
const float aspectValue {1.778f / mRenderer->getScreenAspectRatio()};
|
||||||
float width {glm::clamp(0.60f * aspectValue, 0.50f, 0.80f) * Renderer::getScreenWidth()};
|
const float width {glm::clamp(0.60f * aspectValue, 0.50f,
|
||||||
|
(mRenderer->getIsVerticalOrientation() ? 0.85f : 0.80f)) *
|
||||||
|
mRenderer->getScreenWidth()};
|
||||||
|
|
||||||
setSize(width, Renderer::getScreenHeight() * 0.5f);
|
setSize(width, mRenderer->getScreenHeight() * 0.5f);
|
||||||
setPosition((Renderer::getScreenWidth() - mSize.x) / 2.0f,
|
setPosition((mRenderer->getScreenWidth() - mSize.x) / 2.0f,
|
||||||
(Renderer::getScreenHeight() - mSize.y) / 2.0f);
|
(mRenderer->getScreenHeight() - mSize.y) / 2.0f);
|
||||||
}
|
}
|
||||||
|
|
||||||
void GuiDetectDevice::onSizeChanged()
|
void GuiDetectDevice::onSizeChanged()
|
||||||
|
|
|
@ -30,6 +30,7 @@ private:
|
||||||
InputConfig* mHoldingConfig;
|
InputConfig* mHoldingConfig;
|
||||||
int mHoldTime;
|
int mHoldTime;
|
||||||
|
|
||||||
|
Renderer* mRenderer;
|
||||||
NinePatchComponent mBackground;
|
NinePatchComponent mBackground;
|
||||||
ComponentGrid mGrid;
|
ComponentGrid mGrid;
|
||||||
|
|
||||||
|
|
|
@ -187,7 +187,8 @@ GuiInputConfig::GuiInputConfig(InputConfig* target,
|
||||||
float aspectValue {1.778f / Renderer::getScreenAspectRatio()};
|
float aspectValue {1.778f / Renderer::getScreenAspectRatio()};
|
||||||
float width {glm::clamp(0.60f * aspectValue, 0.50f, 0.80f) * Renderer::getScreenWidth()};
|
float width {glm::clamp(0.60f * aspectValue, 0.50f, 0.80f) * Renderer::getScreenWidth()};
|
||||||
|
|
||||||
setSize(width, Renderer::getScreenHeight() * 0.75f);
|
setSize(width, (Renderer::getIsVerticalOrientation() ? Renderer::getScreenWidth() * 0.75f :
|
||||||
|
Renderer::getScreenHeight() * 0.75f));
|
||||||
setPosition((Renderer::getScreenWidth() - mSize.x) / 2.0f,
|
setPosition((Renderer::getScreenWidth() - mSize.x) / 2.0f,
|
||||||
(Renderer::getScreenHeight() - mSize.y) / 2.0f);
|
(Renderer::getScreenHeight() - mSize.y) / 2.0f);
|
||||||
}
|
}
|
||||||
|
|
|
@ -25,7 +25,8 @@ GuiMsgBox::GuiMsgBox(const HelpStyle& helpstyle,
|
||||||
const std::function<void()>& func3,
|
const std::function<void()>& func3,
|
||||||
bool disableBackButton,
|
bool disableBackButton,
|
||||||
bool deleteOnButtonPress)
|
bool deleteOnButtonPress)
|
||||||
: mBackground {":/graphics/frame.svg"}
|
: mRenderer {Renderer::getInstance()}
|
||||||
|
, mBackground {":/graphics/frame.svg"}
|
||||||
, mGrid {glm::ivec2 {1, 2}}
|
, mGrid {glm::ivec2 {1, 2}}
|
||||||
, mHelpStyle {helpstyle}
|
, mHelpStyle {helpstyle}
|
||||||
, mDisableBackButton {disableBackButton}
|
, mDisableBackButton {disableBackButton}
|
||||||
|
@ -33,12 +34,13 @@ GuiMsgBox::GuiMsgBox(const HelpStyle& helpstyle,
|
||||||
{
|
{
|
||||||
// Adjust the width relative to the aspect ratio of the screen to make the GUI look coherent
|
// Adjust the width relative to the aspect ratio of the screen to make the GUI look coherent
|
||||||
// regardless of screen type. The 1.778 aspect ratio value is the 16:9 reference.
|
// regardless of screen type. The 1.778 aspect ratio value is the 16:9 reference.
|
||||||
float aspectValue {1.778f / Renderer::getScreenAspectRatio()};
|
const float aspectValue {1.778f / mRenderer->getScreenAspectRatio()};
|
||||||
|
|
||||||
float width {
|
const float maxWidthMultiplier {mRenderer->getIsVerticalOrientation() ? 0.90f : 0.80f};
|
||||||
floorf(glm::clamp(0.60f * aspectValue, 0.60f, 0.80f) * Renderer::getScreenWidth())};
|
float width {floorf(glm::clamp(0.60f * aspectValue, 0.60f, maxWidthMultiplier) *
|
||||||
float minWidth {
|
mRenderer->getScreenWidth())};
|
||||||
floorf(glm::clamp(0.30f * aspectValue, 0.10f, 0.50f) * Renderer::getScreenWidth())};
|
const float minWidth {
|
||||||
|
floorf(glm::clamp(0.30f * aspectValue, 0.10f, 0.50f) * mRenderer->getScreenWidth())};
|
||||||
|
|
||||||
mMsg = std::make_shared<TextComponent>(text, Font::get(FONT_SIZE_MEDIUM), 0x777777FF,
|
mMsg = std::make_shared<TextComponent>(text, Font::get(FONT_SIZE_MEDIUM), 0x777777FF,
|
||||||
ALIGN_CENTER);
|
ALIGN_CENTER);
|
||||||
|
@ -85,14 +87,14 @@ GuiMsgBox::GuiMsgBox(const HelpStyle& helpstyle,
|
||||||
|
|
||||||
// Now that we know width, we can find height.
|
// Now that we know width, we can find height.
|
||||||
mMsg->setSize(width, 0.0f); // mMsg->getSize.y() now returns the proper length.
|
mMsg->setSize(width, 0.0f); // mMsg->getSize.y() now returns the proper length.
|
||||||
const float msgHeight = std::max(Font::get(FONT_SIZE_LARGE)->getHeight(),
|
const float msgHeight {std::max(Font::get(FONT_SIZE_LARGE)->getHeight(),
|
||||||
mMsg->getSize().y * VERTICAL_PADDING_MODIFIER);
|
mMsg->getSize().y * VERTICAL_PADDING_MODIFIER)};
|
||||||
setSize(width + std::ceil(HORIZONTAL_PADDING_PX * 2.0f * Renderer::getScreenWidthModifier()),
|
setSize(width + std::ceil(HORIZONTAL_PADDING_PX * 2.0f * mRenderer->getScreenWidthModifier()),
|
||||||
msgHeight + mButtonGrid->getSize().y);
|
msgHeight + mButtonGrid->getSize().y);
|
||||||
|
|
||||||
// Center for good measure.
|
// Center for good measure.
|
||||||
setPosition((Renderer::getScreenWidth() - mSize.x) / 2.0f,
|
setPosition((mRenderer->getScreenWidth() - mSize.x) / 2.0f,
|
||||||
(Renderer::getScreenHeight() - mSize.y) / 2.0f);
|
(mRenderer->getScreenHeight() - mSize.y) / 2.0f);
|
||||||
|
|
||||||
addChild(&mBackground);
|
addChild(&mBackground);
|
||||||
addChild(&mGrid);
|
addChild(&mGrid);
|
||||||
|
@ -101,18 +103,19 @@ GuiMsgBox::GuiMsgBox(const HelpStyle& helpstyle,
|
||||||
void GuiMsgBox::changeText(const std::string& newText)
|
void GuiMsgBox::changeText(const std::string& newText)
|
||||||
{
|
{
|
||||||
mMsg->setText(newText);
|
mMsg->setText(newText);
|
||||||
glm::vec2 newSize = mMsg->getFont()->sizeText(newText);
|
glm::vec2 newSize {mMsg->getFont()->sizeText(newText)};
|
||||||
newSize.y *= VERTICAL_PADDING_MODIFIER;
|
newSize.y *= VERTICAL_PADDING_MODIFIER;
|
||||||
mMsg->setSize(newSize);
|
mMsg->setSize(newSize);
|
||||||
|
|
||||||
// Adjust the width depending on the aspect ratio of the screen, to make the screen look
|
// Adjust the width depending on the aspect ratio of the screen, to make the screen look
|
||||||
// somewhat coherent regardless of screen type. The 1.778 aspect ratio value is the 16:9
|
// somewhat coherent regardless of screen type. The 1.778 aspect ratio value is the 16:9
|
||||||
// reference.
|
// reference.
|
||||||
float aspectValue = 1.778f / Renderer::getScreenAspectRatio();
|
float aspectValue {1.778f / Renderer::getScreenAspectRatio()};
|
||||||
|
|
||||||
float width =
|
const float maxWidthMultiplier {mRenderer->getIsVerticalOrientation() ? 0.90f : 0.80f};
|
||||||
floorf(glm::clamp(0.60f * aspectValue, 0.60f, 0.80f) * Renderer::getScreenWidth());
|
float width {floorf(glm::clamp(0.60f * aspectValue, 0.60f, maxWidthMultiplier) *
|
||||||
float minWidth = Renderer::getScreenWidth() * 0.3f;
|
mRenderer->getScreenWidth())};
|
||||||
|
const float minWidth {mRenderer->getScreenWidth() * 0.3f};
|
||||||
|
|
||||||
// Decide final width.
|
// Decide final width.
|
||||||
if (mMsg->getSize().x < width && mButtonGrid->getSize().x < width) {
|
if (mMsg->getSize().x < width && mButtonGrid->getSize().x < width) {
|
||||||
|
@ -130,8 +133,8 @@ void GuiMsgBox::changeText(const std::string& newText)
|
||||||
newSize.y *= VERTICAL_PADDING_MODIFIER;
|
newSize.y *= VERTICAL_PADDING_MODIFIER;
|
||||||
mMsg->setSize(newSize);
|
mMsg->setSize(newSize);
|
||||||
|
|
||||||
const float msgHeight = std::max(Font::get(FONT_SIZE_LARGE)->getHeight(), mMsg->getSize().y);
|
const float msgHeight {std::max(Font::get(FONT_SIZE_LARGE)->getHeight(), mMsg->getSize().y)};
|
||||||
setSize(width + std::ceil(HORIZONTAL_PADDING_PX * 2.0f * Renderer::getScreenWidthModifier()),
|
setSize(width + std::ceil(HORIZONTAL_PADDING_PX * 2.0f * mRenderer->getScreenWidthModifier()),
|
||||||
msgHeight + mButtonGrid->getSize().y);
|
msgHeight + mButtonGrid->getSize().y);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -181,7 +184,7 @@ void GuiMsgBox::deleteMeAndCall(const std::function<void()>& func)
|
||||||
|
|
||||||
std::vector<HelpPrompt> GuiMsgBox::getHelpPrompts()
|
std::vector<HelpPrompt> GuiMsgBox::getHelpPrompts()
|
||||||
{
|
{
|
||||||
std::vector<HelpPrompt> prompts = mGrid.getHelpPrompts();
|
std::vector<HelpPrompt> prompts {mGrid.getHelpPrompts()};
|
||||||
|
|
||||||
if (!mDisableBackButton)
|
if (!mDisableBackButton)
|
||||||
prompts.push_back(HelpPrompt("b", "Back"));
|
prompts.push_back(HelpPrompt("b", "Back"));
|
||||||
|
|
|
@ -42,6 +42,7 @@ public:
|
||||||
private:
|
private:
|
||||||
void deleteMeAndCall(const std::function<void()>& func);
|
void deleteMeAndCall(const std::function<void()>& func);
|
||||||
|
|
||||||
|
Renderer* mRenderer;
|
||||||
NinePatchComponent mBackground;
|
NinePatchComponent mBackground;
|
||||||
ComponentGrid mGrid;
|
ComponentGrid mGrid;
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue