Revert "Merge pull request #2962 from iced-rs/fix/blurry-quads"

This reverts commit 03326b955b, reversing
changes made to 7c5a4bc465.

core/src/image.rs

@@ -23,6 +23,12 @@ pub struct Image<H = Handle> {
     ///
     /// 0 means transparent. 1 means opaque.
     pub opacity: f32,
+
+    /// If set to `true`, the image will be snapped to the pixel grid.
+    ///
+    /// This can avoid graphical glitches, specially when using
+    /// [`FilterMethod::Nearest`].
+    pub snap: bool,
 }
 
 impl Image<Handle> {
@@ -33,6 +39,7 @@ impl Image<Handle> {
             filter_method: FilterMethod::default(),
             rotation: Radians(0.0),
             opacity: 1.0,
+            snap: false,
         }
     }
 
@@ -53,6 +60,12 @@ impl Image<Handle> {
         self.opacity = opacity.into();
         self
     }
+
+    /// Sets whether the [`Image`] should be snapped to the pixel grid.
+    pub fn snap(mut self, snap: bool) -> Self {
+        self.snap = snap;
+        self
+    }
 }
 
 impl From<&Handle> for Image {

core/src/rectangle.rs

@@ -250,14 +250,11 @@ impl Rectangle<f32> {
             return None;
         }
 
-        let x = (self.x + 0.01).round();
-        let y = (self.y + 0.01).round();
-
         Some(Rectangle {
-            x: x as u32,
+            x: self.x as u32,
-            y: y as u32,
+            y: self.y as u32,
-            width: ((self.x + self.width + 0.01).round() - x) as u32,
+            width,
-            height: ((self.y + self.height + 0.01).round() - y) as u32,
+            height,
         })
     }
 

examples/styling/snapshots/catppuccin_frappé-tiny-skia.sha256

@@ -1 +1 @@
-12ba47a34ed415825a23f8ef377a2d52950d2f8614a66bf46c0ec28d0cf15c85
+9e67e429f88fd5a64744d9cd4d42e123950bea4a45fea78581bc3d64b12e11f0

examples/styling/snapshots/catppuccin_latte-tiny-skia.sha256

@@ -1 +1 @@
-fa00d7e0ff95b366945d409712d7fe4ce44fff22425236cb56b8b96a88815ee6
+811a22238f3a40e3e3998f514c0a95f24f2b45449250682d86c8ec392fec5e28

examples/styling/snapshots/catppuccin_macchiato-tiny-skia.sha256

@@ -1 +1 @@
-4e594cfec775d51f7f836646c59bf4a2de07252721d66ddddea69c17e9112bae
+6bf957efe807f87f38cfc672f9a05325aadee6256aacca87bbc3281b98160c8a

examples/styling/snapshots/catppuccin_mocha-tiny-skia.sha256

@@ -1 +1 @@
-2ab665b51387c61086ae0199c29e291105bfe4583bd4c4daa652e30917f10bd6
+d3f4110fae78a3be3b7a4813e9a432b48b81fff1e982c0244e4ea394074bef55

examples/styling/snapshots/dark-tiny-skia.sha256

@@ -1 +1 @@
-61c9ee377b33ffa800f512877e45ad5f41fbac36f5d3f06d1b62d6af6ee9d7b2
+578e7420de69d82906d284c59d81fcea0edf81098481fc4dd7b4c1fb577b7f1c

examples/styling/snapshots/dracula-tiny-skia.sha256

@@ -1 +1 @@
-75f2fb12c9090a256708515de01a25e78905f71e134b7cda79f4fe44b2434052
+422e841113efaa86e9e37593d0d14f8dd36ad483a81c30a08588f48805e4f9f3

examples/styling/snapshots/ferra-tiny-skia.sha256

@@ -1 +1 @@
-b4a1b42d2e21b2a493605745e6beb8e1f28cbeb01b73336e1e8d9061249a8311
+3d616a31842a29b4a3d31fbeef25f95c7b50f33360f1c05e069e0b29b3f7553e

examples/styling/snapshots/gruvbox_dark-tiny-skia.sha256

@@ -1 +1 @@
-eb52921b3ee23e1814268701c935d0dff387e7eb741c50443f75a7ab902b5e44
+9a21865bfc075669d368ccac69b975c3e1f6c22ba297dddfa003d4ee1a06641c

examples/styling/snapshots/gruvbox_light-tiny-skia.sha256

@@ -1 +1 @@
-bf6c4cbd6eeed0167d28509e37292f5ce26ed1d58bb156bedb861d0619a1945b
+d5164fb10a92177afd0aab353557d1e3fdaa743962c6a901f05cbfcd0d91e9fb

