refactor(ui): generalize Label background, add ChatBox width method

This commit is contained in:
2026-07-20 09:55:09 +08:00
parent 8c79808b86
commit 6d3a0518ed
9 changed files with 36 additions and 38 deletions

View File

@@ -23,6 +23,7 @@ public:
std::string& get_input_text();
float width() const override;
float height() const override;
float text_label_width() const;
void set_text_field(std::unique_ptr<TextField> text_field);
void set_typing(bool typing, bool finished);
template <typename F> ChatBox& set_on_finish(F&& f) {
@@ -42,6 +43,7 @@ private:
bool m_scale = 1.0f;
float m_spacing = 0.0f;
float m_text_scale = 1.0f;
float m_text_width = 500.0f;
std::deque<Line> m_messages;
std::unique_ptr<TextField> m_text_field;
void layout();

View File

@@ -1,5 +1,4 @@
#pragma once
#include "Cubed/ui/rect.hpp"
#include "Cubed/ui/text.hpp"
#include "Cubed/ui/ui_vertex_data.hpp"
#include "Cubed/ui/widget.hpp"
@@ -15,12 +14,11 @@ public:
virtual ~Label() = default;
Label& set_text(std::string_view text);
Label& set_color(Color color);
Label& set_scale(float scale);
Label& enable_background();
Label& set_background(Color color, float alpha);
Label& set_background_alpha(float alpha);
Label& set_background(std::unique_ptr<Widget> background);
Widget* get_background();
const UIVertexData& data() const;
const TextStyle& text_style() const;
@@ -41,7 +39,7 @@ protected:
private:
TextStyle m_text;
UIVertexData m_data;
std::unique_ptr<Rect> m_background;
std::unique_ptr<Widget> m_background;
float m_real_width = 0.0f;
float m_real_height = 0.0f;
float m_offset_x = 0.0f;

View File

@@ -26,6 +26,7 @@ public:
TextField& set_app(App* app);
TextField& set_typing(bool typing, bool finished);
TextField& clear_input();
bool handle_mouse_move_event(const MouseMoveEvent& e) override;
bool handle_mouse_button_event(const MouseButtonEvent& e) override;
bool handle_text_input_event(const TextInputEvent& e) override;
@@ -54,11 +55,8 @@ private:
bool m_typing = false;
bool m_auto_scale = false;
bool m_ctrl_press = false;
float m_width = NORMAL_TEXTFIELD_WIDTH;
float m_height = NORMAL_TEXTFIELD_HEIGHT;
float m_scale = DEFAULT_SCALE;
bool m_fill_width = false;
bool m_fill_height = false;
std::string m_input_text;
std::string m_show_text;

View File

@@ -2,6 +2,7 @@
#include "Cubed/tools/system_info.hpp"
#include "Cubed/tools/system_window_manager.hpp"
#include "Cubed/ui/rect.hpp"
#include "version.hpp"
#include <SDL3/SDL_video.h>
@@ -31,11 +32,10 @@ void DebugCollector::init(int width, int height) {
auto add_label = [&](std::string_view text, std::string_view key = "") {
auto& label = m_widget.add_child<Label>();
label.enable_background()
.set_background(COLOR, ALPHA)
.set_color(Color::WHITE)
.set_text(text)
.set_scale(SCALE);
auto rect = std::make_unique<Rect>(&label);
rect->set_color(COLOR).set_alpha(ALPHA).set_fill_parent(true);
label.set_background(std::move(rect));
label.set_color(Color::WHITE).set_text(text).set_scale(SCALE);
if (!key.empty()) {
auto [_, insert] =
m_component.try_emplace(std::string(key), &label);

View File

@@ -14,8 +14,14 @@ void ChatBox::add_message(ChatMessage& message) {
auto split_str = split_utf8(str, 20);
for (auto it = split_str.begin(); it != split_str.end(); ++it) {
auto lable = std::make_unique<Label>(this);
lable->set_text(*it)
.set_scale(m_text_scale)
lable->set_text(*it).set_scale(m_text_scale);
auto background = std::make_unique<Rect>(lable.get());
background->set_fill_height(true);
background->set_anchor(Anchor::TOP_LEFT);
background->set_alpha(0.6f)
.set_color(Color::GRAY)
.set_width(text_label_width());
lable->set_background(std::move(background))
.set_anchor(Anchor::TOP_LEFT);
m_messages.emplace_back(std::move(lable), message.time);
}
@@ -62,7 +68,7 @@ float ChatBox::height() const {
// Height is dynamically calculated, no scaling needed
return m_height;
}
float ChatBox::text_label_width() const { return m_text_width * m_scale; }
void ChatBox::set_text_field(std::unique_ptr<TextField> text_field) {
m_text_field = std::move(text_field);
}
@@ -102,6 +108,9 @@ void ChatBox::layout() {
}
void ChatBox::on_update(float dt) {
Widget::on_update(dt);
for (auto& m : m_messages) {
m.label->update(dt);
}
layout();
m_text_field->update(dt);
}

View File

@@ -9,7 +9,6 @@ Label& Label::set_text(std::string_view text) {
update_vertices();
return *this;
}
Label& Label::set_color(Color color) {
m_text.color = color;
return *this;
@@ -19,24 +18,11 @@ Label& Label::set_scale(float scale) {
return *this;
}
Label& Label::enable_background() {
if (m_background) {
return *this;
}
m_background = std::make_unique<Rect>(this);
m_background->set_fill_parent(true);
m_background->set_anchor(Anchor::TOP_LEFT);
Label& Label::set_background(std::unique_ptr<Widget> background) {
m_background = std::move(background);
return *this;
}
Label& Label::set_background(Color color, float alpha) {
m_background->set_color(color).set_alpha(alpha);
return *this;
}
Label& Label::set_background_alpha(float alpha) {
m_background->set_alpha(alpha);
return *this;
}
Widget* Label::get_background() { return m_background.get(); }
void Label::on_update(float dt) {
Widget::on_update(dt);
if (m_background) {

View File

@@ -11,6 +11,8 @@ constexpr float DELTA_CUROUR_HEIGHT = 10.0f;
namespace Cubed {
TextField::TextField(Widget* parent) : Widget(parent) {
m_width = NORMAL_TEXTFIELD_WIDTH;
m_height = NORMAL_TEXTFIELD_HEIGHT;
m_foreground = std::make_unique<Label>(this);
m_foreground->set_anchor(Anchor::CENTER_LEFT);
m_foreground->set_offset({10, 0});
@@ -21,6 +23,7 @@ TextField::TextField(Widget* parent) : Widget(parent) {
m_cursor->set_anchor(Anchor::CENTER_LEFT);
m_cursor->set_offset({10, 0});
m_cursor->set_color(Color::WHITE);
update_text_scale();
}

View File

@@ -29,6 +29,7 @@ void Widget::render(Renderer& renderer) {
}
void Widget::on_update(float) {
if (m_fill_width) {
m_width = m_parent ? m_parent->width() : m_window_width;
}

View File

@@ -41,11 +41,12 @@ void WorldUIManager::init() {
.set_fill_width(true)
.set_visible(false);
chat_box.set_text_field(std::move(text_field));
chat_box.set_spacing(15);
chat_box.set_spacing(0);
chat_box.set_anchor(Anchor::BOTTOM_LEFT);
chat_box.set_offset({0, -10});
chat_box.set_width(200);
chat_box.set_scale(2.0f);
// chat_box.set_width(500);
chat_box.set_fill_width(true);
// chat_box.set_scale(2.0f);
chat_box.set_text_scale(0.6f);
chat_box.set_on_finish([this, &chat_box]() {
ChatMessage message{m_scene.client_world().get_player().get_name(),