3 Commits

Author SHA1 Message Date
36b537365b feat(ui): add int slider support and fix update_text_scale calls 2026-07-15 11:47:45 +08:00
e1818cccfb feat(ui): add label and image support to slider
- Add `set_text()`, `set_track_image()`, `set_thumb_image()` methods.
- Include label rendering and auto-scaling based on slider dimensions.
- Replace static `THUMB_WIDTH` with dynamic thumb sizing.
- Add slider thumb and track texture assets.
2026-07-15 11:35:05 +08:00
8706723d53 refactor(ui): simplify Button API with property setters 2026-07-15 11:06:49 +08:00
14 changed files with 221 additions and 101 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 143 B

After

Width:  |  Height:  |  Size: 215 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 120 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 174 B

View File

@@ -18,41 +18,35 @@ public:
bool handle_mouse_move_event(const MouseMoveEvent& e) override;
bool handle_mouse_button_event(const MouseButtonEvent& e) override;
void set_window_size(int width, int height) override;
Button& set_scale(float scale);
Widget& set_anchor(Anchor anchor) override;
Widget& set_offset(glm::ivec2 offset) override;
glm::vec2 pos() const override;
float width() const override;
float height() const override;
Button& set_width(float width);
Button& set_height(float height);
Button& set_background_image(const std::string& path,
TextureManager& texture_manager);
Button& set_text(const std::string& text);
float scale() const;
template <typename F> Button& set_clicked(F&& f) {
m_clicked = std::forward<F>(f);
return *this;
}
template <typename T, typename... Args> T& set_background(Args&&... args) {
auto w = std::make_unique<T>(std::forward<Args>(args)..., m_parent);
T& ref = *w;
m_background = std::move(w);
return ref;
}
template <typename T, typename... Args> T& set_foreground(Args&&... args) {
auto w = std::make_unique<T>(std::forward<Args>(args)..., this);
T& ref = *w;
m_foreground = std::move(w);
m_foreground->set_anchor(Anchor::CENTER);
return ref;
}
private:
static constexpr float PADDING = 5.0f;
static constexpr float DEFAULT_SCALE = 3.0f;
std::function<void()> m_clicked;
std::unique_ptr<Image> m_background;
std::unique_ptr<Label> m_foreground;
bool m_hovered = false;
float m_width = NORMAL_BUTTON_WIDTH;
float m_height = NORMAL_BUTTON_HEIGHT;
float m_scale = DEFAULT_SCALE;
void on_render(Renderer& renderer) override;
void on_update(float dt) override;
void update_text_scale();
};
} // namespace Cubed

View File

@@ -25,9 +25,12 @@ public:
float width() const override;
float height() const override;
float real_width() const;
float real_height() const;
float offset_x() const;
float offset_y() const;
float scale() const;
const std::string& text() const;
protected:
virtual void on_update(float dt) override;

View File

@@ -1,30 +1,56 @@
#pragma once
#include "Cubed/ui/image.hpp"
#include "Cubed/ui/label.hpp"
#include "Cubed/ui/widget.hpp"
namespace Cubed {
enum class ValueType {
FLOAT,
INT,
};
class Slider : public Widget {
public:
Slider(Widget* parent);
Slider& set_slider(float* value, const float& min, const float& max);
Image& get_track();
Image& get_thumb();
Slider& set_slider(int* value, const int& min, const int& max);
float width() const override;
float height() const override;
Slider& set_scale(float scale);
Slider& set_width(float width);
Slider& set_height(float h);
Slider& set_text(const std::string& text);
Slider& set_track_image(const std::string& path,
TextureManager& texture_manager);
Slider& set_thumb_image(const std::string& path,
TextureManager& texture_manager);
bool handle_mouse_move_event(const MouseMoveEvent& e) override;
bool handle_mouse_button_event(const MouseButtonEvent& e) override;
private:
static constexpr float THUMB_WIDTH = 5.0f;
static constexpr float PADDING = 5.0f;
static constexpr float DEFAULT_SCALE = 3.0f;
std::unique_ptr<Image> m_track;
std::unique_ptr<Image> m_thumb;
std::unique_ptr<Label> m_label;
ValueType m_type = ValueType::FLOAT;
float m_scale = DEFAULT_SCALE;
float m_width = NORMAL_SLIDER_WIDTH;
float m_height = NORMAL_SLIDER_HEIGHT;
float m_xpos = 0.0f;
bool m_dragging = false;
bool m_inside = false;
float* m_float_value = nullptr;
int* m_int_value = nullptr;
float m_min = 0;
float m_max = 0;
std::string m_text;
void init_track();
void init_thumb();
@@ -34,17 +60,6 @@ private:
void on_update(float) override;
void on_render(Renderer& renderer) override;
std::unique_ptr<Image> m_track;
std::unique_ptr<Image> m_thumb;
float m_scale = 1.0f;
float m_width = 0.0f;
float m_height = 0.0f;
float m_xpos = 0.0f;
bool m_dragging = false;
bool m_inside = false;
float* m_value = nullptr;
float m_min = 0;
float m_max = 0;
void update_text_scale();
};
} // namespace Cubed

