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 {
|
||||
// Scale the corner size relative to the screen resolution (using the medium sized
|
||||
// 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);
|
||||
}
|
||||
|
||||
|
|
|
@ -235,7 +235,7 @@ CarouselComponent<T>::CarouselComponent()
|
|||
, mColorGradientHorizontal {true}
|
||||
, mTextColor {0x000000FF}
|
||||
, mTextBackgroundColor {0xFFFFFF00}
|
||||
, mFont {Font::get(FONT_SIZE_LARGE)}
|
||||
, mFont {Font::get(FONT_SIZE_LARGE_FIXED)}
|
||||
, mLetterCase {LetterCase::NONE}
|
||||
, mLetterCaseAutoCollections {LetterCase::UNDEFINED}
|
||||
, mLetterCaseCustomCollections {LetterCase::UNDEFINED}
|
||||
|
|
|
@ -171,7 +171,7 @@ TextListComponent<T>::TextListComponent()
|
|||
, mLoopScroll {false}
|
||||
, mGamelistView {std::is_same_v<T, FileData*> ? true : false}
|
||||
, mLegacyMode {false}
|
||||
, mFont {Font::get(FONT_SIZE_MEDIUM)}
|
||||
, mFont {Font::get(FONT_SIZE_MEDIUM_FIXED)}
|
||||
, mSelectorHeight {mFont->getSize() * 1.5f}
|
||||
, mSelectorHorizontalOffset {0.0f}
|
||||
, mSelectorVerticalOffset {0.0f}
|
||||
|
|
|
@ -22,6 +22,7 @@ GuiDetectDevice::GuiDetectDevice(bool firstRun,
|
|||
const std::function<void()>& doneCallback)
|
||||
: mFirstRun {firstRun}
|
||||
, mForcedConfig {forcedConfig}
|
||||
, mRenderer {Renderer::getInstance()}
|
||||
, mBackground {":/graphics/frame.svg"}
|
||||
, 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
|
||||
// regardless of screen type. The 1.778 aspect ratio value is the 16:9 reference.
|
||||
float aspectValue {1.778f / Renderer::getScreenAspectRatio()};
|
||||
float width {glm::clamp(0.60f * aspectValue, 0.50f, 0.80f) * Renderer::getScreenWidth()};
|
||||
const float aspectValue {1.778f / mRenderer->getScreenAspectRatio()};
|
||||
const float width {glm::clamp(0.60f * aspectValue, 0.50f,
|
||||
(mRenderer->getIsVerticalOrientation() ? 0.85f : 0.80f)) *
|
||||
mRenderer->getScreenWidth()};
|
||||
|
||||
setSize(width, Renderer::getScreenHeight() * 0.5f);
|
||||
setPosition((Renderer::getScreenWidth() - mSize.x) / 2.0f,
|
||||
(Renderer::getScreenHeight() - mSize.y) / 2.0f);
|
||||
setSize(width, mRenderer->getScreenHeight() * 0.5f);
|
||||
setPosition((mRenderer->getScreenWidth() - mSize.x) / 2.0f,
|
||||
(mRenderer->getScreenHeight() - mSize.y) / 2.0f);
|
||||
}
|
||||
|
||||
void GuiDetectDevice::onSizeChanged()
|
||||
|
|
|
@ -30,6 +30,7 @@ private:
|
|||
InputConfig* mHoldingConfig;
|
||||
int mHoldTime;
|
||||
|
||||
Renderer* mRenderer;
|
||||
NinePatchComponent mBackground;
|
||||
ComponentGrid mGrid;
|
||||
|
||||
|
|
|
@ -187,7 +187,8 @@ GuiInputConfig::GuiInputConfig(InputConfig* target,
|
|||
float aspectValue {1.778f / Renderer::getScreenAspectRatio()};
|
||||
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,
|
||||
(Renderer::getScreenHeight() - mSize.y) / 2.0f);
|
||||
}
|
||||
|
|
|
@ -25,7 +25,8 @@ GuiMsgBox::GuiMsgBox(const HelpStyle& helpstyle,
|
|||
const std::function<void()>& func3,
|
||||
bool disableBackButton,
|
||||
bool deleteOnButtonPress)
|
||||
: mBackground {":/graphics/frame.svg"}
|
||||
: mRenderer {Renderer::getInstance()}
|
||||
, mBackground {":/graphics/frame.svg"}
|
||||
, mGrid {glm::ivec2 {1, 2}}
|
||||
, mHelpStyle {helpstyle}
|
||||
, 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
|
||||
// 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 {
|
||||
floorf(glm::clamp(0.60f * aspectValue, 0.60f, 0.80f) * Renderer::getScreenWidth())};
|
||||
float minWidth {
|
||||
floorf(glm::clamp(0.30f * aspectValue, 0.10f, 0.50f) * Renderer::getScreenWidth())};
|
||||
const float maxWidthMultiplier {mRenderer->getIsVerticalOrientation() ? 0.90f : 0.80f};
|
||||
float width {floorf(glm::clamp(0.60f * aspectValue, 0.60f, maxWidthMultiplier) *
|
||||
mRenderer->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,
|
||||
ALIGN_CENTER);
|
||||
|
@ -85,14 +87,14 @@ GuiMsgBox::GuiMsgBox(const HelpStyle& helpstyle,
|
|||
|
||||
// Now that we know width, we can find height.
|
||||
mMsg->setSize(width, 0.0f); // mMsg->getSize.y() now returns the proper length.
|
||||
const float msgHeight = std::max(Font::get(FONT_SIZE_LARGE)->getHeight(),
|
||||
mMsg->getSize().y * VERTICAL_PADDING_MODIFIER);
|
||||
setSize(width + std::ceil(HORIZONTAL_PADDING_PX * 2.0f * Renderer::getScreenWidthModifier()),
|
||||
const float msgHeight {std::max(Font::get(FONT_SIZE_LARGE)->getHeight(),
|
||||
mMsg->getSize().y * VERTICAL_PADDING_MODIFIER)};
|
||||
setSize(width + std::ceil(HORIZONTAL_PADDING_PX * 2.0f * mRenderer->getScreenWidthModifier()),
|
||||
msgHeight + mButtonGrid->getSize().y);
|
||||
|
||||
// Center for good measure.
|
||||
setPosition((Renderer::getScreenWidth() - mSize.x) / 2.0f,
|
||||
(Renderer::getScreenHeight() - mSize.y) / 2.0f);
|
||||
setPosition((mRenderer->getScreenWidth() - mSize.x) / 2.0f,
|
||||
(mRenderer->getScreenHeight() - mSize.y) / 2.0f);
|
||||
|
||||
addChild(&mBackground);
|
||||
addChild(&mGrid);
|
||||
|
@ -101,18 +103,19 @@ GuiMsgBox::GuiMsgBox(const HelpStyle& helpstyle,
|
|||
void GuiMsgBox::changeText(const std::string& newText)
|
||||
{
|
||||
mMsg->setText(newText);
|
||||
glm::vec2 newSize = mMsg->getFont()->sizeText(newText);
|
||||
glm::vec2 newSize {mMsg->getFont()->sizeText(newText)};
|
||||
newSize.y *= VERTICAL_PADDING_MODIFIER;
|
||||
mMsg->setSize(newSize);
|
||||
|
||||
// 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
|
||||
// reference.
|
||||
float aspectValue = 1.778f / Renderer::getScreenAspectRatio();
|
||||
float aspectValue {1.778f / Renderer::getScreenAspectRatio()};
|
||||
|
||||
float width =
|
||||
floorf(glm::clamp(0.60f * aspectValue, 0.60f, 0.80f) * Renderer::getScreenWidth());
|
||||
float minWidth = Renderer::getScreenWidth() * 0.3f;
|
||||
const float maxWidthMultiplier {mRenderer->getIsVerticalOrientation() ? 0.90f : 0.80f};
|
||||
float width {floorf(glm::clamp(0.60f * aspectValue, 0.60f, maxWidthMultiplier) *
|
||||
mRenderer->getScreenWidth())};
|
||||
const float minWidth {mRenderer->getScreenWidth() * 0.3f};
|
||||
|
||||
// Decide final 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;
|
||||
mMsg->setSize(newSize);
|
||||
|
||||
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()),
|
||||
const float msgHeight {std::max(Font::get(FONT_SIZE_LARGE)->getHeight(), mMsg->getSize().y)};
|
||||
setSize(width + std::ceil(HORIZONTAL_PADDING_PX * 2.0f * mRenderer->getScreenWidthModifier()),
|
||||
msgHeight + mButtonGrid->getSize().y);
|
||||
}
|
||||
|
||||
|
@ -181,7 +184,7 @@ void GuiMsgBox::deleteMeAndCall(const std::function<void()>& func)
|
|||
|
||||
std::vector<HelpPrompt> GuiMsgBox::getHelpPrompts()
|
||||
{
|
||||
std::vector<HelpPrompt> prompts = mGrid.getHelpPrompts();
|
||||
std::vector<HelpPrompt> prompts {mGrid.getHelpPrompts()};
|
||||
|
||||
if (!mDisableBackButton)
|
||||
prompts.push_back(HelpPrompt("b", "Back"));
|
||||
|
|
|
@ -42,6 +42,7 @@ public:
|
|||
private:
|
||||
void deleteMeAndCall(const std::function<void()>& func);
|
||||
|
||||
Renderer* mRenderer;
|
||||
NinePatchComponent mBackground;
|
||||
ComponentGrid mGrid;
|
||||
|
||||
|
|
Loading…
Reference in a new issue