Clean up code for drawing overlays to accept sRGB hex codes instead of Color structs (#3839)

* Clean up code for drawing overlays to accept sRGB hex codes instead of Color structs

* Consolidate hex code parsing functions
This commit is contained in:
Keavon Chambers
2026-02-27 14:08:58 -08:00
committed by GitHub
parent 9ecbfb7110
commit a8b5203d6c
13 changed files with 89 additions and 202 deletions
@@ -110,7 +110,8 @@ impl Fsm for FillToolFsmState {
// Get the layer the user is hovering over
if let Some(layer) = document.click(input, viewport) {
overlay_context.fill_path_pattern(document.metadata().layer_outline(layer), document.metadata().transform_to_viewport(layer), &preview_color);
let color_hex = format!("#{}", preview_color.to_rgba_hex_srgb());
overlay_context.fill_path_pattern(document.metadata().layer_outline(layer), document.metadata().transform_to_viewport(layer), &color_hex);
}
self
@@ -600,7 +600,7 @@ impl Fsm for GradientToolFsmState {
let (start, end) = (transform.transform_point2(*start), transform.transform_point2(*end));
fn color_to_hex(color: graphene_std::Color) -> String {
format!("#{}", color.with_alpha(1.).to_rgba_hex_srgb())
format!("#{}", color.to_rgb_hex_srgb_from_gamma())
}
let start_hex = stops.color.first().map(|&c| color_to_hex(c)).unwrap_or(String::from(COLOR_OVERLAY_BLUE));
@@ -1,8 +1,9 @@
use super::select_tool::extend_lasso;
use super::tool_prelude::*;
use crate::consts::{
COLOR_OVERLAY_BLUE, COLOR_OVERLAY_GRAY, COLOR_OVERLAY_GREEN, COLOR_OVERLAY_RED, DEFAULT_STROKE_WIDTH, DOUBLE_CLICK_MILLISECONDS, DRAG_DIRECTION_MODE_DETERMINATION_THRESHOLD, DRAG_THRESHOLD,
DRILL_THROUGH_THRESHOLD, HANDLE_ROTATE_SNAP_ANGLE, SEGMENT_INSERTION_DISTANCE, SEGMENT_OVERLAY_SIZE, SELECTION_THRESHOLD, SELECTION_TOLERANCE,
COLOR_OVERLAY_BLUE, COLOR_OVERLAY_BLUE_05, COLOR_OVERLAY_GRAY, COLOR_OVERLAY_GREEN, COLOR_OVERLAY_GREEN_25, COLOR_OVERLAY_RED, COLOR_OVERLAY_RED_25, DEFAULT_STROKE_WIDTH,
DOUBLE_CLICK_MILLISECONDS, DRAG_DIRECTION_MODE_DETERMINATION_THRESHOLD, DRAG_THRESHOLD, DRILL_THROUGH_THRESHOLD, HANDLE_ROTATE_SNAP_ANGLE, SEGMENT_INSERTION_DISTANCE, SEGMENT_OVERLAY_SIZE,
SELECTION_THRESHOLD, SELECTION_TOLERANCE,
};
use crate::messages::clipboard::utility_types::ClipboardContent;
use crate::messages::input_mapper::utility_types::macros::action_shortcut_manual;
@@ -1888,12 +1889,7 @@ impl Fsm for PathToolFsmState {
}
}
Self::Drawing { selection_shape } => {
let mut fill_color = graphene_std::Color::from_rgb_hex_for_overlays(COLOR_OVERLAY_BLUE.strip_prefix('#').unwrap())
.unwrap()
.with_alpha(0.05)
.to_rgba_hex_srgb();
fill_color.insert(0, '#');
let fill_color = Some(fill_color.as_str());
let fill_color = Some(COLOR_OVERLAY_BLUE_05);
let selection_mode = match tool_action_data.preferences.get_selection_mode() {
SelectionMode::Directional => tool_data.calculate_selection_mode_from_direction(document.metadata()),
@@ -1977,22 +1973,14 @@ impl Fsm for PathToolFsmState {
let origin = tool_data.drag_start_pos;
let viewport_diagonal = viewport.size().into_dvec2().length();
let faded = |color: &str| {
let mut color = graphene_std::Color::from_rgb_hex_for_overlays(color.strip_prefix('#').unwrap())
.unwrap()
.with_alpha(0.25)
.to_rgba_hex_srgb();
color.insert(0, '#');
color
};
match axis {
Axis::Y => {
overlay_context.line(origin - DVec2::Y * viewport_diagonal, origin + DVec2::Y * viewport_diagonal, Some(COLOR_OVERLAY_GREEN), None);
overlay_context.line(origin - DVec2::X * viewport_diagonal, origin + DVec2::X * viewport_diagonal, Some(&faded(COLOR_OVERLAY_RED)), None);
overlay_context.line(origin - DVec2::X * viewport_diagonal, origin + DVec2::X * viewport_diagonal, Some(COLOR_OVERLAY_RED_25), None);
}
Axis::X | Axis::Both => {
overlay_context.line(origin - DVec2::X * viewport_diagonal, origin + DVec2::X * viewport_diagonal, Some(COLOR_OVERLAY_RED), None);
overlay_context.line(origin - DVec2::Y * viewport_diagonal, origin + DVec2::Y * viewport_diagonal, Some(&faded(COLOR_OVERLAY_GREEN)), None);
overlay_context.line(origin - DVec2::Y * viewport_diagonal, origin + DVec2::Y * viewport_diagonal, Some(COLOR_OVERLAY_GREEN_25), None);
}
}
}
@@ -1,5 +1,5 @@
use super::tool_prelude::*;
use crate::consts::{COLOR_OVERLAY_BLUE, DEFAULT_STROKE_WIDTH, HIDE_HANDLE_DISTANCE, LINE_ROTATE_SNAP_ANGLE, SEGMENT_OVERLAY_SIZE};
use crate::consts::{COLOR_OVERLAY_BLUE, COLOR_OVERLAY_BLUE_05, DEFAULT_STROKE_WIDTH, HIDE_HANDLE_DISTANCE, LINE_ROTATE_SNAP_ANGLE, SEGMENT_OVERLAY_SIZE};
use crate::messages::input_mapper::utility_types::input_mouse::MouseKeys;
use crate::messages::portfolio::document::node_graph::document_node_definitions::resolve_network_node_type;
use crate::messages::portfolio::document::overlays::utility_functions::path_overlays;
@@ -1783,12 +1783,8 @@ impl Fsm for PenToolFsmState {
})
.collect();
let mut fill_color = graphene_std::Color::from_rgb_hex_for_overlays(COLOR_OVERLAY_BLUE.strip_prefix('#').unwrap())
.unwrap()
.with_alpha(0.05)
.to_rgba_hex_srgb();
fill_color.insert(0, '#');
overlay_context.fill_path(subpaths.iter(), transform, fill_color.as_str());
let fill_color = COLOR_OVERLAY_BLUE_05;
overlay_context.fill_path(subpaths.iter(), transform, fill_color);
}
}
}
@@ -689,13 +689,7 @@ impl Fsm for SelectToolFsmState {
.parent(document.metadata())
.is_some_and(|parent| selected.selected_layers_contains(parent, document.metadata()))
}) {
let mut fill_color = graphene_std::Color::from_rgb_hex_for_overlays(COLOR_OVERLAY_BLUE.strip_prefix('#').unwrap())
.unwrap()
.with_alpha(0.5)
.to_rgba_hex_srgb();
fill_color.insert(0, '#');
let fill_color = Some(fill_color.as_str());
hover_overlay_draw(new_selected, fill_color);
hover_overlay_draw(new_selected, Some(COLOR_OVERLAY_BLUE_50));
}
}
}
@@ -892,23 +886,15 @@ impl Fsm for SelectToolFsmState {
.map(|bounding_box_manager| bounding_box_manager.transform * Quad::from_box(bounding_box_manager.bounds))
.map_or(DVec2::X, |quad| (quad.top_left() - quad.top_right()).normalize_or(DVec2::X));
let (direction, color) = match axis {
Axis::X => (e0, COLOR_OVERLAY_RED),
Axis::Y => (e0.perp(), COLOR_OVERLAY_GREEN),
let (direction, color, color_faded) = match axis {
Axis::X => (e0, COLOR_OVERLAY_RED, COLOR_OVERLAY_RED_25),
Axis::Y => (e0.perp(), COLOR_OVERLAY_GREEN, COLOR_OVERLAY_GREEN_25),
_ => unreachable!(),
};
let viewport_diagonal = viewport.size().into_dvec2().length();
let color = if !hover {
color
} else {
let color_string = &graphene_std::Color::from_rgb_hex_for_overlays(color.strip_prefix('#').unwrap())
.unwrap()
.with_alpha(0.25)
.to_rgba_hex_srgb();
&format!("#{color_string}")
};
let color = if !hover { color } else { color_faded };
let line_center = tool_data.line_center;
overlay_context.line(line_center - direction * viewport_diagonal, line_center + direction * viewport_diagonal, Some(color), None);
}
@@ -926,16 +912,10 @@ impl Fsm for SelectToolFsmState {
let perp = edge.perp();
let (edge_color, perp_color) = if edge.x.abs() > edge.y.abs() {
(COLOR_OVERLAY_RED, COLOR_OVERLAY_GREEN)
(COLOR_OVERLAY_RED, COLOR_OVERLAY_GREEN_25)
} else {
(COLOR_OVERLAY_GREEN, COLOR_OVERLAY_RED)
(COLOR_OVERLAY_GREEN, COLOR_OVERLAY_RED_25)
};
let mut perp_color = graphene_std::Color::from_rgb_hex_for_overlays(perp_color.strip_prefix('#').unwrap())
.unwrap()
.with_alpha(0.25)
.to_rgba_hex_srgb();
perp_color.insert(0, '#');
let perp_color = perp_color.as_str();
overlay_context.line(origin - edge * viewport_diagonal, origin + edge * viewport_diagonal, Some(edge_color), None);
overlay_context.line(origin - perp * viewport_diagonal, origin + perp * viewport_diagonal, Some(perp_color), None);
}
@@ -978,12 +958,7 @@ impl Fsm for SelectToolFsmState {
}
// Update the selection box
let mut fill_color = graphene_std::Color::from_rgb_hex_for_overlays(COLOR_OVERLAY_BLUE.strip_prefix('#').unwrap())
.unwrap()
.with_alpha(0.05)
.to_rgba_hex_srgb();
fill_color.insert(0, '#');
let fill_color = Some(fill_color.as_str());
let fill_color = Some(COLOR_OVERLAY_BLUE_05);
let polygon = &tool_data.lasso_polygon;
@@ -1,7 +1,7 @@
#![allow(clippy::too_many_arguments)]
use super::tool_prelude::*;
use crate::consts::{COLOR_OVERLAY_BLUE, COLOR_OVERLAY_RED, DRAG_THRESHOLD};
use crate::consts::{COLOR_OVERLAY_BLUE_05, COLOR_OVERLAY_RED, DRAG_THRESHOLD};
use crate::messages::portfolio::document::graph_operation::utility_types::TransformIn;
use crate::messages::portfolio::document::node_graph::document_node_definitions::DefinitionIdentifier;
use crate::messages::portfolio::document::overlays::utility_types::OverlayContext;
@@ -570,10 +570,7 @@ impl Fsm for TextToolFsmState {
..
} = transition_data;
let font_cache = &persistent_data.font_cache;
let fill_color = graphene_std::Color::from_rgb_hex_for_overlays(COLOR_OVERLAY_BLUE.strip_prefix('#').unwrap())
.unwrap()
.with_alpha(0.05)
.to_rgba_hex_srgb();
let fill_color = COLOR_OVERLAY_BLUE_05;
let ToolMessage::Text(event) = event else { return self };
match (self, event) {
@@ -585,7 +582,7 @@ impl Fsm for TextToolFsmState {
if far.x != 0. && far.y != 0. {
let quad = Quad::from_box([DVec2::ZERO, far]);
let transformed_quad = document.metadata().transform_to_viewport(tool_data.layer) * quad;
overlay_context.quad(transformed_quad, None, Some(&("#".to_string() + &fill_color)));
overlay_context.quad(transformed_quad, None, Some(fill_color));
}
}
@@ -598,14 +595,10 @@ impl Fsm for TextToolFsmState {
// Draw a bounding box on the layers to be selected
for layer in document.intersect_quad_no_artboards(quad, viewport) {
overlay_context.quad(
Quad::from_box(document.metadata().bounding_box_viewport(layer).unwrap_or([DVec2::ZERO; 2])),
None,
Some(&("#".to_string() + &fill_color)),
);
overlay_context.quad(Quad::from_box(document.metadata().bounding_box_viewport(layer).unwrap_or([DVec2::ZERO; 2])), None, Some(fill_color));
}
overlay_context.quad(quad, None, Some(&("#".to_string() + &fill_color)));
overlay_context.quad(quad, None, Some(fill_color));
}
// TODO: implement bounding box for multiple layers