diff --git a/CHANGELOG.md b/CHANGELOG.md index 3c5414691..2d5a9b897 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -108,7 +108,6 @@ All notable changes to this project will be documented in this file. - In Rust, the generated component implements `Clone` and acts like an `Rc`. `sixtyfps::Weak` can be used to hold weak references. - `ARGBColor` was renamed `RgbaColor` - `width and `height` of some builtin elements now default to 100% of the parent element. - - `drop-shadow-blur` was changed to describe the blur level, not the size of the blur area. ### Added - Allow dashes in identifiers (#52) diff --git a/docs/builtin_elements.md b/docs/builtin_elements.md index 577c722a1..d6cb038a9 100644 --- a/docs/builtin_elements.md +++ b/docs/builtin_elements.md @@ -25,8 +25,8 @@ an element, it is possible to set the following `drop-shadow` properties: of the shadow from the element's frame. A negative value places the shadow left / above of the element. * **`drop-shadow-color`** (*color*): The base color of the shadow to use. Typically that color is the starting color of a gradient that fades into transparency. -* **`drop-shadow-blur`** (*float*): The level of blur applied to the shadow. Negative values are ignored and zero means - no blur (default). +* **`drop-shadow-blur`** (*length*): The radius of the shadow that also describes the level of blur applied to the shadow. + Negative values are ignored and zero means no blur (default). The `drop-shadow` effect is supported for `Rectangle` and `Clip` elements. diff --git a/examples/iot-dashboard/iot-dashboard.60 b/examples/iot-dashboard/iot-dashboard.60 index 315324980..3e5537cd4 100644 --- a/examples/iot-dashboard/iot-dashboard.60 +++ b/examples/iot-dashboard/iot-dashboard.60 @@ -227,7 +227,7 @@ Box := Rectangle { background: Skin.palette.box; drop-shadow-offset-x: 6px; drop-shadow-offset-y: 6px; - drop-shadow-blur: 6; + drop-shadow-blur: 6px; drop-shadow-color: Skin.palette.shadow; VerticalLayout { if (root.title != "") : Text { diff --git a/examples/slide_puzzle/slide_puzzle.60 b/examples/slide_puzzle/slide_puzzle.60 index b0ecd3641..3323f77cb 100644 --- a/examples/slide_puzzle/slide_puzzle.60 +++ b/examples/slide_puzzle/slide_puzzle.60 @@ -306,7 +306,7 @@ export MainWindow := Window { drop-shadow-offset-x: 1px; drop-shadow-offset-y: 1px; - drop-shadow-blur: 3; + drop-shadow-blur: 3px; drop-shadow-color: #00000040; border-radius: current-theme.piece-radius; clip: true; diff --git a/sixtyfps_compiler/typeregister.rs b/sixtyfps_compiler/typeregister.rs index de86e79d5..872df1d09 100644 --- a/sixtyfps_compiler/typeregister.rs +++ b/sixtyfps_compiler/typeregister.rs @@ -52,7 +52,7 @@ const RESERVED_OTHER_PROPERTIES: &'static [(&'static str, Type)] = &[ pub(crate) const RESERVED_DROP_SHADOW_PROPERTIES: &'static [(&'static str, Type)] = &[ ("drop_shadow_offset_x", Type::LogicalLength), ("drop_shadow_offset_y", Type::LogicalLength), - ("drop_shadow_blur", Type::Float32), + ("drop_shadow_blur", Type::LogicalLength), ("drop_shadow_color", Type::Color), ]; diff --git a/sixtyfps_runtime/rendering_backends/gl/lib.rs b/sixtyfps_runtime/rendering_backends/gl/lib.rs index 7a58b9961..db5b4f2e9 100644 --- a/sixtyfps_runtime/rendering_backends/gl/lib.rs +++ b/sixtyfps_runtime/rendering_backends/gl/lib.rs @@ -1011,7 +1011,7 @@ impl ItemRenderer for GLItemRenderer { .shared_data .load_item_graphics_cache_with_function(&box_shadow.cached_rendering_data, || { ItemGraphicsCacheEntry::Image({ - let blur = box_shadow.blur(); + let blur = box_shadow.blur() * self.scale_factor; let offset_x = box_shadow.offset_x() * self.scale_factor; let offset_y = box_shadow.offset_y() * self.scale_factor; let width = box_shadow.width() * self.scale_factor; @@ -1019,10 +1019,10 @@ impl ItemRenderer for GLItemRenderer { let radius = box_shadow.border_radius() * self.scale_factor; let shadow_rect: euclid::Rect = euclid::rect( - offset_x - blur / 2., - offset_y - blur / 2., - width + blur, - height + blur, + offset_x - blur, + offset_y - blur, + width + 2. * blur, + height + 2. * blur, ); let shadow_image_width = shadow_rect.max_x().ceil() as usize; diff --git a/tests/cases/examples/box_shadow_use.60 b/tests/cases/examples/box_shadow_use.60 index 0d14b2137..eab2ee276 100644 --- a/tests/cases/examples/box_shadow_use.60 +++ b/tests/cases/examples/box_shadow_use.60 @@ -31,7 +31,7 @@ TestCase := Window { drop-shadow-offset-x: 10px; drop-shadow-offset-y: 10px; drop-shadow-color: #00000080; - drop-shadow-blur: 5; + drop-shadow-blur: 5px; } for r[i] in [ @@ -42,7 +42,7 @@ TestCase := Window { drop-shadow-offset-x: 10px; drop-shadow-offset-y: 10px; drop-shadow-color: #00000080; - drop-shadow-blur: 5; + drop-shadow-blur: 5px; } Rectangle { @@ -62,7 +62,7 @@ TestCase := Window { drop-shadow-offset-x: 10px; drop-shadow-offset-y: 10px; drop-shadow-color: #249a04; - drop-shadow-blur: 3; + drop-shadow-blur: 3px; } } } @@ -80,7 +80,7 @@ TestCase := Window { drop-shadow-offset-x: 5px; drop-shadow-offset-y: 5px; drop-shadow-color: #00000080; - drop-shadow-blur: 5; + drop-shadow-blur: 5px; } } diff --git a/tools/syntax_updater/from_0_0_6.rs b/tools/syntax_updater/from_0_0_6.rs index 9ba5d87f8..fb7243584 100644 --- a/tools/syntax_updater/from_0_0_6.rs +++ b/tools/syntax_updater/from_0_0_6.rs @@ -39,19 +39,6 @@ pub(crate) fn fold_node( } } } - prop @ "drop_shadow_blur" | prop @ "drop-shadow-blur" => { - let expr = binding.BindingExpression(); - write!( - file, - "{}: ({}) / 1px; /* CHANGED BY SYNTAX UPDATER: drop-shadow-blur is now an abstract blur level, this is just an approximation. */", - prop, - expr.CodeBlock() - .map(|block| block.to_string()) - .or_else(|| expr.Expression().map(|expr| expr.to_string())) - .unwrap_or_default() - )?; - return Ok(true); - } _ => {} } };