ADD: RessourceWidgets (more or less working)

This commit is contained in:
sebastian 2026-02-13 08:40:39 +01:00
parent 0ebdd76b04
commit 9a05a0c854
9 changed files with 124 additions and 21 deletions

View File

@ -147,6 +147,8 @@ add_executable(Dicewars_Siedler src/main.cpp
src/engine/core/gui/uiComponent/UiButton.h src/engine/core/gui/uiComponent/UiButton.h
src/engine/renderer/model/GUIText.cpp src/engine/renderer/model/GUIText.cpp
src/engine/renderer/model/GUIText.h src/engine/renderer/model/GUIText.h
src/game/ui/components/UiRessourceWidget.cpp
src/game/ui/components/UiRessourceWidget.h
) )
target_include_directories(Dicewars_Siedler PRIVATE target_include_directories(Dicewars_Siedler PRIVATE

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 KiB

View File

@ -7,6 +7,7 @@
#include "../UiComponent.h" #include "../UiComponent.h"
#include "../UiText.h" #include "../UiText.h"
#include "../../../Application.h" #include "../../../Application.h"
#include "../../../../../game/ui/components/UiRessourceWidget.h"
#include "../../text/Font.h" #include "../../text/Font.h"
void UiPositioner::compute(const Dimensions &parent) { void UiPositioner::compute(const Dimensions &parent) {
@ -25,9 +26,11 @@ void UiPositioner::compute(const Dimensions &parent) {
// 3. Kinder rekursiv positionieren mit JustifyContent // 3. Kinder rekursiv positionieren mit JustifyContent
for (auto& child : uiComponent.children) { for (auto& child : uiComponent.children) {
child->uiPositioner.compute(screenSpace); child->uiPositioner.compute(screenSpace);
} }
float totalChildrenMainSize = 0.0f; float totalChildrenMainSize = 0.0f;
// 3a. Gesamtgröße der Kinder berechnen (inkl. Top/Left Margins) // 3a. Gesamtgröße der Kinder berechnen (inkl. Top/Left Margins)
for (auto& child : uiComponent.children) { for (auto& child : uiComponent.children) {
@ -63,6 +66,7 @@ void UiPositioner::compute(const Dimensions &parent) {
} }
// 3. Kinder rekursiv positionieren // 3. Kinder rekursiv positionieren
float currentMainOffset = justifyOffset; float currentMainOffset = justifyOffset;
bool first = true; bool first = true;
@ -72,13 +76,13 @@ void UiPositioner::compute(const Dimensions &parent) {
} }
if (style.flexDirection == FlexDirection::Column) { if (style.flexDirection == FlexDirection::Column) {
child->uiPositioner.screenSpace.y = screenSpace.y + currentMainOffset; child->uiPositioner.offsetPosition(0.f,currentMainOffset);
currentMainOffset += child->uiPositioner.screenSpace.height; currentMainOffset += child->uiPositioner.screenSpace.height;
currentMainOffset += child->uiPositioner.resolve(child->uiPositioner.style.margin.top, parent.height, screenHeight); currentMainOffset += child->uiPositioner.resolve(child->uiPositioner.style.margin.top, screenSpace.height, screenHeight);
} else { } else {
child->uiPositioner.screenSpace.x += currentMainOffset; child->uiPositioner.offsetPosition(currentMainOffset,0.f);
currentMainOffset += child->uiPositioner.screenSpace.width; currentMainOffset += child->uiPositioner.screenSpace.width;
currentMainOffset += child->uiPositioner.resolve(child->uiPositioner.style.margin.left, parent.width, screenWidth); currentMainOffset += child->uiPositioner.resolve(child->uiPositioner.style.margin.left, screenSpace.width, screenWidth);
} }
first = false; first = false;
@ -91,18 +95,16 @@ void UiPositioner::compute(const Dimensions &parent) {
float remainingCrossSpace = screenSpace.width - child->uiPositioner.screenSpace.width ; float remainingCrossSpace = screenSpace.width - child->uiPositioner.screenSpace.width ;
switch (style.alignItems) { switch (style.alignItems) {
case AlignItems::Start: case AlignItems::Start:
child->uiPositioner.screenSpace.x = screenSpace.x + marginLeft; child->uiPositioner.updatePosition(screenSpace.x + marginLeft, child->uiPositioner.screenSpace.y);
break; break;
case AlignItems::Center: case AlignItems::Center:
child->uiPositioner.screenSpace.x = child->uiPositioner.updatePosition(screenSpace.x + remainingCrossSpace / 2.0f + marginLeft, child->uiPositioner.screenSpace.y);
screenSpace.x + remainingCrossSpace / 2.0f + marginLeft;
break; break;
case AlignItems::End: case AlignItems::End:
child->uiPositioner.screenSpace.x = screenSpace.x + remainingCrossSpace + marginLeft; child->uiPositioner.updatePosition(screenSpace.x + remainingCrossSpace + marginLeft, child->uiPositioner.screenSpace.y);
break; break;
default: default:
break; break;
} }
@ -111,17 +113,15 @@ void UiPositioner::compute(const Dimensions &parent) {
float marginTop = child->uiPositioner.resolve(child->uiPositioner.style.margin.top,screenSpace.height,screenHeight); float marginTop = child->uiPositioner.resolve(child->uiPositioner.style.margin.top,screenSpace.height,screenHeight);
switch (style.alignItems) { switch (style.alignItems) {
case AlignItems::Start: case AlignItems::Start:
child->uiPositioner.screenSpace.y = screenSpace.y + marginTop; child->uiPositioner.updatePosition(child->uiPositioner.screenSpace.x, screenSpace.y + marginTop);
break; break;
case AlignItems::Center: case AlignItems::Center:
child->uiPositioner.screenSpace.y = child->uiPositioner.updatePosition(child->uiPositioner.screenSpace.x, screenSpace.y + remainingCrossSpace / 2.0f + marginTop);
screenSpace.y + remainingCrossSpace / 2.0f + marginTop;
break; break;
case AlignItems::End: case AlignItems::End:
child->uiPositioner.screenSpace.y = child->uiPositioner.updatePosition(child->uiPositioner.screenSpace.x, screenSpace.y + remainingCrossSpace + marginTop);
screenSpace.y + remainingCrossSpace + marginTop;
break; break;
default: default:
@ -130,6 +130,7 @@ void UiPositioner::compute(const Dimensions &parent) {
} }
} }
} }
LayoutStyle & UiPositioner::getLayout() { LayoutStyle & UiPositioner::getLayout() {
@ -152,4 +153,22 @@ float UiPositioner::resolve(const SizeValue &size, float parentSize, float axisL
} }
} }
void UiPositioner::offsetPosition(float dx, float dy) {
screenSpace.x += dx;
screenSpace.y += dy;
for (auto& child : uiComponent.children) {
child->uiPositioner.offsetPosition(dx, dy);
}
}
void UiPositioner::updatePosition(float newX, float newY) {
screenSpace.x = newX;
screenSpace.y = newY;
for (auto& child : uiComponent.children) {
child->uiPositioner.updatePosition(newX, newY);
}
}

View File

@ -27,6 +27,8 @@ private:
LayoutStyle style; LayoutStyle style;
float resolve(const SizeValue &size, float parentSize, float axisLength); float resolve(const SizeValue &size, float parentSize, float axisLength);
void offsetPosition(float dx, float dy);
void updatePosition(float newX, float newY);
}; };

View File

@ -13,6 +13,7 @@
#include "../engine/core/gui/uiComponent/UiText.h" #include "../engine/core/gui/uiComponent/UiText.h"
#include "../engine/renderer/loader/Loader.h" #include "../engine/renderer/loader/Loader.h"
#include "../engine/renderer/model/GUITexture.h" #include "../engine/renderer/model/GUITexture.h"
#include "ui/components/UiRessourceWidget.h"
UILayer::UILayer() { UILayer::UILayer() {
Loader& loader = Loader::instance(); Loader& loader = Loader::instance();
@ -24,10 +25,8 @@ void UILayer::onAttach() {
Layer::onAttach(); Layer::onAttach();
rootContainer = std::make_unique<UiContainer>(); rootContainer = std::make_unique<UiContainer>();
LayoutStyle& rootLayout = rootContainer->getLayoutStyle(); rootContainer->getLayoutStyle().flexDirection = FlexDirection::Row;
rootLayout.justifyContent = JustifyContent::End;
auto imageStyle = LayoutStyle(); auto imageStyle = LayoutStyle();
imageStyle.width = SizeValue(0.25f, SizeUnit::Percent); imageStyle.width = SizeValue(0.25f, SizeUnit::Percent);
@ -60,7 +59,44 @@ void UILayer::onAttach() {
std::cout << "Button Clicked!" << std::endl; std::cout << "Button Clicked!" << std::endl;
}); });
rootContainer->addChild(std::move(button)); //rootContainer->addChild(std::move(button));
auto inventoryContainer = std::make_unique<UiContainer>();
inventoryContainer->getLayoutStyle().flexDirection = FlexDirection::Row;
inventoryContainer->getLayoutStyle().width = SizeValue(300.f, SizeUnit::Pixels); // Platz für mehrere Ressourcen
inventoryContainer->getLayoutStyle().height = SizeValue(60.f, SizeUnit::Pixels);
inventoryContainer->getLayoutStyle().margin.left = {100.f, SizeUnit::Pixels};
inventoryContainer->getLayoutStyle().alignItems = AlignItems::Center;
smallFont =std::make_unique<Font>("/usr/share/fonts/TTF/DejaVuSans.ttf", 18);
LayoutStyle iconStyle;
iconStyle.width = SizeValue(60.f, SizeUnit::Pixels);
iconStyle.height = SizeValue(60.f,SizeUnit::Pixels);
LayoutStyle textStyle;
textStyle.margin.top = {2.f, SizeUnit::Pixels};
textStyle.width = SizeValue(1.f, SizeUnit::Percent);
textStyle.height = SizeValue(30.f, SizeUnit::Percent); // Rest für Text
LayoutStyle containerStyle;
containerStyle.width = SizeValue(60.f, SizeUnit::Pixels); // genug Platz für Icon + Text
containerStyle.height = SizeValue(60.f, SizeUnit::Pixels);
containerStyle.flexDirection = FlexDirection::Column;
containerStyle.alignItems = AlignItems::Center; // ganz wichtig für horizontale Zentrierung
LayoutStyle container2Style;
container2Style.width = SizeValue(60.f, SizeUnit::Pixels); // genug Platz für Icon + Text
container2Style.height = SizeValue(60.f, SizeUnit::Pixels);
container2Style.flexDirection = FlexDirection::Column;
container2Style.alignItems = AlignItems::Center; // ganz wichtig für horizontale Zentrierung
container2Style.margin.left = {10.f, SizeUnit::Pixels};
auto wood_widget = std::make_unique<UiRessourceWidget>(Loader::instance().loadTextureFromFile("assets/ui/ressource-icons/wood-log.png").getTextureID(), 10, *smallFont, containerStyle, iconStyle, textStyle);
auto stone_widget = std::make_unique<UiRessourceWidget>(Loader::instance().loadTextureFromFile("assets/ui/ressource-icons/granite.png").getTextureID(), 1139, *smallFont, containerStyle, iconStyle, textStyle);
rootContainer->addChild(std::move(wood_widget));
rootContainer->addChild(std::move(stone_widget));
} }
void UILayer::onUpdate() { void UILayer::onUpdate() {

View File

@ -18,6 +18,7 @@ private:
std::unique_ptr<GUIRenderer> guiRenderer; std::unique_ptr<GUIRenderer> guiRenderer;
std::unique_ptr<TextRenderer> textRenderer; std::unique_ptr<TextRenderer> textRenderer;
std::unique_ptr<Font> font; std::unique_ptr<Font> font;
std::unique_ptr<Font> smallFont;
std::unique_ptr<UiContainer> rootContainer; std::unique_ptr<UiContainer> rootContainer;
public: public:
UILayer(); UILayer();

View File

@ -0,0 +1,21 @@
//
// Created by sebastian on 12.02.26.
//
#include "UiRessourceWidget.h"
#include "../../../engine/core/gui/uiComponent/UiText.h"
UiRessourceWidget::UiRessourceWidget(GLuint iconTextureID, int amount, Font &font, LayoutStyle &containerStyle,
LayoutStyle &iconStyle, LayoutStyle &textStyle) : UiComponent(containerStyle) {
icon = std::make_unique<UiImage>(iconTextureID, iconStyle);
text = std::make_unique<UiText>(font, std::to_string(amount), textStyle);
addChild(std::move(icon));
addChild(std::move(text));
}
void UiRessourceWidget::setAmount(int newAmount) {
text->setText(std::to_string(newAmount));
}

View File

@ -0,0 +1,22 @@
//
// Created by sebastian on 12.02.26.
//
#ifndef DICEWARS_SIEDLER_UIRESSOURCEWIDGET_H
#define DICEWARS_SIEDLER_UIRESSOURCEWIDGET_H
#include "../../../engine/core/gui/uiComponent/UiComponent.h"
#include "../../../engine/core/gui/uiComponent/UiImage.h"
#include "../../../engine/core/gui/uiMain/UiContainer.h"
class UiRessourceWidget : public UiComponent {
public:
UiRessourceWidget(GLuint iconTextureID, int amount, Font& font, LayoutStyle& containerStyle, LayoutStyle& iconStyle, LayoutStyle& textStyle);
void setAmount(int newAmount);
private:
std::unique_ptr<UiImage> icon;
std::unique_ptr<UiText> text;
};
#endif //DICEWARS_SIEDLER_UIRESSOURCEWIDGET_H