Correctly capture and use stroke properties when rendering SVG paths (l…

…inebender#1647)

* Use correct LineJoin and LineCap behavior in svg widget

* Correctly set miter limit and dash array properties when rendering SVG paths with stroke

* Update changelog

CHANGELOG.md

@@ -40,6 +40,7 @@ You can find its changes [documented below](#070---2021-01-01).
 
 - Fixed docs of derived Lens ([#1523] by [@Maan2003])
 - Use correct fill rule when rendering SVG paths ([#1606] by [@SecondFlight])
+- Correctly capture and use stroke properties when rendering SVG paths ([#1647] by [@SecondFlight])
 
 ### Visual
 
@@ -635,6 +636,7 @@ Last release without a changelog :(
 [#1634]: https://github.com/linebender/druid/pull/1634
 [#1635]: https://github.com/linebender/druid/pull/1635
 [#1641]: https://github.com/linebender/druid/pull/1641
+[#1647]: https://github.com/linebender/druid/pull/1647
 
 [Unreleased]: https://github.com/linebender/druid/compare/v0.7.0...master
 [0.7.0]: https://github.com/linebender/druid/compare/v0.6.0...v0.7.0

druid/src/widget/svg.rs

@@ -19,7 +19,7 @@ use tracing::{instrument, trace};
 
 use crate::{
     kurbo::BezPath,
-    piet::{self, FixedLinearGradient, GradientStop},
+    piet::{self, FixedLinearGradient, GradientStop, LineCap, LineJoin, StrokeStyle},
     widget::common::FillStrat,
     widget::prelude::*,
     Affine, Color, Data, Point, Rect,
@@ -309,7 +309,22 @@ impl SvgRenderer {
         match &p.stroke {
             Some(stroke) => {
                 let brush = self.brush_from_usvg(&stroke.paint, stroke.opacity, ctx);
-                ctx.stroke(path, &*brush, stroke.width.value());
+                let mut stroke_style = StrokeStyle::new()
+                    .line_join(match stroke.linejoin {
+                        usvg::LineJoin::Miter => LineJoin::Miter,
+                        usvg::LineJoin::Round => LineJoin::Round,
+                        usvg::LineJoin::Bevel => LineJoin::Bevel,
+                    })
+                    .line_cap(match stroke.linecap {
+                        usvg::LineCap::Butt => LineCap::Butt,
+                        usvg::LineCap::Round => LineCap::Round,
+                        usvg::LineCap::Square => LineCap::Square,
+                    })
+                    .miter_limit(stroke.miterlimit.value());
+                if let Some(dash_array) = &stroke.dasharray {
+                    stroke_style.set_dash(dash_array.clone(), stroke.dashoffset as f64);
+                }
+                ctx.stroke_styled(path, &*brush, stroke.width.value(), &stroke_style);
             }
             None => {}
         }