Introduce dynamic opacity support for Image and Svg

wgpu/src/image/mod.rs

@@ -137,16 +137,18 @@ impl Pipeline {
                             0 => Float32x2,
                             // Center
                             1 => Float32x2,
-                            // Image size
+                            // Scale
                             2 => Float32x2,
                             // Rotation
                             3 => Float32,
+                            // Opacity
+                            4 => Float32,
                             // Atlas position
-                            4 => Float32x2,
-                            // Atlas scale
                             5 => Float32x2,
+                            // Atlas scale
+                            6 => Float32x2,
                             // Layer
-                            6 => Sint32,
+                            7 => Sint32,
                         ),
                     }],
                 },
@@ -229,6 +231,7 @@ impl Pipeline {
                     filter_method,
                     bounds,
                     rotation,
+                    opacity,
                 } => {
                     if let Some(atlas_entry) =
                         cache.upload_raster(device, encoder, handle)
@@ -237,6 +240,7 @@ impl Pipeline {
                             [bounds.x, bounds.y],
                             [bounds.width, bounds.height],
                             f32::from(*rotation),
+                            *opacity,
                             atlas_entry,
                             match filter_method {
                                 crate::core::image::FilterMethod::Nearest => {
@@ -258,6 +262,7 @@ impl Pipeline {
                     color,
                     bounds,
                     rotation,
+                    opacity,
                 } => {
                     let size = [bounds.width, bounds.height];
 
@@ -268,6 +273,7 @@ impl Pipeline {
                             [bounds.x, bounds.y],
                             size,
                             f32::from(*rotation),
+                            *opacity,
                             atlas_entry,
                             nearest_instances,
                         );
@@ -498,6 +504,7 @@ struct Instance {
     _center: [f32; 2],
     _size: [f32; 2],
     _rotation: f32,
+    _opacity: f32,
     _position_in_atlas: [f32; 2],
     _size_in_atlas: [f32; 2],
     _layer: u32,
@@ -517,6 +524,7 @@ fn add_instances(
     image_position: [f32; 2],
     image_size: [f32; 2],
     rotation: f32,
+    opacity: f32,
     entry: &atlas::Entry,
     instances: &mut Vec<Instance>,
 ) {
@@ -532,6 +540,7 @@ fn add_instances(
                 center,
                 image_size,
                 rotation,
+                opacity,
                 allocation,
                 instances,
             );
@@ -561,7 +570,8 @@ fn add_instances(
                 ];
 
                 add_instance(
-                    position, center, size, rotation, allocation, instances,
+                    position, center, size, rotation, opacity, allocation,
+                    instances,
                 );
             }
         }
@@ -574,6 +584,7 @@ fn add_instance(
     center: [f32; 2],
     size: [f32; 2],
     rotation: f32,
+    opacity: f32,
     allocation: &atlas::Allocation,
     instances: &mut Vec<Instance>,
 ) {
@@ -586,6 +597,7 @@ fn add_instance(
         _center: center,
         _size: size,
         _rotation: rotation,
+        _opacity: opacity,
         _position_in_atlas: [
             (x as f32 + 0.5) / atlas::SIZE as f32,
             (y as f32 + 0.5) / atlas::SIZE as f32,

wgpu/src/layer.rs

@@ -119,12 +119,14 @@ impl Layer {
         bounds: Rectangle,
         transformation: Transformation,
         rotation: Radians,
+        opacity: f32,
     ) {
         let image = Image::Raster {
             handle,
             filter_method,
             bounds: bounds * transformation,
             rotation,
+            opacity,
         };
 
         self.images.push(image);
@@ -137,12 +139,14 @@ impl Layer {
         bounds: Rectangle,
         transformation: Transformation,
         rotation: Radians,
+        opacity: f32,
     ) {
         let svg = Image::Vector {
             handle,
             color,
             bounds: bounds * transformation,
             rotation,
+            opacity,
         };
 
         self.images.push(svg);

wgpu/src/lib.rs

@@ -518,6 +518,7 @@ impl core::image::Renderer for Renderer {
         filter_method: core::image::FilterMethod,
         bounds: Rectangle,
         rotation: core::Radians,
+        opacity: f32,
     ) {
         let (layer, transformation) = self.layers.current_mut();
         layer.draw_image(
@@ -526,6 +527,7 @@ impl core::image::Renderer for Renderer {
             bounds,
             transformation,
             rotation,
+            opacity,
         );
     }
 }
@@ -542,9 +544,17 @@ impl core::svg::Renderer for Renderer {
         color_filter: Option<Color>,
         bounds: Rectangle,
         rotation: core::Radians,
+        opacity: f32,
     ) {
         let (layer, transformation) = self.layers.current_mut();
-        layer.draw_svg(handle, color_filter, bounds, transformation, rotation);
+        layer.draw_svg(
+            handle,
+            color_filter,
+            bounds,
+            transformation,
+            rotation,
+            opacity,
+        );
     }
 }
 

wgpu/src/shader/image.wgsl

@@ -12,15 +12,17 @@ struct VertexInput {
     @location(1) center: vec2<f32>,
     @location(2) scale: vec2<f32>,
     @location(3) rotation: f32,
-    @location(4) atlas_pos: vec2<f32>,
-    @location(5) atlas_scale: vec2<f32>,
-    @location(6) layer: i32,
+    @location(4) opacity: f32,
+    @location(5) atlas_pos: vec2<f32>,
+    @location(6) atlas_scale: vec2<f32>,
+    @location(7) layer: i32,
 }
 
 struct VertexOutput {
     @builtin(position) position: vec4<f32>,
     @location(0) uv: vec2<f32>,
     @location(1) layer: f32, // this should be an i32, but naga currently reads that as requiring interpolation.
+    @location(2) opacity: f32,
 }
 
 @vertex
@@ -33,6 +35,7 @@ fn vs_main(input: VertexInput) -> VertexOutput {
     // Map the vertex position to the atlas texture.
     out.uv = vec2<f32>(v_pos * input.atlas_scale + input.atlas_pos);
     out.layer = f32(input.layer);
+    out.opacity = input.opacity;
 
     // Calculate the vertex position and move the center to the origin
     v_pos = input.pos + v_pos * input.scale - input.center;
@@ -56,5 +59,5 @@ fn vs_main(input: VertexInput) -> VertexOutput {
 @fragment
 fn fs_main(input: VertexOutput) -> @location(0) vec4<f32> {
     // Sample the texture at the given UV coordinate and layer.
-    return textureSample(u_texture, u_sampler, input.uv, i32(input.layer));
+    return textureSample(u_texture, u_sampler, input.uv, i32(input.layer)) * vec4<f32>(1.0, 1.0, 1.0, input.opacity);
 }