examples/styling/snapshots/kanagawa_dragon-tiny-skia.sha256

@@ -1 +1 @@
-83726a4175900a9ef159b80925f2fa985b4ea87bff78d8bb01918fb6c40d6175
+3d5ba3b50f192f8700edbfbf54007e92dfd66997bce7342671afc2b60d556aca

examples/styling/snapshots/kanagawa_lotus-tiny-skia.sha256

@@ -1 +1 @@
-54c8d44afbdd644f324cf40e744b3d7871263e44de2d9a91f6c10470c38ac3c6
+90cb13c900d58a56ce170afeefbceb77410d024e7eae6030e181df1c929c3944

examples/styling/snapshots/kanagawa_wave-tiny-skia.sha256

@@ -1 +1 @@
-5713843396e2efcfc7cc8abd00343d5d66ce8b8a195212a9b75dbfeec8edf7a7
+71b625bc39aaead7a1298e4b2dad51b266526c53deab139858774986395878db

examples/styling/snapshots/light-tiny-skia.sha256

@@ -1 +1 @@
-f1b20ab79f8242776d9eb1ad9cff7090435aa416811c48a7c22c69b09cd8e70f
+f08f80a79959ef1c2fd8f8696a26555f2b2eab6618dd3653a042acab563bcced

examples/styling/snapshots/moonfly-tiny-skia.sha256

@@ -1 +1 @@
-2c4be9dc1340b65cad6d15d5318017412eba1247a016379b83db379dde0214af
+3302b7934051ff8aa01d70c45e28c444bdc93e8a4da219931aa22465b51c6748

examples/styling/snapshots/nightfly-tiny-skia.sha256

@@ -1 +1 @@
-2d5d6b9613ccb6a2f23142baf704288037808e7a60ee05bdc73490d8c8780064
+661ec43b66213f369ce5a3680e9e8ead56c98d94718da25b12fbb313386944e0

examples/styling/snapshots/nord-tiny-skia.sha256

@@ -1 +1 @@
-512b8dfd4687a609d202436e75ecf1a5553acc2157000e77e31c1578941b033c
+b5dd22b064220d5f2f90c6f0f381eff41d25f534587d1649ed59e25f878eda97

examples/styling/snapshots/oxocarbon-tiny-skia.sha256

@@ -1 +1 @@
-4b3b7a2dc65307a3551227f1c5d2bb49da15d29e320ccaa160e3d9fca44c1037
+dd6e7e7ba125a2549143501c3de44427633f0bfa6c0d8b6f66aa95d503874065

examples/styling/snapshots/solarized_dark-tiny-skia.sha256

@@ -1 +1 @@
-15aa476c65304bde23e3648ceb424d6394f525f6c1d3e49ee1150376b6fd3068
+44b5afe743b753a54f3e68da2fd2701837e7e8cff276ff1e8c349030c83ac72e

examples/styling/snapshots/solarized_light-tiny-skia.sha256

@@ -1 +1 @@
-04fcb0da640c6e7c1d86c95c74570c9f9d8f56056c9802eef332187f52c003ca
+1b46820f12611b2759eb843688cd13b6024f2096b7986f205398bb029e0c60bd

examples/styling/snapshots/tokyo_night-tiny-skia.sha256

@@ -1 +1 @@
-26e9660da3caa88e5a995739c986b142487f1449c1a5dc555abf7bc7cbca2345
+27a9a8bb08cea7b0a9b9763e332a6833d4fead1a885cdd59a1f5161e3726d6b1

examples/styling/snapshots/tokyo_night_light-tiny-skia.sha256

@@ -1 +1 @@
-8d846a765ff96506ad4f26a672976cb1bfa997d4b09c5ecabf273d5e22ae0a3a
+ab0dee2cc24f30eb51b376a0385302b45bfeddb373348525dab7f551c27ffec2

examples/styling/snapshots/tokyo_night_storm-tiny-skia.sha256

@@ -1 +1 @@
-0ecd51994f6eb37f111dc1b21cad72bb705499eb83156e9dc3ae2221ec392a42
+aef404c7e38aec5387c39cf3a2911688324c1b9b520e5f541b9fd3fd6eefd3a8

wgpu/src/image/mod.rs

@@ -147,6 +147,8 @@ impl Pipeline {
                             6 => Float32x2,
                             // Layer
                             7 => Sint32,
+                            // Snap
+                            8 => Uint32,
                         ),
                     }],
                     compilation_options:
