From 149caaf2926368a10414c3038ed6fefc11a66bc1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elena=20Torr=C3=B3?= Date: Thu, 25 Jun 2026 07:20:41 +0200 Subject: [PATCH] :bug: Fix rulers values visibility (#10408) --- render-wasm/src/render/rulers.rs | 51 ++++++++++++++++---------------- 1 file changed, 26 insertions(+), 25 deletions(-) diff --git a/render-wasm/src/render/rulers.rs b/render-wasm/src/render/rulers.rs index a33215b942..510979a2f8 100644 --- a/render-wasm/src/render/rulers.rs +++ b/render-wasm/src/render/rulers.rs @@ -28,13 +28,17 @@ const CANVAS_BORDER_RADIUS: f32 = 12.0; // distinct offsets for the two and we mirror that. const SELECTION_LABEL_BASELINE: f32 = 13.6; -// Selection-label gradient mask: matches the SVG `selection-gradient-start` -// and `selection-gradient-end` defs. The mask is `OVER_NUMBER_SIZE` screen -// pixels long, with the opaque part starting `OVER_NUMBER_PERCENT` of the -// way through the rect (40% from the outside edge, 60% from the inside). +// Selection-label gradient mask: fades the tick labels behind the selection +// band. The mask is `OVER_NUMBER_SIZE` screen pixels long. `OVER_NUMBER_PERCENT` +// is the fraction of the mask that sits *outside* the band; at 1.0 the mask's +// inner edge lands exactly on the band edge, so the dark shadow begins where +// the green selection area ends and fades outward (it never bleeds under the +// band). `GRADIENT_FADE_FRACTION` is the share of the mask spent on the +// transparent→opaque ramp at the outer end. const OVER_NUMBER_SIZE: f32 = 100.0; -const OVER_NUMBER_PERCENT: f32 = 0.75; +const OVER_NUMBER_PERCENT: f32 = 1.0; const GRADIENT_FADE_FRACTION: f32 = 0.4; +const OVER_NUMBER_OPACITY: f32 = 0.8; fn calculate_step_size(zoom: f32) -> f32 { if zoom <= 0.0 { @@ -308,23 +312,27 @@ fn draw_selection_x(ctx: &RenderCtx, sel: Rect, offset: f32) { ); let text_y = ctx.vy + SELECTION_LABEL_BASELINE * zi; - let pad_x = 4.0 * zi; + // Both labels use the same half-bar gap from the band so the start (left) + // and end (right) are spaced symmetrically. + let gap = (RULER_AREA_SIZE / 2.0) * zi; let left_label = format_label(sel.left - offset); let right_label = format_label(sel.right - offset); let (lw_font, _) = ctx.font.measure_str(&left_label, None); - // The right label is anchored at its left edge, so we don't need its - // measured width. - let lx = sel.left - pad_x - lw_font * zi; - let rx = sel.right + pad_x; + let lx = sel.left - gap - lw_font * zi; + let rx = sel.right + gap; let mut text_paint = Paint::default(); text_paint.set_color(ctx.state.accent_color); text_paint.set_anti_alias(true); + + // 1. Left label canvas.save(); canvas.translate((lx, text_y)); canvas.scale((zi, zi)); canvas.draw_str(&left_label, Point::new(0.0, 0.0), ctx.font, &text_paint); canvas.restore(); + + // 2. Right label canvas.save(); canvas.translate((rx, text_y)); canvas.scale((zi, zi)); @@ -341,7 +349,7 @@ enum MaskAxis { /// labels behind the selection band. `fade_to_end` flips it from /// transparent→opaque (before the band) to opaque→transparent (after). fn draw_mask(ctx: &RenderCtx, rect: Rect, axis: MaskAxis, fade_to_end: bool) { - let opaque = ctx.state.bg_color; + let opaque = with_alpha(ctx.state.bg_color, OVER_NUMBER_OPACITY); let transparent = with_alpha(ctx.state.bg_color, 0.0); let (colors, offsets): (&[skia::Color; 3], &[f32; 3]) = if fade_to_end { ( @@ -377,11 +385,10 @@ fn draw_selection_y(ctx: &RenderCtx, sel: Rect, offset: f32) { let canvas = ctx.canvas; let zi = ctx.zi; - let pad_y = 4.0 * zi; let top_label = format_label(sel.top - offset); let bottom_label = format_label(sel.bottom - offset); - // Top label's draw position doesn't depend on its own width (LX is just - // pad_y/zi), so we only need bw_font for the bottom label's right-anchor. + // Both labels sit a half-bar gap from the band; only the bottom label's + // origin depends on its own width (it reads toward the band). let (bw_font, _) = ctx.font.measure_str(&bottom_label, None); // Mask first (gradient bg over tick labels behind), then band, then @@ -416,33 +423,27 @@ fn draw_selection_y(ctx: &RenderCtx, sel: Rect, offset: f32) { let mut text_paint = Paint::default(); text_paint.set_color(ctx.state.accent_color); text_paint.set_anti_alias(true); - // Both labels read bottom-to-top on screen (after the -90° rotation - // local +x points upward). With the transform stack - // (translate→rotate→scale) and a draw at code-(LX, 0), the actual - // origin in document coords is (text_x, pivot_y − LX·zi). - // - // Top label: want origin just above sel.top, reading upward from - // there, so pivot_y − LX·zi = sel.top − pad_y ⇒ LX = pad_y/zi. + // Both labels read bottom-to-top on screen + // 1. Top label canvas.save(); canvas.translate((text_x, sel.top)); canvas.rotate(-90.0, None); canvas.scale((zi, zi)); canvas.draw_str( &top_label, - Point::new(pad_y / zi, 0.0), + Point::new(RULER_AREA_SIZE / 2.0, 0.0), ctx.font, &text_paint, ); canvas.restore(); - // Bottom label: want the text END at sel.bottom + pad_y and origin - // at sel.bottom + pad_y + bw so it reads upward toward the band. + // 2. Bottom label canvas.save(); canvas.translate((text_x, sel.bottom)); canvas.rotate(-90.0, None); canvas.scale((zi, zi)); canvas.draw_str( &bottom_label, - Point::new(-bw_font - pad_y / zi, 0.0), + Point::new(-bw_font - RULER_AREA_SIZE / 2.0, 0.0), ctx.font, &text_paint, );