View File

@@ -8,6 +8,11 @@
namespace Cubed {
class Renderer;
constexpr float NORMAL_BUTTON_WIDTH = 225.0f;
constexpr float NORMAL_BUTTON_HEIGHT = 20.0f;
constexpr float NORMAL_SLIDER_WIDTH = 225.0f;
constexpr float NORMAL_SLIDER_HEIGHT = 20.0f;
class Widget {
public:

View File

@@ -1,7 +1,13 @@
#include "Cubed/ui/button.hpp"
namespace Cubed {
Button::Button(Widget* parent) : Widget(parent) {}
Button::Button(Widget* parent) : Widget(parent) {
m_background = std::make_unique<Image>(this);
m_background->set_fill(true);
m_background->set_anchor(Anchor::TOP_LEFT);
m_foreground = std::make_unique<Label>(this);
m_foreground->set_anchor(Anchor::CENTER);
}
void Button::on_update(float dt) {
if (m_background) {
@@ -22,9 +28,9 @@ void Button::on_render(Renderer& renderer) {
}
bool Button::handle_mouse_move_event(const MouseMoveEvent& e) {
auto pos = m_background->pos();
if (e.xpos >= pos.x && e.xpos <= pos.x + width() && e.ypos >= pos.y &&
e.ypos <= pos.y + height()) {
auto p = pos();
if (e.xpos >= p.x && e.xpos <= p.x + width() && e.ypos >= p.y &&
e.ypos <= p.y + height()) {
m_hovered = true;
return true;
}
@@ -45,28 +51,53 @@ bool Button::handle_mouse_button_event(const MouseButtonEvent& e) {
}
Button& Button::set_scale(float scale) {
m_background->set_scale(scale);
m_scale = scale;
update_text_scale();
return *this;
}
void Button::set_window_size(int width, int height) {
m_background->set_window_size(width, height);
Widget::set_window_size(width, height);
}
Widget& Button::set_anchor(Anchor anchor) {
m_background->set_anchor(anchor);
float Button::scale() const { return m_scale; }
float Button::width() const { return m_width * m_scale; }
float Button::height() const { return m_height * m_scale; }
Button& Button::set_width(float width) {
m_width = width;
update_text_scale();
return *this;
}
Widget& Button::set_offset(glm::ivec2 offset) {
m_background->set_offset(offset);
Button& Button::set_height(float height) {
m_height = height;
update_text_scale();
return *this;
}
glm::vec2 Button::pos() const { return m_background->pos(); }
float Button::scale() const { return m_background->scale(); }
Button& Button::set_background_image(const std::string& path,
TextureManager& texture_manager) {
m_background->set_image(path, texture_manager);
return *this;
}
Button& Button::set_text(const std::string& text) {
m_foreground->set_text(text);
update_text_scale();
return *this;
}
float Button::width() const { return m_background->width(); }
float Button::height() const { return m_background->height(); }
void Button::update_text_scale() {
float text_w = m_foreground->real_width();
float text_h = m_foreground->real_height();
if (text_w <= 0.0f || text_h <= 0.0f)
return;
float available_w = std::max(0.0f, width() - 2.0f * PADDING * m_scale);
float available_h = std::max(0.0f, height() - 2.0f * PADDING * m_scale);
float scale_x = available_w / text_w;
float scale_y = available_h / text_h;
float scale = std::max(0.0f, std::min(scale_x, scale_y));
scale = std::clamp(scale, 0.01f, 100.0f);
m_foreground->set_scale(scale);
}
} // namespace Cubed

View File

@@ -5,8 +5,8 @@ ColumnLayout::ColumnLayout(Widget* parent) : Widget(parent) {}
ColumnLayout::~ColumnLayout() {}
void ColumnLayout::update(float dt) {
Widget::update(dt);
layout();
Widget::update(dt);
}
float ColumnLayout::width() const {

View File

@@ -26,14 +26,12 @@ void CreditsUI::init() {
{
auto& button = rect.add_child<Button>();
auto& back = button.set_background<Image>();
back.set_image("texture/ui/button001.png",
button.set_background_image(
"texture/ui/button001.png",
m_scene.scene_manager().app().texture_manager());
auto& fore = button.set_foreground<Label>();
fore.set_scale(0.5f).set_text("Return");
button.set_scale(4.0f)
.set_anchor(Anchor::BOTTOM_CENTER)
.set_offset({0, -20});
button.set_text("Return");
button.set_anchor(Anchor::BOTTOM_CENTER).set_offset({0, -20});
button.set_clicked([this]() { m_scene.scene_manager().request_pop(); });
}
{

View File

@@ -41,7 +41,10 @@ const UIVertexData& Label::data() const { return m_data; }
const TextStyle& Label::text_style() const { return m_text; }
float Label::width() const { return m_real_width * m_scale; }
float Label::height() const { return m_real_height * m_scale; }
float Label::real_width() const { return m_real_width; }
float Label::real_height() const { return m_real_height; }
float Label::offset_x() const { return m_offset_x; }
float Label::offset_y() const { return m_offset_y; }
float Label::scale() const { return m_scale; }
const std::string& Label::text() const { return m_text.text; }
} // namespace Cubed

View File

@@ -31,39 +31,32 @@ void MainMenuUIManager::init() {
{
auto& start_game_button = layout.add_child<Button>();
auto& back = start_game_button.set_background<Image>();
back.set_image("texture/ui/button001.png",
start_game_button.set_background_image(
"texture/ui/button001.png",
m_scene.scene_manager().app().texture_manager());
auto& fore = start_game_button.set_foreground<Label>();
fore.set_text("Start Game");
fore.set_scale(0.6f);
start_game_button.set_text("Start Game");
start_game_button.set_clicked([this]() {
m_scene.scene_manager().request_push(SceneType::WORLD);
});
start_game_button.set_scale(4.0f);
}
{
auto& button = layout.add_child<Button>();
auto& back = button.set_background<Image>();
back.set_image("texture/ui/button001.png",
button.set_background_image(
"texture/ui/button001.png",
m_scene.scene_manager().app().texture_manager());
auto& fore = button.set_foreground<Label>();
fore.set_text("Credits");
fore.set_scale(0.6f);
button.set_text("Credits");
button.set_clicked([this]() {
m_scene.scene_manager().request_push(SceneType::CREDITS);
});
button.set_scale(4.0f);
}
{
auto& exit_game = layout.add_child<Button>();
auto& back = exit_game.set_background<Image>();
back.set_image("texture/ui/button001.png",
exit_game.set_background_image(
"texture/ui/button001.png",
m_scene.scene_manager().app().texture_manager());
auto& fore = exit_game.set_foreground<Label>();
fore.set_scale(0.6f).set_text("Exit");
exit_game.set_scale(4.0f);
exit_game.set_text("Exit");
exit_game.set_clicked([this]() {
m_scene.scene_manager().app().window().should_close_window();
});

View File

@@ -18,13 +18,10 @@ void PauseMenuUIManager::init() {
rect->set_window_size(renderer.window_width(), renderer.window_height());
auto& back_main = rect->add_child<Button>();
auto& bg = back_main.set_background<Image>();
bg.set_image("texture/ui/button001.png",
back_main.set_background_image(
"texture/ui/button001.png",
m_scene.scene_manager().app().texture_manager());
auto& fg = back_main.set_foreground<Label>();
fg.set_text("return to main menu");
fg.set_scale(0.5f);
back_main.set_scale(5.0f);
back_main.set_text("return to main menu");
back_main.set_anchor(Anchor::CENTER);
back_main.set_clicked([this]() { m_scene.scene_manager().request_pop(); });
m_root_widget = std::move(rect);

View File

@@ -9,17 +9,29 @@ namespace Cubed {
Slider::Slider(Widget* parent) : Widget(parent) {
init_thumb();
init_track();
m_label = std::make_unique<Label>(this);
m_label->set_anchor(Anchor::CENTER);
update_text_scale();
}
Slider& Slider::set_slider(float* value, const float& min, const float& max) {
m_value = value;
m_float_value = value;
m_int_value = nullptr;
m_min = min;
m_max = max;
m_type = ValueType::FLOAT;
return *this;
}
Image& Slider::get_track() { return *m_track; }
Image& Slider::get_thumb() { return *m_thumb; }
Slider& Slider::set_slider(int* value, const int& min, const int& max) {
m_int_value = value;
m_float_value = nullptr;
m_min = static_cast<float>(min);
m_max = static_cast<float>(max);
m_type = ValueType::INT;
return *this;
}
void Slider::init_track() {
m_track = std::make_unique<Image>(this);
@@ -34,7 +46,7 @@ void Slider::init_thumb() {
m_thumb->set_height(height());
m_thumb->set_width(THUMB_WIDTH);
m_thumb->set_width(height() / 2.0f);
m_thumb->set_anchor(Anchor::TOP_LEFT);
@@ -48,6 +60,8 @@ Slider& Slider::set_scale(float scale) {
m_scale = scale;
m_track->set_width(width()).set_height(height());
m_thumb->set_height(height());
m_thumb->set_width(height() / 2.0f);
update_text_scale();
return *this;
}
@@ -58,6 +72,7 @@ Slider& Slider::set_width(float width) {
return *this;
}
m_width = width;
update_text_scale();
return *this;
}
@@ -65,6 +80,22 @@ Slider& Slider::set_height(float h) {
m_height = h;
ASSERT_MSG(m_thumb, "Thumb is nullptr !");
m_thumb->set_height(height());
m_thumb->set_width(height() / 2.0f);
update_text_scale();
return *this;
}
Slider& Slider::set_text(const std::string& text) {
m_text = text;
return *this;
}
Slider& Slider::set_track_image(const std::string& path,
TextureManager& texture_manager) {
m_track->set_image(path, texture_manager);
return *this;
}
Slider& Slider::set_thumb_image(const std::string& path,
TextureManager& texture_manager) {
m_thumb->set_image(path, texture_manager);
return *this;
}
@@ -77,7 +108,7 @@ bool Slider::handle_mouse_move_event(const MouseMoveEvent& e) {
} else {
m_inside = false;
}
if (m_dragging && m_value) {
if (m_dragging) {
update_value(e.xpos);
return true;
}
@@ -108,12 +139,17 @@ void Slider::update_value(float mouse_x) {
return;
}
float t = std::clamp((mouse_x - pos().x) / width(), 0.0f, 1.0f);
*m_value = m_min + t * (m_max - m_min);
float value = m_min + t * (m_max - m_min);
if (m_type == ValueType::FLOAT && m_float_value) {
*m_float_value = value;
}
if (m_type == ValueType::INT && m_int_value) {
*m_int_value = static_cast<int>(std::round(value));
}
}
void Slider::on_update(float) {
if (!m_value || !m_thumb || !m_track) {
void Slider::on_update(float dt) {
if (!m_thumb || !m_track) {
Logger::error("Please Set value and thumb and track");
ASSERT(false);
return;
@@ -124,14 +160,38 @@ void Slider::on_update(float) {
ASSERT(false);
return;
}
float t = 0.0f;
if (m_type == ValueType::FLOAT && m_float_value) {
t = (*m_float_value - m_min) / range;
}
float t = (*m_value - m_min) / range;
if (m_type == ValueType::INT && m_int_value) {
t = (static_cast<float>(*m_int_value) - m_min) / range;
}
t = std::clamp(t, 0.0f, 1.0f);
float offset = t * (width() - m_thumb->width());
m_thumb->set_offset({offset, 0});
if (m_label) {
if (m_type == ValueType::FLOAT && m_float_value) {
m_label->set_text(
std::format("{}: {:.2f}", m_text, *m_float_value));
}
if (m_type == ValueType::INT && m_int_value) {
m_label->set_text(std::format("{}: {}", m_text, *m_int_value));
}
}
if (m_track) {
m_track->update(dt);
}
if (m_thumb) {
m_thumb->update(dt);
}
if (m_label) {
m_label->update(dt);
}
}
void Slider::on_render(Renderer& renderer) {
@@ -141,6 +201,27 @@ void Slider::on_render(Renderer& renderer) {
if (m_thumb) {
m_thumb->render(renderer);
}
if (m_label) {
m_label->render(renderer);
}
}
void Slider::update_text_scale() {
float text_w = m_label->real_width();
float text_h = m_label->real_height();
if (text_w <= 0.0f || text_h <= 0.0f)
return;
float available_w = std::max(0.0f, width() - 2.0f * PADDING * m_scale);
float available_h = std::max(0.0f, height() - 2.0f * PADDING * m_scale);
float scale_x = available_w / text_w;
float scale_y = available_h / text_h;
float scale = std::max(0.0f, std::min(scale_x, scale_y));
scale = std::clamp(scale, 0.01f, 100.0f);
m_label->set_scale(scale);
}
} // namespace Cubed