@@ -241,7 +243,7 @@ impl State {
                             [bounds.width, bounds.height],
                             f32::from(image.rotation),
                             image.opacity,
-                            scale,
+                            image.snap,
                             atlas_entry,
                             match image.filter_method {
                                 crate::core::image::FilterMethod::Nearest => {
@@ -274,7 +276,7 @@ impl State {
                             size,
                             f32::from(svg.rotation),
                             svg.opacity,
-                            scale,
+                            true,
                             atlas_entry,
                             nearest_instances,
                         );
@@ -504,6 +506,7 @@ struct Instance {
     _position_in_atlas: [f32; 2],
     _size_in_atlas: [f32; 2],
     _layer: u32,
+    _snap: u32,
 }
 
 impl Instance {
@@ -521,21 +524,14 @@ struct Uniforms {
 }
 
 fn add_instances(
-    mut image_position: [f32; 2],
+    image_position: [f32; 2],
-    mut image_size: [f32; 2],
+    image_size: [f32; 2],
     rotation: f32,
     opacity: f32,
-    scale: f32,
+    snap: bool,
     entry: &atlas::Entry,
     instances: &mut Vec<Instance>,
 ) {
-    let snap = |coordinate: f32| (coordinate * scale).round() / scale;
-
-    image_position[0] = snap(image_position[0]);
-    image_position[1] = snap(image_position[1]);
-    image_size[0] = snap(image_size[0]);
-    image_size[1] = snap(image_size[1]);
-
     let center = [
         image_position[0] + image_size[0] / 2.0,
         image_position[1] + image_size[1] / 2.0,
@@ -549,6 +545,7 @@ fn add_instances(
                 image_size,
                 rotation,
                 opacity,
+                snap,
                 allocation,
                 instances,
             );
@@ -578,8 +575,8 @@ fn add_instances(
                 ];
 
                 add_instance(
-                    position, center, size, rotation, opacity, allocation,
+                    position, center, size, rotation, opacity, snap,
-                    instances,
+                    allocation, instances,
                 );
             }
         }
@@ -593,6 +590,7 @@ fn add_instance(
     size: [f32; 2],
     rotation: f32,
     opacity: f32,
+    snap: bool,
     allocation: &atlas::Allocation,
     instances: &mut Vec<Instance>,
 ) {
@@ -615,6 +613,7 @@ fn add_instance(
             (height as f32 - 1.0) / atlas::SIZE as f32,
         ],
         _layer: layer as u32,
+        _snap: snap as u32,
     };
 
     instances.push(instance);

wgpu/src/shader/image.wgsl

@@ -17,6 +17,7 @@ struct VertexInput {
     @location(5) atlas_pos: vec2<f32>,
     @location(6) atlas_scale: vec2<f32>,
     @location(7) layer: i32,
+    @location(8) snap: u32,
 }
 
 struct VertexOutput {
@@ -53,7 +54,11 @@ fn vs_main(input: VertexInput) -> VertexOutput {
 
     // Calculate the final position of the vertex
     out.position = vec4(vec2(globals.scale_factor), 1.0, 1.0) * (vec4<f32>(input.center, 0.0, 0.0) + rotate * vec4<f32>(v_pos, 0.0, 1.0));
-    out.position = round(out.position);
+
+    if bool(input.snap) {
+        out.position = round(out.position);
+    }
+
     out.position = globals.transform * out.position;
 
     return out;

wgpu/src/shader/quad/gradient.wgsl

@@ -33,9 +33,6 @@ fn gradient_vs_main(input: GradientVertexInput) -> GradientVertexOutput {
     var pos: vec2<f32> = input.position_and_scale.xy * globals.scale;
     var scale: vec2<f32> = input.position_and_scale.zw * globals.scale;
 
-    var pos_snap: vec2<f32> = round(pos + vec2(0.01, 0.01)) - pos;
-    var scale_snap: vec2<f32> = round(pos + scale + vec2(0.01, 0.01)) - pos - pos_snap - scale;
-
     var min_border_radius = min(input.position_and_scale.z, input.position_and_scale.w) * 0.5;
     var border_radius: vec4<f32> = vec4<f32>(
         min(input.border_radius.x, min_border_radius),
@@ -45,10 +42,10 @@ fn gradient_vs_main(input: GradientVertexInput) -> GradientVertexOutput {
     );
 
     var transform: mat4x4<f32> = mat4x4<f32>(
-        vec4<f32>(scale.x + scale_snap.x + 1.0, 0.0, 0.0, 0.0),
+        vec4<f32>(scale.x + 1.0, 0.0, 0.0, 0.0),
-        vec4<f32>(0.0, scale.y + scale_snap.y + 1.0, 0.0, 0.0),
+        vec4<f32>(0.0, scale.y + 1.0, 0.0, 0.0),
         vec4<f32>(0.0, 0.0, 1.0, 0.0),
-        vec4<f32>(pos + pos_snap, 0.0, 1.0)
+        vec4<f32>(pos - vec2<f32>(0.5, 0.5), 0.0, 1.0)
     );
 
     out.position = globals.transform * transform * vec4<f32>(vertex_position(input.vertex_index), 0.0, 1.0);
@@ -58,7 +55,7 @@ fn gradient_vs_main(input: GradientVertexInput) -> GradientVertexOutput {
     out.colors_4 = input.colors_4;
     out.offsets = input.offsets;
     out.direction = input.direction * globals.scale;
-    out.position_and_scale = vec4<f32>(pos + pos_snap, scale + scale_snap);
+    out.position_and_scale = vec4<f32>(pos, scale);
     out.border_color = premultiply(input.border_color);
     out.border_radius = border_radius * globals.scale;
     out.border_width = input.border_width * globals.scale;

wgpu/src/shader/quad/solid.wgsl

@@ -30,9 +30,15 @@ fn solid_vs_main(input: SolidVertexInput) -> SolidVertexOutput {
 
     var pos: vec2<f32> = (input.pos + min(input.shadow_offset, vec2<f32>(0.0, 0.0)) - input.shadow_blur_radius) * globals.scale;
     var scale: vec2<f32> = (input.scale + vec2<f32>(abs(input.shadow_offset.x), abs(input.shadow_offset.y)) + input.shadow_blur_radius * 2.0) * globals.scale;
+    var snap: vec2<f32> = vec2<f32>(0.0, 0.0);
 
-    var pos_snap: vec2<f32> = round(pos + vec2(0.01, 0.01)) - pos;
+    if input.scale.x == 1.0 {
-    var scale_snap: vec2<f32> = round(pos + scale + vec2(0.01, 0.01)) - pos - pos_snap - scale;
+        snap.x = round(pos.x) - pos.x;
+    }
+
+    if input.scale.y == 1.0 {
+        snap.y = round(pos.y) - pos.y;
+    }
 
     var min_border_radius = min(input.scale.x, input.scale.y) * 0.5;
     var border_radius: vec4<f32> = vec4<f32>(
@@ -43,17 +49,17 @@ fn solid_vs_main(input: SolidVertexInput) -> SolidVertexOutput {
     );
 
     var transform: mat4x4<f32> = mat4x4<f32>(
-        vec4<f32>(scale.x + scale_snap.x + 1.0, 0.0, 0.0, 0.0),
+        vec4<f32>(scale.x + 1.0, 0.0, 0.0, 0.0),
-        vec4<f32>(0.0, scale.y + scale_snap.y + 1.0, 0.0, 0.0),
+        vec4<f32>(0.0, scale.y + 1.0, 0.0, 0.0),
         vec4<f32>(0.0, 0.0, 1.0, 0.0),
-        vec4<f32>(pos + pos_snap, 0.0, 1.0)
+        vec4<f32>(pos - vec2<f32>(0.5, 0.5) + snap, 0.0, 1.0)
     );
 
     out.position = globals.transform * transform * vec4<f32>(vertex_position(input.vertex_index), 0.0, 1.0);
     out.color = premultiply(input.color);
     out.border_color = premultiply(input.border_color);
-    out.pos = input.pos * globals.scale + pos_snap;
+    out.pos = input.pos * globals.scale + snap;
-    out.scale = input.scale * globals.scale + scale_snap;
+    out.scale = input.scale * globals.scale;
     out.border_radius = border_radius * globals.scale;
     out.border_width = input.border_width * globals.scale;
     out.shadow_color = premultiply(input.shadow_color);

widget/src/image.rs

@@ -296,6 +296,7 @@ fn render<Renderer, Handle>(
             filter_method,
             rotation: rotation.radians(),
             opacity,
+            snap: true,
         },
         drawing_bounds,
     );

widget/src/image/viewer.rs

@@ -351,6 +351,7 @@ where
                         filter_method: self.filter_method,
                         rotation: Radians(0.0),
                         opacity: 1.0,
+                        snap: true,
                     },
                     drawing_bounds,
                 );

widget/src/toggler.rs

@@ -424,7 +424,7 @@ where
             .style(&self.class, self.last_status.unwrap_or(Status::Disabled));
 
         let border_radius = bounds.height / BORDER_RADIUS_RATIO;
-        let space = (SPACE_RATIO * bounds.height).round();
+        let space = SPACE_RATIO * bounds.height;
 
         let toggler_background_bounds = Rectangle {
             x: bounds.x + space,