me/iced
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Switched to packing using f16s to maintain acceptable precision.

Browse source
This commit is contained in:
Bingus 2023-06-07 10:47:57 -07:00
parent 9554c78f3a
commit 677f564f08
No known key found for this signature in database
GPG key ID: 5F84D2AA40A9F170
7 changed files with 160 additions and 148 deletions
Download patch file Download diff file Expand all files Collapse all files

31
core/src/color.rs
View file

@ -120,37 +120,6 @@ impl Color {
] ]
} }
/// Converts the [`Color`] into a `u32` value containing its RGBA8 components.
pub fn into_u32(self) -> u32 {
let [r, g, b, a] = self.into_rgba8();
let r = (r as u32) << 24;
let g = (g as u32) << 16;
let b = (b as u32) << 8;
let a = a as u32;
r | g | b | a
}
/// Converts the [`Color`] into a `u32` value containing its linear RGBA8 components.
pub fn into_linear_u32(self) -> u32 {
let [r, g, b, a] = self.into_linear();
let [r, g, b, a] = [
(r * 255.0).round() as u8,
(g * 255.0).round() as u8,
(b * 255.0).round() as u8,
(a * 255.0).round() as u8,
];
let r = (r as u32) << 24;
let g = (g as u32) << 16;
let b = (b as u32) << 8;
let a = a as u32;
r | g | b | a
}
/// Inverts the [`Color`] in-place. /// Inverts the [`Color`] in-place.
pub fn invert(&mut self) { pub fn invert(&mut self) {
self.r = 1.0f32 - self.r; self.r = 1.0f32 - self.r;

1
graphics/Cargo.toml
View file

@ -18,6 +18,7 @@ web-colors = []
[dependencies] [dependencies]
glam = "0.24" glam = "0.24"
half = "2.2.1"
log = "0.4" log = "0.4"
raw-window-handle = "0.5" raw-window-handle = "0.5"
thiserror = "1.0" thiserror = "1.0"

76
graphics/src/gradient.rs
View file

@ -7,6 +7,7 @@ use crate::color;
use crate::core::gradient::ColorStop; use crate::core::gradient::ColorStop;
use crate::core::{self, Color, Point, Rectangle}; use crate::core::{self, Color, Point, Rectangle};
use half::f16;
use std::cmp::Ordering; use std::cmp::Ordering;
#[derive(Debug, Clone, PartialEq)] #[derive(Debug, Clone, PartialEq)]
@ -99,24 +100,30 @@ impl Linear {
/// Packs the [`Gradient`] for use in shader code. /// Packs the [`Gradient`] for use in shader code.
pub fn pack(&self) -> Packed { pub fn pack(&self) -> Packed {
let mut colors = [0u32; 8]; let mut colors = [[0u32; 2]; 8];
let mut offsets = [0.0f32; 8]; let mut offsets = [f16::from(0u8); 8];
for (index, stop) in self.stops.iter().enumerate() { for (index, stop) in self.stops.iter().enumerate() {
let (color, offset) = let [r, g, b, a] =
stop.map_or((Color::default(), 2.0), |s| (s.color, s.offset)); color::pack(stop.map_or(Color::default(), |s| s.color))
.components();
if color::GAMMA_CORRECTION { colors[index] = [
//correct colors, convert to linear before uploading to GPU pack_f16s([f16::from_f32(r), f16::from_f32(g)]),
colors[index] = color.into_linear_u32(); pack_f16s([f16::from_f32(b), f16::from_f32(a)]),
} else { ];
//web colors, don't convert to linear before uploading to GPU
colors[index] = color.into_u32();
}
offsets[index] = offset; offsets[index] =
stop.map_or(f16::from_f32(2.0), |s| f16::from_f32(s.offset));
} }
let offsets = [
pack_f16s([offsets[0], offsets[1]]),
pack_f16s([offsets[2], offsets[3]]),
pack_f16s([offsets[4], offsets[5]]),
pack_f16s([offsets[6], offsets[7]]),
];
let direction = [self.start.x, self.start.y, self.end.x, self.end.y]; let direction = [self.start.x, self.start.y, self.end.x, self.end.y];
Packed { Packed {
@ -131,9 +138,10 @@ impl Linear {
#[derive(Debug, Copy, Clone, PartialEq)] #[derive(Debug, Copy, Clone, PartialEq)]
#[repr(C)] #[repr(C)]
pub struct Packed { pub struct Packed {
// 8 colors, each packed into a u32 // 8 colors, each channel = 16 bit float, 2 colors packed into 1 u32
colors: [u32; 8], colors: [[u32; 2]; 8],
offsets: [f32; 8], // 8 offsets, 8x 16 bit floats packed into 4 u32s
offsets: [u32; 4],
direction: [f32; 4], direction: [f32; 4],
} }
@ -141,24 +149,30 @@ pub struct Packed {
pub fn pack(gradient: &core::Gradient, bounds: Rectangle) -> Packed { pub fn pack(gradient: &core::Gradient, bounds: Rectangle) -> Packed {
match gradient { match gradient {
core::Gradient::Linear(linear) => { core::Gradient::Linear(linear) => {
let mut colors = [0u32; 8]; let mut colors = [[0u32; 2]; 8];
let mut offsets = [0.0f32; 8]; let mut offsets = [f16::from(0u8); 8];
for (index, stop) in linear.stops.iter().enumerate() { for (index, stop) in linear.stops.iter().enumerate() {
let (color, offset) = stop let [r, g, b, a] =
.map_or((Color::default(), 2.0), |s| (s.color, s.offset)); color::pack(stop.map_or(Color::default(), |s| s.color))
.components();
if color::GAMMA_CORRECTION { colors[index] = [
//correct colors, convert to linear before uploading to GPU pack_f16s([f16::from_f32(r), f16::from_f32(g)]),
colors[index] = color.into_linear_u32(); pack_f16s([f16::from_f32(b), f16::from_f32(a)]),
} else { ];
//web colors, don't convert to linear before uploading to GPU
colors[index] = color.into_u32();
}
offsets[index] = offset; offsets[index] = stop
.map_or(f16::from_f32(2.0), |s| f16::from_f32(s.offset));
} }
let offsets = [
pack_f16s([offsets[0], offsets[1]]),
pack_f16s([offsets[2], offsets[3]]),
pack_f16s([offsets[4], offsets[5]]),
pack_f16s([offsets[6], offsets[7]]),
];
let (start, end) = linear.angle.to_distance(&bounds); let (start, end) = linear.angle.to_distance(&bounds);
let direction = [start.x, start.y, end.x, end.y]; let direction = [start.x, start.y, end.x, end.y];
@ -171,3 +185,11 @@ pub fn pack(gradient: &core::Gradient, bounds: Rectangle) -> Packed {
} }
} }
} }
/// Packs two f16s into one u32.
fn pack_f16s(f: [f16; 2]) -> u32 {
let one = (f[0].to_bits() as u32) << 16;
let two = f[1].to_bits() as u32;
one | two
}

24
wgpu/src/quad/gradient.rs
View file

@ -96,24 +96,26 @@ impl Pipeline {
as u64, as u64,
step_mode: wgpu::VertexStepMode::Instance, step_mode: wgpu::VertexStepMode::Instance,
attributes: &wgpu::vertex_attr_array!( attributes: &wgpu::vertex_attr_array!(
// Colors 1-4 // Colors 1-2
1 => Uint32x4, 1 => Uint32x4,
// Colors 5-8 // Colors 3-4
2 => Uint32x4, 2 => Uint32x4,
// Offsets 1-4 // Colors 5-6
3 => Float32x4, 3 => Uint32x4,
// Offsets 5-8 // Colors 7-8
4 => Float32x4, 4 => Uint32x4,
// Offsets 1-8
5 => Uint32x4,
// Direction // Direction
5 => Float32x4,
// Position & Scale
6 => Float32x4, 6 => Float32x4,
// Border color // Position & Scale
7 => Float32x4, 7 => Float32x4,
// Border radius // Border color
8 => Float32x4, 8 => Float32x4,
// Border radius
9 => Float32x4,
// Border width // Border width
9 => Float32 10 => Float32
), ),
}, },
], ],

77
wgpu/src/shader/quad.wgsl
View file

@ -38,10 +38,11 @@ fn select_border_radius(radi: vec4<f32>, position: vec2<f32>, center: vec2<f32>)
return rx; return rx;
} }
fn unpack_u32(color: u32) -> vec4<f32> { fn unpack_u32(color: vec2<u32>) -> vec4<f32> {
let u = unpack4x8unorm(color); let rg: vec2<f32> = unpack2x16float(color.x);
let ba: vec2<f32> = unpack2x16float(color.y);
return vec4<f32>(u.w, u.z, u.y, u.x); return vec4<f32>(rg.y, rg.x, ba.y, ba.x);
} }
struct SolidVertexInput { struct SolidVertexInput {
@ -148,26 +149,28 @@ struct GradientVertexInput {
@location(0) v_pos: vec2<f32>, @location(0) v_pos: vec2<f32>,
@location(1) colors_1: vec4<u32>, @location(1) colors_1: vec4<u32>,
@location(2) colors_2: vec4<u32>, @location(2) colors_2: vec4<u32>,
@location(3) offsets_1: vec4<f32>, @location(3) colors_3: vec4<u32>,
@location(4) offsets_2: vec4<f32>, @location(4) colors_4: vec4<u32>,
@location(5) direction: vec4<f32>, @location(5) offsets: vec4<u32>,
@location(6) position_and_scale: vec4<f32>, @location(6) direction: vec4<f32>,
@location(7) border_color: vec4<f32>, @location(7) position_and_scale: vec4<f32>,
@location(8) border_radius: vec4<f32>, @location(8) border_color: vec4<f32>,
@location(9) border_width: f32, @location(9) border_radius: vec4<f32>,
@location(10) border_width: f32,
} }
struct GradientVertexOutput { struct GradientVertexOutput {
@builtin(position) position: vec4<f32>, @builtin(position) position: vec4<f32>,
@location(1) colors_1: vec4<u32>, @location(1) colors_1: vec4<u32>,
@location(2) colors_2: vec4<u32>, @location(2) colors_2: vec4<u32>,
@location(3) offsets_1: vec4<f32>, @location(3) colors_3: vec4<u32>,
@location(4) offsets_2: vec4<f32>, @location(4) colors_4: vec4<u32>,
@location(5) direction: vec4<f32>, @location(5) offsets: vec4<u32>,
@location(6) position_and_scale: vec4<f32>, @location(6) direction: vec4<f32>,
@location(7) border_color: vec4<f32>, @location(7) position_and_scale: vec4<f32>,
@location(8) border_radius: vec4<f32>, @location(8) border_color: vec4<f32>,
@location(9) border_width: f32, @location(9) border_radius: vec4<f32>,
@location(10) border_width: f32,
} }
@vertex @vertex
@ -195,8 +198,9 @@ fn gradient_vs_main(input: GradientVertexInput) -> GradientVertexOutput {
out.position = globals.transform * transform * vec4<f32>(input.v_pos, 0.0, 1.0); out.position = globals.transform * transform * vec4<f32>(input.v_pos, 0.0, 1.0);
out.colors_1 = input.colors_1; out.colors_1 = input.colors_1;
out.colors_2 = input.colors_2; out.colors_2 = input.colors_2;
out.offsets_1 = input.offsets_1; out.colors_3 = input.colors_3;
out.offsets_2 = input.offsets_2; out.colors_4 = input.colors_4;
out.offsets = input.offsets;
out.direction = input.direction * globals.scale; out.direction = input.direction * globals.scale;
out.position_and_scale = vec4<f32>(pos, scale); out.position_and_scale = vec4<f32>(pos, scale);
out.border_color = input.border_color; out.border_color = input.border_color;
@ -262,25 +266,28 @@ fn gradient(
@fragment @fragment
fn gradient_fs_main(input: GradientVertexOutput) -> @location(0) vec4<f32> { fn gradient_fs_main(input: GradientVertexOutput) -> @location(0) vec4<f32> {
let colors = array<vec4<f32>, 8>( let colors = array<vec4<f32>, 8>(
unpack_u32(input.colors_1.x), unpack_u32(input.colors_1.xy),
unpack_u32(input.colors_1.y), unpack_u32(input.colors_1.zw),
unpack_u32(input.colors_1.z), unpack_u32(input.colors_2.xy),
unpack_u32(input.colors_1.w), unpack_u32(input.colors_2.zw),
unpack_u32(input.colors_2.x), unpack_u32(input.colors_3.xy),
unpack_u32(input.colors_2.y), unpack_u32(input.colors_3.zw),
unpack_u32(input.colors_2.z), unpack_u32(input.colors_4.xy),
unpack_u32(input.colors_2.w), unpack_u32(input.colors_4.zw),
); );
let offsets_1: vec4<f32> = unpack_u32(input.offsets.xy);
let offsets_2: vec4<f32> = unpack_u32(input.offsets.zw);
var offsets = array<f32, 8>( var offsets = array<f32, 8>(
input.offsets_1.x, offsets_1.x,
input.offsets_1.y, offsets_1.y,
input.offsets_1.z, offsets_1.z,
input.offsets_1.w, offsets_1.w,
input.offsets_2.x, offsets_2.x,
input.offsets_2.y, offsets_2.y,
input.offsets_2.z, offsets_2.z,
input.offsets_2.w, offsets_2.w,
); );
//TODO could just pass this in to the shader but is probably more performant to just check it here //TODO could just pass this in to the shader but is probably more performant to just check it here

83
wgpu/src/shader/triangle.wgsl
View file

@ -4,10 +4,11 @@ struct Globals {
@group(0) @binding(0) var<uniform> globals: Globals; @group(0) @binding(0) var<uniform> globals: Globals;
fn unpack_u32(color: u32) -> vec4<f32> { fn unpack_u32(color: vec2<u32>) -> vec4<f32> {
let u = unpack4x8unorm(color); let rg: vec2<f32> = unpack2x16float(color.x);
let ba: vec2<f32> = unpack2x16float(color.y);
return vec4<f32>(u.w, u.z, u.y, u.x); return vec4<f32>(rg.y, rg.x, ba.y, ba.x);
} }
struct SolidVertexInput { struct SolidVertexInput {
@ -35,34 +36,39 @@ fn solid_fs_main(input: SolidVertexOutput) -> @location(0) vec4<f32> {
return input.color; return input.color;
} }
struct GradientVertexInput {
@location(0) v_pos: vec2<f32>,
@location(1) colors_1: vec4<u32>,
@location(2) colors_2: vec4<u32>,
@location(3) colors_3: vec4<u32>,
@location(4) colors_4: vec4<u32>,
@location(5) offsets: vec4<u32>,
@location(6) direction: vec4<f32>,
}
struct GradientVertexOutput { struct GradientVertexOutput {
@builtin(position) position: vec4<f32>, @builtin(position) position: vec4<f32>,
@location(0) raw_position: vec2<f32>, @location(0) raw_position: vec2<f32>,
@location(1) colors_1: vec4<u32>, @location(1) colors_1: vec4<u32>,
@location(2) colors_2: vec4<u32>, @location(2) colors_2: vec4<u32>,
@location(3) offsets_1: vec4<f32>, @location(3) colors_3: vec4<u32>,
@location(4) offsets_2: vec4<f32>, @location(4) colors_4: vec4<u32>,
@location(5) direction: vec4<f32>, @location(5) offsets: vec4<u32>,
@location(6) direction: vec4<f32>,
} }
@vertex @vertex
fn gradient_vs_main( fn gradient_vs_main(input: GradientVertexInput) -> GradientVertexOutput {
@location(0) input: vec2<f32>,
@location(1) colors_1: vec4<u32>,
@location(2) colors_2: vec4<u32>,
@location(3) offsets_1: vec4<f32>,
@location(4) offsets_2: vec4<f32>,
@location(5) direction: vec4<f32>,
) -> GradientVertexOutput {
var output: GradientVertexOutput; var output: GradientVertexOutput;
output.position = globals.transform * vec4<f32>(input.xy, 0.0, 1.0); output.position = globals.transform * vec4<f32>(input.v_pos, 0.0, 1.0);
output.raw_position = input; output.raw_position = input.v_pos;
output.colors_1 = colors_1; output.colors_1 = input.colors_1;
output.colors_2 = colors_2; output.colors_2 = input.colors_2;
output.offsets_1 = offsets_1; output.colors_3 = input.colors_3;
output.offsets_2 = offsets_2; output.colors_4 = input.colors_4;
output.direction = direction; output.offsets = input.offsets;
output.direction = input.direction;
return output; return output;
} }
@ -123,25 +129,28 @@ fn gradient(
@fragment @fragment
fn gradient_fs_main(input: GradientVertexOutput) -> @location(0) vec4<f32> { fn gradient_fs_main(input: GradientVertexOutput) -> @location(0) vec4<f32> {
let colors = array<vec4<f32>, 8>( let colors = array<vec4<f32>, 8>(
unpack_u32(input.colors_1.x), unpack_u32(input.colors_1.xy),
unpack_u32(input.colors_1.y), unpack_u32(input.colors_1.zw),
unpack_u32(input.colors_1.z), unpack_u32(input.colors_2.xy),
unpack_u32(input.colors_1.w), unpack_u32(input.colors_2.zw),
unpack_u32(input.colors_2.x), unpack_u32(input.colors_3.xy),
unpack_u32(input.colors_2.y), unpack_u32(input.colors_3.zw),
unpack_u32(input.colors_2.z), unpack_u32(input.colors_4.xy),
unpack_u32(input.colors_2.w), unpack_u32(input.colors_4.zw),
); );
let offsets_1: vec4<f32> = unpack_u32(input.offsets.xy);
let offsets_2: vec4<f32> = unpack_u32(input.offsets.zw);
var offsets = array<f32, 8>( var offsets = array<f32, 8>(
input.offsets_1.x, offsets_1.x,
input.offsets_1.y, offsets_1.y,
input.offsets_1.z, offsets_1.z,
input.offsets_1.w, offsets_1.w,
input.offsets_2.x, offsets_2.x,
input.offsets_2.y, offsets_2.y,
input.offsets_2.z, offsets_2.z,
input.offsets_2.w, offsets_2.w,
); );
var last_index = 7; var last_index = 7;

16
wgpu/src/triangle.rs
View file

@ -652,16 +652,18 @@ mod gradient {
attributes: &wgpu::vertex_attr_array!( attributes: &wgpu::vertex_attr_array!(
// Position // Position
0 => Float32x2, 0 => Float32x2,
// Colors 1-4 // Colors 1-2
1 => Uint32x4, 1 => Uint32x4,
// Colors 5-8, // Colors 3-4
2 => Uint32x4, 2 => Uint32x4,
// Offsets 1-4 // Colors 5-6
3 => Float32x4, 3 => Uint32x4,
// Offsets 5-8 // Colors 7-8
4 => Float32x4, 4 => Uint32x4,
// Offsets
5 => Uint32x4,
// Direction // Direction
5 => Float32x4 6 => Float32x4
), ),
}], }],
}, },