diff --git a/data/ui.yaml b/data/ui.yaml index a175ec2..1854559 100644 --- a/data/ui.yaml +++ b/data/ui.yaml @@ -65,6 +65,22 @@ hud: flash_ms: 250 # durada del flash quan un jugador rep un hit shake_ms: 300 # durada del shake que acompanya el flash +# Geometria del popup superior (Notifier). En píxels del canvas, llevat de +# slide_ms (durada en ms de l'animació d'entrada i d'eixida; constant +# independentment de la mida de la caixa). El padding vertical és asimètric a +# propòsit: padding_top > padding_bottom puja una mica el text dins la caixa. +# Corbes disponibles: linear, outQuad, inQuad, inOutQuad, outCubic, inCubic. +notifier: + padding_h: 6 + padding_top: 4 + padding_bottom: 3 + line_gap: 1 + margin_top: 3 + border_px: 1 + slide_ms: 400 + slide_in_curve: outCubic + slide_out_curve: inCubic + # Pausa graduada de la GameScene: el món no para d'un colp, s'atura amb # easing i torna a arrancar amb una altra corba. Els timings es poden # afinar independentment, i les corbes permeten estils diferents entrant diff --git a/source/core/input/global_inputs.cpp b/source/core/input/global_inputs.cpp index cce1357..a284510 100644 --- a/source/core/input/global_inputs.cpp +++ b/source/core/input/global_inputs.cpp @@ -154,6 +154,14 @@ namespace GlobalInputs { Options::setVideoRenderInfoPosition(static_cast(NEXT)); } + // Debug helper: dispara una notificació prou llarga perquè + // `wrapToWidth` la parteixi en (almenys) dues línies. Útil per a + // verificar visualment el padding asimètric, el line_gap i la caixa + // multilinia després de tocar la geometria a `data/ui.yaml`. + void onDebugLongNotification() { + Notification::notify("Notificació de prova llarga per a comprovar que el text es parteix correctament en dues línies dins la caixa."); + } + void onExit() { if (exit_window_s > 0.0F) { quit_requested = true; @@ -193,6 +201,10 @@ namespace GlobalInputs { onCycleRenderInfo(); } else if (SC == KeyConfig::get().scancode("exit")) { onExit(); + } else if (SC == SDL_SCANCODE_KP_2) { + // Tecla de debug fora del KeyConfig: dispara una notificació + // multilinia per a inspeccionar el layout de la caixa. + onDebugLongNotification(); } } } diff --git a/source/core/rendering/notifier.cpp b/source/core/rendering/notifier.cpp index 348bc27..02bedc1 100644 --- a/source/core/rendering/notifier.cpp +++ b/source/core/rendering/notifier.cpp @@ -6,6 +6,7 @@ #include "core/rendering/screen.hpp" #include "core/rendering/text.hpp" +#include "core/ui/ui_config.hpp" #include "utils/defines.hpp" namespace { @@ -67,26 +68,39 @@ void Notifier::init(std::shared_ptr text, const Palette& ui_palette) { } void Notifier::update(int delta_ms) { - const float DT = static_cast(delta_ms) / 1000.0F; + const auto& geo = UiConfig::get().notifier(); switch (status_) { - case Status::RISING: - y_ += SLIDE_SPEED * DT; - if (y_ >= static_cast(MARGIN_TOP + BORDER_PX)) { - y_ = static_cast(MARGIN_TOP + BORDER_PX); + case Status::RISING: { + slide_elapsed_ms_ += delta_ms; + if (slide_elapsed_ms_ >= geo.slide_ms) { + y_ = slide_y_on_; status_ = Status::ACTIVE; + } else { + const float T = static_cast(slide_elapsed_ms_) / static_cast(geo.slide_ms); + const float K = geo.slide_in_curve(T); + y_ = slide_y_off_ + ((slide_y_on_ - slide_y_off_) * K); } break; + } case Status::ACTIVE: remaining_ms_ -= delta_ms; - if (remaining_ms_ <= 0) { status_ = Status::VANISHING; } - break; - case Status::VANISHING: - y_ -= SLIDE_SPEED * DT; - if (y_ <= static_cast(-current_box_h_ - BORDER_PX)) { - y_ = static_cast(-current_box_h_ - BORDER_PX - MARGIN_TOP); - status_ = Status::HIDDEN; + if (remaining_ms_ <= 0) { + slide_elapsed_ms_ = 0; + status_ = Status::VANISHING; } break; + case Status::VANISHING: { + slide_elapsed_ms_ += delta_ms; + if (slide_elapsed_ms_ >= geo.slide_ms) { + y_ = slide_y_off_; + status_ = Status::HIDDEN; + } else { + const float T = static_cast(slide_elapsed_ms_) / static_cast(geo.slide_ms); + const float K = geo.slide_out_curve(T); + y_ = slide_y_on_ + ((slide_y_off_ - slide_y_on_) * K); + } + break; + } default: break; } @@ -95,6 +109,7 @@ void Notifier::update(int delta_ms) { void Notifier::render() { if (status_ == Status::HIDDEN || text_ == nullptr || current_lines_.empty()) { return; } + const auto& geo = UiConfig::get().notifier(); const int BOX_X = (GameCanvas::WIDTH - current_box_w_) / 2; const int BOX_Y = static_cast(y_); @@ -106,13 +121,13 @@ void Notifier::render() { // costat i una mica fora de la caixa. Cada segment es queda dins del // rang del costat corresponent perquè les cantonades no es cobrisquen. const std::uint32_t BORDER_ARGB = ui_palette_[current_text_color_]; - Screen::get().fillRect(BOX_X, BOX_Y - BORDER_PX, current_box_w_, BORDER_PX, BORDER_ARGB); - Screen::get().fillRect(BOX_X, BOX_Y + current_box_h_, current_box_w_, BORDER_PX, BORDER_ARGB); - Screen::get().fillRect(BOX_X - BORDER_PX, BOX_Y, BORDER_PX, current_box_h_, BORDER_ARGB); - Screen::get().fillRect(BOX_X + current_box_w_, BOX_Y, BORDER_PX, current_box_h_, BORDER_ARGB); + Screen::get().fillRect(BOX_X, BOX_Y - geo.border_px, current_box_w_, geo.border_px, BORDER_ARGB); + Screen::get().fillRect(BOX_X, BOX_Y + current_box_h_, current_box_w_, geo.border_px, BORDER_ARGB); + Screen::get().fillRect(BOX_X - geo.border_px, BOX_Y, geo.border_px, current_box_h_, BORDER_ARGB); + Screen::get().fillRect(BOX_X + current_box_w_, BOX_Y, geo.border_px, current_box_h_, BORDER_ARGB); - const int LINE_STEP = Rendering::Hud::FONT_SIZE_PX + LINE_GAP; - int line_y = BOX_Y + PADDING_V; + const int LINE_STEP = Rendering::Hud::FONT_SIZE_PX + geo.line_gap; + int line_y = BOX_Y + geo.padding_top; for (const auto& line : current_lines_) { text_->writeDX(Text::CENTER_FLAG | Text::COLOR_FLAG, GameCanvas::CENTER_X, @@ -129,18 +144,26 @@ void Notifier::notify(const std::string& text, Uint8 text_color, Uint8 bg_color, // gestionar-ne una cua, canviar ací per una FIFO quan calga. if (text_ == nullptr) { return; } + const auto& geo = UiConfig::get().notifier(); + const int MAX_TEXT_WIDTH = GameCanvas::WIDTH - (2 * SIDE_MARGIN) - (2 * geo.padding_h); current_lines_ = wrapToWidth(text, MAX_TEXT_WIDTH, *text_, 1); - // Amplada = max de les línies + padding. Alçada = N*glif + (N-1)*gap + padding. + // Amplada = max de les línies + padding. Alçada = N*glif + (N-1)*gap + padding asimètric. const int MAX_LINE_W = std::accumulate(current_lines_.begin(), current_lines_.end(), 0, [this](int acc, const std::string& s) { return std::max(acc, text_->length(s, 1)); }); - current_box_w_ = MAX_LINE_W + (2 * PADDING_H); + current_box_w_ = MAX_LINE_W + (2 * geo.padding_h); const int N = static_cast(current_lines_.size()); - current_box_h_ = (N * Rendering::Hud::FONT_SIZE_PX) + ((N - 1) * LINE_GAP) + (2 * PADDING_V); + current_box_h_ = (N * Rendering::Hud::FONT_SIZE_PX) + ((N - 1) * geo.line_gap) + geo.padding_top + geo.padding_bottom; current_text_color_ = text_color; current_bg_color_ = bg_color; remaining_ms_ = time_ms; - y_ = static_cast(-current_box_h_ - BORDER_PX - MARGIN_TOP); + + // Posicions extremes en y (top-left de la caixa). Off = totalment fora + // del canvas per dalt; On = posició final amb la vora respectada. + slide_y_off_ = static_cast(-current_box_h_ - geo.border_px - geo.margin_top); + slide_y_on_ = static_cast(geo.margin_top + geo.border_px); + slide_elapsed_ms_ = 0; + y_ = slide_y_off_; status_ = Status::RISING; } diff --git a/source/core/rendering/notifier.hpp b/source/core/rendering/notifier.hpp index d599280..1e0fdf2 100644 --- a/source/core/rendering/notifier.hpp +++ b/source/core/rendering/notifier.hpp @@ -43,16 +43,11 @@ class Notifier { void notify(const std::string& text, Uint8 text_color, Uint8 bg_color, int time_ms); - static constexpr int PADDING_H = 6; - static constexpr int PADDING_V = 3; - static constexpr int LINE_GAP = 1; // Separació vertical entre línies multilinia. - static constexpr int MARGIN_TOP = 2; // Separació amb la vora superior del canvas (fins a la línia exterior). - static constexpr int BORDER_PX = 1; // Gruix de la vora externa de color text. - static constexpr float SLIDE_SPEED = 120.0F; - // Amplada màxima (sense comptar padding) que pot ocupar el text abans que - // `wrapToWidth` el parteixi en línies. Deixem marge respecte a la vora del - // canvas perquè la caixa no toqui els laterals. - static constexpr int MAX_TEXT_WIDTH = GameCanvas::WIDTH - 20 - (2 * PADDING_H); + // Marge lateral entre la caixa i les vores esquerra/dreta del canvas. + // Limita l'amplada disponible al text en multilinia (combinat amb el + // padding horitzontal llegit d'UiConfig). No està exposat al YAML + // perquè en pantalles 240 px no té sentit retallar més. + static constexpr int SIDE_MARGIN = 10; private: enum class Status : std::uint8_t { HIDDEN, @@ -73,4 +68,11 @@ class Notifier { Uint8 current_text_color_{0}; Uint8 current_bg_color_{0}; int remaining_ms_{0}; + + // Animació d'entrada/eixida per temps. `slide_elapsed_ms_` avança + // amb el delta dins de RISING/VANISHING; els extrems s'avaluen a + // `notify()` perquè depenen de la mida de la caixa. + int slide_elapsed_ms_{0}; + float slide_y_off_{0.0F}; + float slide_y_on_{0.0F}; }; diff --git a/source/core/ui/ui_config.cpp b/source/core/ui/ui_config.cpp index 3d6f6ab..e7ff25a 100644 --- a/source/core/ui/ui_config.cpp +++ b/source/core/ui/ui_config.cpp @@ -102,7 +102,18 @@ UiConfig::UiConfig() placeholder_font_{.name = Defaults::UI::Font::PLACEHOLDER_NAME, .gif = Defaults::UI::Font::PLACEHOLDER_GIF, .fnt = Defaults::UI::Font::PLACEHOLDER_FNT, .kerning = Defaults::UI::Font::PLACEHOLDER_KERNING}, room_text_font_{.name = Defaults::UI::Font::ROOM_TEXT_NAME, .gif = Defaults::UI::Font::ROOM_TEXT_GIF, .fnt = Defaults::UI::Font::ROOM_TEXT_FNT, .kerning = Defaults::UI::Font::ROOM_TEXT_KERNING}, menu_title_font_{.name = Defaults::UI::Font::MENU_TITLE_NAME, .gif = Defaults::UI::Font::MENU_TITLE_GIF, .fnt = Defaults::UI::Font::MENU_TITLE_FNT, .kerning = Defaults::UI::Font::MENU_TITLE_KERNING}, - menu_items_font_{.name = Defaults::UI::Font::MENU_ITEMS_NAME, .gif = Defaults::UI::Font::MENU_ITEMS_GIF, .fnt = Defaults::UI::Font::MENU_ITEMS_FNT, .kerning = Defaults::UI::Font::MENU_ITEMS_KERNING} { + menu_items_font_{.name = Defaults::UI::Font::MENU_ITEMS_NAME, .gif = Defaults::UI::Font::MENU_ITEMS_GIF, .fnt = Defaults::UI::Font::MENU_ITEMS_FNT, .kerning = Defaults::UI::Font::MENU_ITEMS_KERNING}, + notifier_{ + .padding_h = Defaults::UI::Notifier::PADDING_H, + .padding_top = Defaults::UI::Notifier::PADDING_TOP, + .padding_bottom = Defaults::UI::Notifier::PADDING_BOTTOM, + .line_gap = Defaults::UI::Notifier::LINE_GAP, + .margin_top = Defaults::UI::Notifier::MARGIN_TOP, + .border_px = Defaults::UI::Notifier::BORDER_PX, + .slide_ms = Defaults::UI::Notifier::SLIDE_MS, + .slide_in_curve = curveByName(Defaults::UI::Notifier::SLIDE_IN_CURVE), + .slide_out_curve = curveByName(Defaults::UI::Notifier::SLIDE_OUT_CURVE), + } { } auto UiConfig::get() -> UiConfig& { @@ -193,6 +204,19 @@ void UiConfig::load(const std::string& file_path) { readField(s, "menu_accept", menu_accept_sound_); } + if (yaml.contains("notifier")) { + const auto& n = yaml["notifier"]; + readField(n, "padding_h", notifier_.padding_h); + readField(n, "padding_top", notifier_.padding_top); + readField(n, "padding_bottom", notifier_.padding_bottom); + readField(n, "line_gap", notifier_.line_gap); + readField(n, "margin_top", notifier_.margin_top); + readField(n, "border_px", notifier_.border_px); + readField(n, "slide_ms", notifier_.slide_ms); + readCurve(n, "slide_in_curve", notifier_.slide_in_curve); + readCurve(n, "slide_out_curve", notifier_.slide_out_curve); + } + std::cout << "UiConfig: carregat des de " << file_path << '\n'; } catch (const std::exception& e) { std::cerr << "UiConfig: error parsejant " << file_path << ": " << e.what() << '\n'; diff --git a/source/core/ui/ui_config.hpp b/source/core/ui/ui_config.hpp index 8c58b74..f8b5508 100644 --- a/source/core/ui/ui_config.hpp +++ b/source/core/ui/ui_config.hpp @@ -20,6 +20,27 @@ class UiConfig { int kerning; }; + // Signatura d'una funció d'easing: t ∈ [0, 1] → valor ∈ [0, 1]. + // Permet triar corbes des de data/ui.yaml per nom (cadena) i guardar + // el punter a la corresponent funció de `utils/easing.hpp`. + using CurveFn = auto (*)(float) -> float; + + // Geometria del Notifier (popup superior). Carregada des de + // data/ui.yaml secció `notifier:`; els valors per defecte vénen de + // Defaults::UI::Notifier. El moviment és per temps (slide_ms) i no per + // velocitat, perquè una caixa més gran no triga més a entrar/eixir. + struct Notifier { + int padding_h; + int padding_top; + int padding_bottom; + int line_gap; + int margin_top; + int border_px; + int slide_ms; + CurveFn slide_in_curve; + CurveFn slide_out_curve; + }; + static auto get() -> UiConfig&; UiConfig(const UiConfig&) = delete; @@ -51,11 +72,6 @@ class UiConfig { [[nodiscard]] auto roomText() const -> Uint8 { return room_text_; } [[nodiscard]] auto roomTextOutline() const -> Uint8 { return room_text_outline_; } - // Signatura d'una funció d'easing: t ∈ [0, 1] → valor ∈ [0, 1]. - // Permet triar corbes des de data/ui.yaml per nom (cadena) i guardar - // el punter a la corresponent funció de `utils/easing.hpp`. - using CurveFn = auto (*)(float) -> float; - // Timings (ms). [[nodiscard]] auto notificationMs() const -> int { return notification_ms_; } [[nodiscard]] auto exitMs() const -> int { return exit_ms_; } @@ -88,6 +104,9 @@ class UiConfig { [[nodiscard]] auto menuTitleFont() const -> const Font& { return menu_title_font_; } [[nodiscard]] auto menuItemsFont() const -> const Font& { return menu_items_font_; } + // Geometria del Notifier. + [[nodiscard]] auto notifier() const -> const Notifier& { return notifier_; } + // Flags visuals. [[nodiscard]] auto hudBgEnabled() const -> bool { return hud_bg_enabled_; } @@ -135,5 +154,7 @@ class UiConfig { Font menu_title_font_; Font menu_items_font_; + Notifier notifier_; + bool hud_bg_enabled_{false}; }; diff --git a/source/utils/defaults.hpp b/source/utils/defaults.hpp index 764a074..1da9411 100644 --- a/source/utils/defaults.hpp +++ b/source/utils/defaults.hpp @@ -168,6 +168,26 @@ namespace Defaults { constexpr Uint8 NOTIFICATION_BG = 64; constexpr int NOTIFICATION_TIME_MS = 4000; + // Geometria del Notifier (en píxels del canvas). Asimètric a + // propòsit: PADDING_TOP > PADDING_BOTTOM puja una mica el text + // dins la caixa i deixa la base més arrapada al vora inferior. + // MARGIN_TOP és la separació entre la vora superior del canvas i + // la línia exterior de la caixa. SLIDE_MS és la durada de l'entrada + // i de l'eixida (independent de la mida de la caixa, perquè el + // moviment va per temps i no per velocitat). Les corbes són noms + // del registre d'`Easing` (veure UiConfig::curveByName). + namespace Notifier { + constexpr int PADDING_H = 6; + constexpr int PADDING_TOP = 4; + constexpr int PADDING_BOTTOM = 3; + constexpr int LINE_GAP = 1; + constexpr int MARGIN_TOP = 3; + constexpr int BORDER_PX = 1; + constexpr int SLIDE_MS = 400; + constexpr const char* SLIDE_IN_CURVE = "outCubic"; + constexpr const char* SLIDE_OUT_CURVE = "inCubic"; + } // namespace Notifier + // Preset per a la confirmació d'eixida (ESC doble). La durada ha // de coincidir amb la del Notifier perquè el missatge i la finestra // de confirmació expiren alhora (veure GlobalInputs::onExit).