From 346d53b0342d8a1d543887560a28cc45f211d9ad Mon Sep 17 00:00:00 2001
From: Bastien Bouclet
Date: Sat, 28 Dec 2019 10:43:58 +0100
Subject: GUI: Add finer control over cross-direction alignment for layout
items
Previously it was only possible to specify whether items where aligned
to the start or centered in the cross direction of the layouts. It is
now additionally possible to align the items to the far end of the cross
direction or to resize them to match the size of the layout.
Terminology and behavior are loosely based on CSS's flexbox containers.
---
gui/ThemeEval.cpp | 4 +-
gui/ThemeEval.h | 2 +-
gui/ThemeLayout.cpp | 64 +++--
gui/ThemeLayout.h | 15 +-
gui/ThemeParser.cpp | 23 +-
gui/ThemeParser.h | 2 +-
gui/themes/default.inc | 306 ++++++++++-----------
gui/themes/scummclassic.zip | Bin 157670 -> 157827 bytes
gui/themes/scummclassic/classic_layout.stx | 146 +++++-----
gui/themes/scummclassic/classic_layout_lowres.stx | 160 +++++------
gui/themes/scummmodern.zip | Bin 287826 -> 287886 bytes
gui/themes/scummmodern/scummmodern_layout.stx | 183 ++++++------
.../scummmodern/scummmodern_layout_lowres.stx | 162 +++++------
gui/themes/scummremastered.zip | Bin 285870 -> 285930 bytes
gui/themes/scummremastered/remastered_layout.stx | 183 ++++++------
.../scummremastered/remastered_layout_lowres.stx | 162 +++++------
16 files changed, 729 insertions(+), 683 deletions(-)
diff --git a/gui/ThemeEval.cpp b/gui/ThemeEval.cpp
index 66b5db5fb7..3eede27cca 100644
--- a/gui/ThemeEval.cpp
+++ b/gui/ThemeEval.cpp
@@ -130,13 +130,13 @@ void ThemeEval::addDialog(const Common::String &name, const Common::String &over
setVar(var + ".Enabled", enabled ? 1 : 0);
}
-void ThemeEval::addLayout(ThemeLayout::LayoutType type, int spacing, bool center) {
+void ThemeEval::addLayout(ThemeLayout::LayoutType type, int spacing, ThemeLayout::ItemAlign itemAlign) {
ThemeLayout *layout = 0;
if (spacing == -1)
spacing = getVar("Globals.Layout.Spacing", 4);
- layout = new ThemeLayoutStacked(_curLayout.top(), type, spacing, center);
+ layout = new ThemeLayoutStacked(_curLayout.top(), type, spacing, itemAlign);
assert(layout);
diff --git a/gui/ThemeEval.h b/gui/ThemeEval.h
index 520c280427..57c3a7c082 100644
--- a/gui/ThemeEval.h
+++ b/gui/ThemeEval.h
@@ -75,7 +75,7 @@ public:
bool hasVar(const Common::String &name) { return _vars.contains(name) || _builtin.contains(name); }
void addDialog(const Common::String &name, const Common::String &overlays, bool enabled = true, int inset = 0);
- void addLayout(ThemeLayout::LayoutType type, int spacing, bool center = false);
+ void addLayout(ThemeLayout::LayoutType type, int spacing, ThemeLayout::ItemAlign itemAlign);
void addWidget(const Common::String &name, int w, int h, const Common::String &type, bool enabled = true, Graphics::TextAlign align = Graphics::kTextAlignLeft);
bool addImportedLayout(const Common::String &name);
void addSpace(int size);
diff --git a/gui/ThemeLayout.cpp b/gui/ThemeLayout.cpp
index eeaaf1e465..10347f0ab9 100644
--- a/gui/ThemeLayout.cpp
+++ b/gui/ThemeLayout.cpp
@@ -250,12 +250,11 @@ void ThemeLayoutMain::reflowLayout(Widget *widgetChain) {
}
void ThemeLayoutStacked::reflowLayoutVertical(Widget *widgetChain) {
- int curX, curY;
+ int curY;
int resize[8];
int rescount = 0;
bool fixedWidth = _w != -1;
- curX = _padding.left;
curY = _padding.top;
_h = _padding.top + _padding.bottom;
@@ -275,12 +274,6 @@ void ThemeLayoutStacked::reflowLayoutVertical(Widget *widgetChain) {
_children[i]->offsetY(curY);
- // Center child if it this has been requested *and* the space permits it.
- if (_centered && _children[i]->getWidth() < (_w - _padding.left - _padding.right) && _w != -1) {
- _children[i]->offsetX((_w >> 1) - (_children[i]->getWidth() >> 1));
- } else
- _children[i]->offsetX(curX);
-
// Advance the vertical offset by the height of the newest item, plus
// the item spacing value.
curY += _children[i]->getHeight() + _spacing;
@@ -302,6 +295,29 @@ void ThemeLayoutStacked::reflowLayoutVertical(Widget *widgetChain) {
_w = 0;
}
+ for (uint i = 0; i < _children.size(); ++i) {
+ switch (_itemAlign) {
+ case kItemAlignStart:
+ _children[i]->offsetX(_padding.left);
+ break;
+ case kItemAlignCenter:
+ // Center child if it this has been requested *and* the space permits it.
+ if (_children[i]->getWidth() < (_w - _padding.left - _padding.right)) {
+ _children[i]->offsetX((_w >> 1) - (_children[i]->getWidth() >> 1));
+ } else {
+ _children[i]->offsetX(_padding.left);
+ }
+ break;
+ case kItemAlignEnd:
+ _children[i]->offsetX(_w - _children[i]->getWidth() - _padding.right);
+ break;
+ case kItemAlignStretch:
+ _children[i]->offsetX(_padding.left);
+ _children[i]->setWidth(_w - _padding.left - _padding.right);
+ break;
+ }
+ }
+
// If there were any items with undetermined height, then compute and set
// their height now. We do so by determining how much space is left, and
// then distributing this equally over all items which need auto-resizing.
@@ -321,13 +337,12 @@ void ThemeLayoutStacked::reflowLayoutVertical(Widget *widgetChain) {
}
void ThemeLayoutStacked::reflowLayoutHorizontal(Widget *widgetChain) {
- int curX, curY;
+ int curX;
int resize[8];
int rescount = 0;
bool fixedHeight = _h != -1;
curX = _padding.left;
- curY = _padding.top;
_w = _padding.left + _padding.right;
for (uint i = 0; i < _children.size(); ++i) {
@@ -346,12 +361,6 @@ void ThemeLayoutStacked::reflowLayoutHorizontal(Widget *widgetChain) {
_children[i]->offsetX(curX);
- // Center child if it this has been requested *and* the space permits it.
- if (_centered && _children[i]->getHeight() < (_h - _padding.top - _padding.bottom) && _h != -1)
- _children[i]->offsetY((_h >> 1) - (_children[i]->getHeight() >> 1));
- else
- _children[i]->offsetY(curY);
-
// Advance the horizontal offset by the width of the newest item, plus
// the item spacing value.
curX += (_children[i]->getWidth() + _spacing);
@@ -373,6 +382,29 @@ void ThemeLayoutStacked::reflowLayoutHorizontal(Widget *widgetChain) {
_h = 0;
}
+ for (uint i = 0; i < _children.size(); ++i) {
+ switch (_itemAlign) {
+ case kItemAlignStart:
+ _children[i]->offsetY(_padding.top);
+ break;
+ case kItemAlignCenter:
+ // Center child if it this has been requested *and* the space permits it.
+ if (_children[i]->getHeight() < (_h - _padding.top - _padding.bottom)) {
+ _children[i]->offsetY((_h >> 1) - (_children[i]->getHeight() >> 1));
+ } else {
+ _children[i]->offsetY(_padding.top);
+ }
+ break;
+ case kItemAlignEnd:
+ _children[i]->offsetY(_h - _children[i]->getHeight() - _padding.bottom);
+ break;
+ case kItemAlignStretch:
+ _children[i]->offsetY(_padding.top);
+ _children[i]->setHeight(_w - _padding.top - _padding.bottom);
+ break;
+ }
+ }
+
// If there were any items with undetermined width, then compute and set
// their width now. We do so by determining how much space is left, and
// then distributing this equally over all items which need auto-resizing.
diff --git a/gui/ThemeLayout.h b/gui/ThemeLayout.h
index a99de5a99c..0bfe7f7f22 100644
--- a/gui/ThemeLayout.h
+++ b/gui/ThemeLayout.h
@@ -52,6 +52,14 @@ public:
kLayoutSpace
};
+ /// Cross-direction alignment of layout children.
+ enum ItemAlign {
+ kItemAlignStart, ///< Items are aligned to the left for vertical layouts or to the top for horizontal layouts
+ kItemAlignCenter, ///< Items are centered in the container
+ kItemAlignEnd, ///< Items are aligned to the right for vertical layouts or to the bottom for horizontal layouts
+ kItemAlignStretch ///< Items are resized to match the size of the layout in the cross-direction
+ };
+
ThemeLayout(ThemeLayout *p) :
_parent(p), _x(0), _y(0), _w(-1), _h(-1),
_defaultW(-1), _defaultH(-1),
@@ -167,11 +175,10 @@ protected:
class ThemeLayoutStacked : public ThemeLayout {
public:
- ThemeLayoutStacked(ThemeLayout *p, LayoutType type, int spacing, bool center) :
- ThemeLayout(p), _type(type), _centered(center) {
+ ThemeLayoutStacked(ThemeLayout *p, LayoutType type, int spacing, ItemAlign itemAlign) :
+ ThemeLayout(p), _type(type), _itemAlign(itemAlign) {
assert((type == kLayoutVertical) || (type == kLayoutHorizontal));
_spacing = spacing;
- _centered = center;
}
void reflowLayout(Widget *widgetChain) override {
@@ -208,7 +215,7 @@ protected:
}
const LayoutType _type;
- bool _centered;
+ ItemAlign _itemAlign;
int8 _spacing;
};
diff --git a/gui/ThemeParser.cpp b/gui/ThemeParser.cpp
index b92dd334f3..f48ba6b8ad 100644
--- a/gui/ThemeParser.cpp
+++ b/gui/ThemeParser.cpp
@@ -765,23 +765,36 @@ bool ThemeParser::parserCallback_import(ParserNode *node) {
bool ThemeParser::parserCallback_layout(ParserNode *node) {
int spacing = -1;
- bool center = false;
if (node->values.contains("spacing")) {
if (!parseIntegerKey(node->values["spacing"], 1, &spacing))
return false;
}
- (void)Common::parseBool(node->values["center"], center);
+ ThemeLayout::ItemAlign itemAlign = ThemeLayout::kItemAlignStart;
+
+ if (node->values.contains("align")) {
+ Common::String val = node->values["align"];
+ if (val == "start") {
+ itemAlign = ThemeLayout::kItemAlignStart;
+ } else if (val == "center") {
+ itemAlign = ThemeLayout::kItemAlignCenter;
+ } else if (val == "end") {
+ itemAlign = ThemeLayout::kItemAlignEnd;
+ } else if (val == "stretch") {
+ itemAlign = ThemeLayout::kItemAlignStretch;
+ } else {
+ return parserError("'" + val + "' is not a valid item alignment for a layout.");
+ }
+ }
if (node->values["type"] == "vertical")
- _theme->getEvaluator()->addLayout(GUI::ThemeLayout::kLayoutVertical, spacing, center);
+ _theme->getEvaluator()->addLayout(GUI::ThemeLayout::kLayoutVertical, spacing, itemAlign);
else if (node->values["type"] == "horizontal")
- _theme->getEvaluator()->addLayout(GUI::ThemeLayout::kLayoutHorizontal, spacing, center);
+ _theme->getEvaluator()->addLayout(GUI::ThemeLayout::kLayoutHorizontal, spacing, itemAlign);
else
return parserError("Invalid layout type. Only 'horizontal' and 'vertical' layouts allowed.");
-
if (node->values.contains("padding")) {
int paddingL, paddingR, paddingT, paddingB;
diff --git a/gui/ThemeParser.h b/gui/ThemeParser.h
index f55a24aa80..890a86d227 100644
--- a/gui/ThemeParser.h
+++ b/gui/ThemeParser.h
@@ -189,7 +189,7 @@ protected:
XML_PROP(inset, false)
XML_KEY(layout)
XML_PROP(type, true)
- XML_PROP(center, false)
+ XML_PROP(align, false)
XML_PROP(padding, false)
XML_PROP(spacing, false)
diff --git a/gui/themes/default.inc b/gui/themes/default.inc
index 90730e49db..8a56822ba9 100644
--- a/gui/themes/default.inc
+++ b/gui/themes/default.inc
@@ -1005,7 +1005,7 @@ const char *defaultXML1 = ""
"/>"
""
""
""
""
""
""
""
""
""
""
""
""
""
""
""
""
""
""
""
""
""
""
""
""
""
"