fix(ui): DPI-scale hand-drawn overlays + freeze sweep demo state

Hand-drawn absolute geometry (dl->AddText offsets, SetNextWindowSize,
explicit ImVec2 button widths, SameLine strides) is immune to the app's
DPI machinery (font-atlas rebuild + ScaleAllSizes), so several overlays
rendered native-size (tiny) on HiDPI / Windows 150% displays. Multiply the
raw logical-px geometry by Layout::dpiScale():

- seed_display: content-aware, DPI-scaled seed-grid column stride (a raw
  130px stride let words collide with the next column's index at 150%)
- lock screen: card/logo/input/unlock-button + all vertical offsets
- migrate-to-seed + seed-backup dialogs: button widths
- send-confirm: confirm/cancel button widths
- about dialog: value-column x, edition inset, link/close button widths
- chat conversation list: row height + padding (fixes the preview clip)

Also freeze demo state during the full UI sweep: guard App::update() on
capture_mode_ so a running daemon's refresh can't clobber the injected
demo state (it blanked Send/Receive/History with a CDB error mid-sweep).

Verified on Windows 4K@150% and locally at font_scale=1.5 (same
dpiScale()==1.5 code path). Adds a DPI-scaling convention note to CLAUDE.md.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-07-07 18:58:54 -05:00
parent 0d9908019d
commit 6c19fac6f5
7 changed files with 104 additions and 55 deletions

View File

@@ -24,7 +24,16 @@ void RenderAboutDialog(App* app, bool* p_open)
auto closeBtn = S.button("dialogs.about", "close-button");
auto versionLbl = S.label("dialogs.about", "version-label");
auto editionLbl = S.label("dialogs.about", "edition-label");
// Schema positions/widths are logical px. BeginOverlayDialog scales the card by dpiScale(), so
// scale the value-column x, the edition inset, and the button widths to match — raw values left
// the value column jammed against the labels and the buttons left-packed at higher DPI.
const float dp = Layout::dpiScale();
const float valX = versionLbl.position * dp;
const float edX = editionLbl.position * dp;
const float linkW = linkBtn.width * dp;
const float closeW = closeBtn.width * dp;
if (!material::BeginOverlayDialog(TR("about_title"), p_open, win.width, 0.94f)) {
return;
}
@@ -39,7 +48,7 @@ void RenderAboutDialog(App* app, bool* p_open)
ImGui::PopFont();
ImGui::PopStyleColor();
ImGui::SameLine(ImGui::GetWindowWidth() - editionLbl.position);
ImGui::SameLine(ImGui::GetWindowWidth() - edX);
ImGui::TextDisabled("%s", TR("about_edition"));
ImGui::Spacing();
@@ -48,24 +57,24 @@ void RenderAboutDialog(App* app, bool* p_open)
// Version info
ImGui::Text("%s", TR("about_version"));
ImGui::SameLine(versionLbl.position);
ImGui::SameLine(valX);
ImGui::Text("%s", DRAGONX_VERSION);
ImGui::Text("%s", TR("about_imgui"));
ImGui::SameLine(versionLbl.position);
ImGui::SameLine(valX);
ImGui::Text("%s", IMGUI_VERSION);
ImGui::Text("%s", TR("about_build_date"));
ImGui::SameLine(versionLbl.position);
ImGui::SameLine(valX);
ImGui::Text("%s %s", __DATE__, __TIME__);
#ifdef DRAGONX_DEBUG
ImGui::Text("%s", TR("about_build_type"));
ImGui::SameLine(versionLbl.position);
ImGui::SameLine(valX);
ImGui::TextColored(ImVec4(1.0f, 0.6f, 0.0f, 1.0f), "%s", TR("about_debug"));
#else
ImGui::Text("%s", TR("about_build_type"));
ImGui::SameLine(versionLbl.position);
ImGui::SameLine(valX);
ImGui::Text("%s", TR("about_release"));
#endif
@@ -76,20 +85,20 @@ void RenderAboutDialog(App* app, bool* p_open)
ImGui::Spacing();
ImGui::Text("%s", TR("about_daemon"));
ImGui::SameLine(versionLbl.position);
ImGui::SameLine(valX);
ImGui::TextColored(ImVec4(0.3f, 0.8f, 0.3f, 1.0f), "%s", TR("connected"));
const auto& state = app->getWalletState();
ImGui::Text("%s", TR("about_chain"));
ImGui::SameLine(versionLbl.position);
ImGui::SameLine(valX);
ImGui::Text("ObsidianDragon");
ImGui::Text("%s", TR("about_block_height"));
ImGui::SameLine(versionLbl.position);
ImGui::SameLine(valX);
ImGui::Text("%d", state.sync.blocks);
ImGui::Text("%s", TR("about_connections"));
ImGui::SameLine(versionLbl.position);
ImGui::SameLine(valX);
ImGui::Text(TR("about_peers_count"), state.peers.size());
}
@@ -121,22 +130,22 @@ void RenderAboutDialog(App* app, bool* p_open)
ImGui::Spacing();
// Links
if (material::StyledButton(TR("about_website"), ImVec2(linkBtn.width, 0), S.resolveFont(linkBtn.font))) {
if (material::StyledButton(TR("about_website"), ImVec2(linkW, 0), S.resolveFont(linkBtn.font))) {
util::Platform::openUrl("https://dragonx.is");
}
ImGui::SameLine();
if (material::StyledButton(TR("about_github"), ImVec2(linkBtn.width, 0), S.resolveFont(linkBtn.font))) {
if (material::StyledButton(TR("about_github"), ImVec2(linkW, 0), S.resolveFont(linkBtn.font))) {
util::Platform::openUrl("https://git.dragonx.is/dragonx/ObsidianDragon");
}
ImGui::SameLine();
if (material::StyledButton(TR("about_block_explorer"), ImVec2(linkBtn.width, 0), S.resolveFont(linkBtn.font))) {
if (material::StyledButton(TR("about_block_explorer"), ImVec2(linkW, 0), S.resolveFont(linkBtn.font))) {
util::Platform::openUrl("https://explorer.dragonx.is");
}
ImGui::Spacing();
// Close button
float button_width = closeBtn.width;
float button_width = closeW;
ImGui::SetCursorPosX((ImGui::GetWindowWidth() - button_width) * 0.5f);
if (material::StyledButton(TR("close"), ImVec2(button_width, 0), S.resolveFont(closeBtn.font))) {
*p_open = false;

View File

@@ -12,6 +12,7 @@
#include "../../util/i18n.h"
#include "../material/colors.h"
#include "../material/type.h"
#include "../layout.h" // Layout::dpiScale()
#include "imgui.h"
#include <algorithm>
@@ -134,8 +135,11 @@ void RenderChatTab(App* app)
const ImVec2 avail = ImGui::GetContentRegionAvail();
const float listW = std::clamp(avail.x * 0.32f, 220.0f, 360.0f);
const float pad = 10.0f;
const float rowH = 52.0f;
// Row geometry is logical px — scale by dpiScale() so rows/padding grow with the (DPI-scaled)
// fonts. Left raw, at higher DPI the row was too short for the enlarged text and the preview's
// right margin (rowW - pad) shrank to ~zero, clipping the last glyph mid-word.
const float pad = 10.0f * Layout::dpiScale();
const float rowH = 52.0f * Layout::dpiScale();
ImFont* nameFont = material::Type().body2();
ImFont* metaFont = material::Type().caption();

View File

@@ -10,6 +10,7 @@
#include <vector>
#include "imgui.h"
#include "../layout.h" // Layout::dpiScale()
namespace dragonx {
namespace ui {
@@ -31,14 +32,26 @@ inline std::vector<std::string> SplitSeedWords(const std::string& phrase)
}
// Render the words as a numbered 4-column grid (matches the lite welcome wizard layout).
// The column stride is sized to the widest "NN. word" cell and scaled by dpiScale(): a raw px
// stride collided with the next column's index once the font grew at higher DPI / font scale
// (e.g. at 150% "13. elevator" ran straight into "14."). Sizing to content keeps a gap at any
// scale and for any word length.
inline void RenderSeedWordGrid(const std::vector<std::string>& words, float colSpacingPx = 130.0f)
{
const float dp = Layout::dpiScale();
float colStride = colSpacingPx * dp;
for (size_t i = 0; i < words.size(); ++i) {
char cell[96];
std::snprintf(cell, sizeof(cell), "%2zu. %s", i + 1, words[i].c_str());
const float need = ImGui::CalcTextSize(cell).x + 20.0f * dp; // cell width + inter-column gap
if (need > colStride) colStride = need;
}
for (size_t i = 0; i < words.size(); ++i) {
char cell[96];
std::snprintf(cell, sizeof(cell), "%2zu. %s", i + 1, words[i].c_str());
ImGui::TextUnformatted(cell);
if ((i % 4) != 3 && i + 1 < words.size())
ImGui::SameLine(((i % 4) + 1) * colSpacingPx);
ImGui::SameLine(((i % 4) + 1) * colStride);
}
}

View File

@@ -821,7 +821,7 @@ void RenderSendConfirmPopup(App* app) {
if (s_sending) {
Type().text(TypeStyle::Body2, TR("sending"));
} else {
if (TactileButton(TR("confirm_and_send"), ImVec2(S.button("tabs.send", "confirm-button").width, std::max(schema::UI().drawElement("tabs.send", "confirm-btn-min-height").size, schema::UI().drawElement("tabs.send", "confirm-btn-base-height").size * popVs)), S.resolveFont(S.button("tabs.send", "confirm-button").font))) {
if (TactileButton(TR("confirm_and_send"), ImVec2(S.button("tabs.send", "confirm-button").width * Layout::dpiScale(), std::max(schema::UI().drawElement("tabs.send", "confirm-btn-min-height").size, schema::UI().drawElement("tabs.send", "confirm-btn-base-height").size * popVs)), S.resolveFont(S.button("tabs.send", "confirm-button").font))) {
// Re-validate against LIVE state — the confirm dialog persists across frames, so the
// balance could have dropped or sync (re)started (or the fee bumped total over available)
// since Review. Don't broadcast a now-invalid transaction.
@@ -874,7 +874,7 @@ void RenderSendConfirmPopup(App* app) {
}
}
ImGui::SameLine();
if (TactileButton(TR("cancel"), ImVec2(S.button("tabs.send", "cancel-button").width, std::max(schema::UI().drawElement("tabs.send", "confirm-btn-min-height").size, schema::UI().drawElement("tabs.send", "confirm-btn-base-height").size * popVs)), S.resolveFont(S.button("tabs.send", "cancel-button").font))) {
if (TactileButton(TR("cancel"), ImVec2(S.button("tabs.send", "cancel-button").width * Layout::dpiScale(), std::max(schema::UI().drawElement("tabs.send", "confirm-btn-min-height").size, schema::UI().drawElement("tabs.send", "confirm-btn-base-height").size * popVs)), S.resolveFont(S.button("tabs.send", "cancel-button").font))) {
s_show_confirm = false;
}
}