diff --git a/THEMES.md b/THEMES.md
index ccb620bc8..5bd183f56 100644
--- a/THEMES.md
+++ b/THEMES.md
@@ -277,7 +277,7 @@ You can now change the order in which elements are rendered by setting `zIndex`
* `carousel name="systemcarousel"` - 40
* `text name="systemInfo"` - 50
-##### basic, detailed, video
+##### basic, detailed, grid, video
* `image name="background"` - 0
* Extra Elements `extra="true"` - 10
* `textlist name="gamelist"` - 20
@@ -471,6 +471,8 @@ Reference
- Displays the name of the system. Only present if no "logo" image is specified. Displayed at the top of the screen, centered by default.
* `image name="logo"` - ALL
- A header image. If a non-empty `path` is specified, `text name="headerText"` will be hidden and this image will be, by default, displayed roughly in its place.
+* `imagegrid name="gamegrid"` - ALL
+ - The gamegrid.
* Metadata
* Labels
@@ -564,7 +566,13 @@ Can be created as an extra.
- Multiply each pixel's color by this color. For example, an all-white image with `FF0000` would become completely red. You can also control the transparency of an image with `FFFFFFAA` - keeping all the pixels their normal color and only affecting the alpha channel.
* `zIndex` - type: FLOAT.
- z-index value for component. Components will be rendered in order of z-index value from low to high.
-
+
+#### imagegrid
+
+* `pos` - type: NORMALIZED_PAIR.
+* `size` - type: NORMALIZED_PAIR.
+ - The size of the grid. Take care the selected tile can go out of the grid size, so don't position the grid too close to another element or the screen border.
+
#### video
* `pos` - type: NORMALIZED_PAIR.
diff --git a/es-app/src/views/gamelist/GridGameListView.cpp b/es-app/src/views/gamelist/GridGameListView.cpp
index 4c802959e..a1496503f 100644
--- a/es-app/src/views/gamelist/GridGameListView.cpp
+++ b/es-app/src/views/gamelist/GridGameListView.cpp
@@ -21,7 +21,6 @@ GridGameListView::GridGameListView(Window* window, FileData* root) :
const float padding = 0.01f;
mGrid.setPosition(mSize.x() * 0.1f, mSize.y() * 0.1f);
-// mGrid.setSize(mSize.x(), mSize.y() * 0.8f);
mGrid.setCursorChangedCallback([&](const CursorState& /*state*/) { updateInfoPanel(); });
addChild(&mGrid);
@@ -125,6 +124,8 @@ void GridGameListView::onThemeChanged(const std::shared_ptr& theme)
using namespace ThemeFlags;
+ mGrid.applyTheme(theme, getName(), "gamegrid", ALL);
+
initMDLabels();
std::vector labels = getMDLabels();
assert(labels.size() == 8);
diff --git a/es-core/src/ThemeData.cpp b/es-core/src/ThemeData.cpp
index 5ce54cf9a..9df845a74 100644
--- a/es-core/src/ThemeData.cpp
+++ b/es-core/src/ThemeData.cpp
@@ -25,6 +25,9 @@ std::map> The
{ "tile", BOOLEAN },
{ "color", COLOR },
{ "zIndex", FLOAT } } },
+ { "imagegrid", {
+ { "pos", NORMALIZED_PAIR },
+ { "size", NORMALIZED_PAIR } } },
{ "text", {
{ "pos", NORMALIZED_PAIR },
{ "size", NORMALIZED_PAIR },
diff --git a/es-core/src/components/ImageGridComponent.h b/es-core/src/components/ImageGridComponent.h
index e488a3be6..7cadd080e 100644
--- a/es-core/src/components/ImageGridComponent.h
+++ b/es-core/src/components/ImageGridComponent.h
@@ -38,6 +38,7 @@ public:
bool input(InputConfig* config, Input input) override;
void update(int deltaTime) override;
void render(const Transform4x4f& parentTrans) override;
+ virtual void applyTheme(const std::shared_ptr& theme, const std::string& view, const std::string& element, unsigned int properties) override;
inline void setCursorChangedCallback(const std::function& func) { mCursorChangedCallback = func; }
@@ -74,10 +75,10 @@ ImageGridComponent::ImageGridComponent(Window* window) : IList
@@ -173,6 +174,12 @@ void ImageGridComponent::render(const Transform4x4f& parentTrans)
GuiComponent::renderChildren(trans);
}
+template
+void ImageGridComponent::applyTheme(const std::shared_ptr& theme, const std::string& view, const std::string& element, unsigned int properties)
+{
+ GuiComponent::applyTheme(theme, view, element, properties);
+}
+
template
void ImageGridComponent::onCursorChanged(const CursorState& state)
{