3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-06-11 18:31:39 +02:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #6126 from penpot/elenatorro-10516-fix-stroke-shadows

Browse source 
🐛 Fix stroke shadows
This commit is contained in:
Alejandro 2025-03-28 09:54:39 +01:00 • committed by GitHub
commit bd5e47f5fc
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 122 additions and 201 deletions
Download patch file Download diff file Expand all files Collapse all files

102
render-wasm/src/render/shadows.rs
View file

@ -1,18 +1,14 @@
use super::{RenderState, SurfaceId};
use crate::shapes::{Shadow, Shape, Type};
use skia_safe::{self as skia, Paint};
use crate::render::strokes;
use crate::shapes::{Shadow, Shape, Stroke, Type};
use skia_safe::Paint;
// Drop Shadows
pub fn render_drop_shadows(render_state: &mut RenderState, shape: &Shape, antialias: bool) {
// Fill Shadows
pub fn render_fill_drop_shadows(render_state: &mut RenderState, shape: &Shape, antialias: bool) {
if shape.has_fills() {
for shadow in shape.drop_shadows().rev().filter(|s| !s.hidden()) {
render_fill_drop_shadow(render_state, &shape, &shadow, antialias);
}
} else {
let scale = render_state.get_scale();
for shadow in shape.drop_shadows().rev().filter(|s| !s.hidden()) {
render_stroke_drop_shadow(render_state, &shadow, scale, antialias);
}
}
}
@ -26,42 +22,11 @@ fn render_fill_drop_shadow(
render_shadow_paint(render_state, shape, paint, SurfaceId::DropShadows);
}
// TODO: Stroke shadows
fn render_stroke_drop_shadow(
render_state: &mut RenderState,
shadow: &Shadow,
scale: f32,
antialias: bool,
) {
let shadow_paint = &shadow.to_paint(scale, antialias);
render_state
.surfaces
.draw_into(SurfaceId::Strokes, SurfaceId::Shadow, Some(shadow_paint));
render_state.surfaces.draw_into(
SurfaceId::Shadow,
SurfaceId::Current,
Some(&skia::Paint::default()),
);
render_state
.surfaces
.canvas(SurfaceId::Shadow)
.clear(skia::Color::TRANSPARENT);
}
// Inner Shadows
pub fn render_inner_shadows(render_state: &mut RenderState, shape: &Shape, antialias: bool) {
pub fn render_fill_inner_shadows(render_state: &mut RenderState, shape: &Shape, antialias: bool) {
if shape.has_fills() {
for shadow in shape.inner_shadows().rev().filter(|s| !s.hidden()) {
render_fill_inner_shadow(render_state, &shape, &shadow, antialias);
}
} else {
let scale = render_state.get_scale();
for shadow in shape.inner_shadows().rev().filter(|s| !s.hidden()) {
render_stroke_inner_shadow(render_state, &shadow, scale, antialias);
}
}
}
@ -75,29 +40,46 @@ fn render_fill_inner_shadow(
render_shadow_paint(render_state, shape, paint, SurfaceId::InnerShadows);
}
// TODO: Stroke shadows
fn render_stroke_inner_shadow(
pub fn render_stroke_drop_shadows(
render_state: &mut RenderState,
shadow: &Shadow,
scale: f32,
shape: &Shape,
stroke: &Stroke,
antialias: bool,
) {
let shadow_paint = &shadow.to_paint(scale, antialias);
if !shape.has_fills() {
for shadow in shape.drop_shadows().rev().filter(|s| !s.hidden()) {
let filter = shadow.get_drop_shadow_filter();
strokes::render(
render_state,
&shape,
stroke,
Some(SurfaceId::Strokes), // FIXME
filter.as_ref(),
antialias,
)
}
}
}
render_state
.surfaces
.draw_into(SurfaceId::Strokes, SurfaceId::Shadow, Some(shadow_paint));
render_state.surfaces.draw_into(
SurfaceId::Shadow,
SurfaceId::Overlay,
Some(&skia::Paint::default()),
);
render_state
.surfaces
.canvas(SurfaceId::Shadow)
.clear(skia::Color::TRANSPARENT);
pub fn render_stroke_inner_shadows(
render_state: &mut RenderState,
shape: &Shape,
stroke: &Stroke,
antialias: bool,
) {
if !shape.has_fills() {
for shadow in shape.inner_shadows().rev().filter(|s| !s.hidden()) {
let filter = shadow.get_inner_shadow_filter();
strokes::render(
render_state,
&shape,
stroke,
Some(SurfaceId::Strokes), // FIXME
filter.as_ref(),
antialias,
)
}
}
}
fn render_shadow_paint(

73
render-wasm/src/render/strokes.rs
View file

@ -3,7 +3,7 @@ use std::collections::HashMap;
use crate::math::{Matrix, Point, Rect};
use crate::shapes::{Corners, Fill, ImageFill, Path, Shape, Stroke, StrokeCap, StrokeKind, Type};
use skia_safe::{self as skia, RRect};
use skia_safe::{self as skia, ImageFilter, RRect};
use super::{RenderState, SurfaceId};
@ -15,6 +15,7 @@ fn draw_stroke_on_rect(
corners: &Option<Corners>,
svg_attrs: &HashMap<String, String>,
scale: f32,
shadow: Option<&ImageFilter>,
antialias: bool,
) {
// Draw the different kind of strokes for a rect is straightforward, we just need apply a stroke to:
@ -22,7 +23,11 @@ fn draw_stroke_on_rect(
// - A bigger rect if it's an outer stroke
// - A smaller rect if it's an outer stroke
let stroke_rect = stroke.outer_rect(rect);
let paint = stroke.to_paint(selrect, svg_attrs, scale, antialias);
let mut paint = stroke.to_paint(selrect, svg_attrs, scale, antialias);
if let Some(filter) = shadow {
paint.set_image_filter(filter.clone());
}
match corners {
Some(radii) => {
@ -43,6 +48,7 @@ fn draw_stroke_on_circle(
selrect: &Rect,
svg_attrs: &HashMap<String, String>,
scale: f32,
shadow: Option<&ImageFilter>,
antialias: bool,
) {
// Draw the different kind of strokes for an oval is straightforward, we just need apply a stroke to:
@ -50,13 +56,16 @@ fn draw_stroke_on_circle(
// - A bigger oval if it's an outer stroke
// - A smaller oval if it's an outer stroke
let stroke_rect = stroke.outer_rect(rect);
canvas.draw_oval(
&stroke_rect,
&stroke.to_paint(selrect, svg_attrs, scale, antialias),
);
let mut paint = stroke.to_paint(selrect, svg_attrs, scale, antialias);
if let Some(filter) = shadow {
paint.set_image_filter(filter.clone());
}
canvas.draw_oval(&stroke_rect, &paint);
}
fn draw_stroke_on_path(
pub fn draw_stroke_on_path(
canvas: &skia::Canvas,
stroke: &Stroke,
path: &Path,
@ -64,13 +73,19 @@ fn draw_stroke_on_path(
path_transform: Option<&Matrix>,
svg_attrs: &HashMap<String, String>,
scale: f32,
shadow: Option<&ImageFilter>,
antialias: bool,
) {
let mut skia_path = path.to_skia_path();
skia_path.transform(path_transform.unwrap());
let is_open = path.is_open();
let paint_stroke = stroke.to_stroked_paint(is_open, selrect, svg_attrs, scale, antialias);
let mut paint: skia_safe::Handle<_> =
stroke.to_stroked_paint(path.is_open(), selrect, svg_attrs, scale, antialias);
if let Some(filter) = shadow {
paint.set_image_filter(filter.clone());
}
// Draw the different kind of strokes for a path requires different strategies:
match stroke.render_kind(is_open) {
@ -78,22 +93,21 @@ fn draw_stroke_on_path(
StrokeKind::InnerStroke => {
canvas.save(); // As we are using clear for surfaces we use save and restore here to still be able to clean the full surface
canvas.clip_path(&skia_path, skia::ClipOp::Intersect, antialias);
canvas.draw_path(&skia_path, &paint_stroke);
canvas.draw_path(&skia_path, &paint);
canvas.restore();
}
// For center stroke we don't need to do anything extra
StrokeKind::CenterStroke => {
canvas.draw_path(&skia_path, &paint_stroke);
canvas.draw_path(&skia_path, &paint);
}
// For outer stroke we draw a center stroke (with double width) and use another path with blend mode clear to remove the inner stroke added
StrokeKind::OuterStroke => {
let mut paint = skia::Paint::default();
paint.set_blend_mode(skia::BlendMode::SrcOver);
paint.set_anti_alias(antialias);
let layer_rec = skia::canvas::SaveLayerRec::default().paint(&paint);
let mut outer_paint = skia::Paint::default();
outer_paint.set_blend_mode(skia::BlendMode::SrcOver);
outer_paint.set_anti_alias(antialias);
let layer_rec = skia::canvas::SaveLayerRec::default().paint(&outer_paint);
canvas.save_layer(&layer_rec);
canvas.draw_path(&skia_path, &paint_stroke);
canvas.draw_path(&skia_path, &paint);
let mut clear_paint = skia::Paint::default();
clear_paint.set_blend_mode(skia::BlendMode::Clear);
@ -344,7 +358,7 @@ fn draw_image_stroke_in_container(
let size = image_fill.size();
let scale = render_state.get_scale();
let canvas = render_state.surfaces.canvas(SurfaceId::Fills);
let canvas = render_state.surfaces.canvas(SurfaceId::Strokes);
let container = &shape.selrect;
let path_transform = shape.to_path_transform();
let svg_attrs = &shape.svg_attrs;
@ -370,6 +384,7 @@ fn draw_image_stroke_in_container(
&shape_type.corners(),
svg_attrs,
scale,
None,
antialias,
);
}
@ -380,6 +395,7 @@ fn draw_image_stroke_in_container(
&outer_rect,
svg_attrs,
scale,
None,
antialias,
),
@ -456,15 +472,26 @@ fn draw_image_stroke_in_container(
/**
* This SHOULD be the only public function in this module.
*/
pub fn render(render_state: &mut RenderState, shape: &Shape, stroke: &Stroke, antialias: bool) {
pub fn render(
render_state: &mut RenderState,
shape: &Shape,
stroke: &Stroke,
surface_id: Option<SurfaceId>,
shadow: Option<&ImageFilter>,
antialias: bool,
) {
let scale = render_state.get_scale();
let canvas = render_state.surfaces.canvas(SurfaceId::Strokes);
let canvas = render_state
.surfaces
.canvas(surface_id.unwrap_or(SurfaceId::Strokes));
let selrect = shape.selrect;
let path_transform = shape.to_path_transform();
let svg_attrs = &shape.svg_attrs;
if let Fill::Image(image_fill) = &stroke.fill {
draw_image_stroke_in_container(render_state, shape, stroke, image_fill, antialias);
if !shadow.is_some() && matches!(stroke.fill, Fill::Image(_)) {
if let Fill::Image(image_fill) = &stroke.fill {
draw_image_stroke_in_container(render_state, shape, stroke, image_fill, antialias);
}
} else {
match &shape.shape_type {
shape_type @ (Type::Rect(_) | Type::Frame(_)) => {
@ -476,11 +503,12 @@ pub fn render(render_state: &mut RenderState, shape: &Shape, stroke: &Stroke, an
&shape_type.corners(),
svg_attrs,
scale,
shadow,
antialias,
);
}
Type::Circle => draw_stroke_on_circle(
canvas, stroke, &selrect, &selrect, svg_attrs, scale, antialias,
canvas, stroke, &selrect, &selrect, svg_attrs, scale, shadow, antialias,
),
shape_type @ (Type::Path(_) | Type::Bool(_)) => {
if let Some(path) = shape_type.path() {
@ -492,6 +520,7 @@ pub fn render(render_state: &mut RenderState, shape: &Shape, stroke: &Stroke, an
path_transform.as_ref(),
svg_attrs,
scale,
shadow,
antialias,
);
}

15
render-wasm/src/render/surfaces.rs
View file

@ -13,10 +13,8 @@ pub enum SurfaceId {
Current,
Fills,
Strokes,
Shadow,
DropShadows,
InnerShadows,
Overlay,
Debug,
}
@ -30,12 +28,9 @@ pub struct Surfaces {
// keeps the current shape's strokes
shape_strokes: skia::Surface,
// used for rendering shadows
shadow: skia::Surface,
// used for new shadow rendering
drop_shadows: skia::Surface,
// used fo rendering over shadows.
inner_shadows: skia::Surface,
// for drawing the things that are over shadows.
overlay: skia::Surface,
// for drawing debug info.
debug: skia::Surface,
// for drawing tiles.
@ -63,10 +58,8 @@ impl Surfaces {
let mut target = gpu_state.create_target_surface(width, height);
let current = target.new_surface_with_dimensions(extra_tile_dims).unwrap();
let shadow = target.new_surface_with_dimensions(extra_tile_dims).unwrap();
let drop_shadows = target.new_surface_with_dimensions(extra_tile_dims).unwrap();
let inner_shadows = target.new_surface_with_dimensions(extra_tile_dims).unwrap();
let overlay = target.new_surface_with_dimensions(extra_tile_dims).unwrap();
let shape_fills = target.new_surface_with_dimensions(extra_tile_dims).unwrap();
let shape_strokes = target.new_surface_with_dimensions(extra_tile_dims).unwrap();
let debug = target.new_surface_with_dimensions((width, height)).unwrap();
@ -79,10 +72,8 @@ impl Surfaces {
Surfaces {
target,
current,
shadow,
drop_shadows,
inner_shadows,
overlay,
shape_fills,
shape_strokes,
debug,
@ -176,10 +167,8 @@ impl Surfaces {
match id {
SurfaceId::Target => &mut self.target,
SurfaceId::Current => &mut self.current,
SurfaceId::Shadow => &mut self.shadow,
SurfaceId::DropShadows => &mut self.drop_shadows,
SurfaceId::InnerShadows => &mut self.inner_shadows,
SurfaceId::Overlay => &mut self.overlay,
SurfaceId::Fills => &mut self.shape_fills,
SurfaceId::Strokes => &mut self.shape_strokes,
SurfaceId::Debug => &mut self.debug,
@ -225,8 +214,6 @@ impl Surfaces {
SurfaceId::Current,
SurfaceId::DropShadows,
SurfaceId::InnerShadows,
SurfaceId::Shadow,
SurfaceId::Overlay,
],
|s| {
s.canvas().clear(color).reset_matrix();