Added animation to UI
parent
616e252ae3
commit
0e4dae6215
GPG Key ID:
C6D63995FE72FD80
|
|
@ -18,11 +18,15 @@ struct VertexInput {
|
||||||
|
|
||||||
struct VertexOutput {
|
struct VertexOutput {
|
||||||
@builtin(position) position: vec4<f32>,
|
@builtin(position) position: vec4<f32>,
|
||||||
@location(0) texture_coords: vec2<f32>,
|
@location(0) tween: f32,
|
||||||
@location(1) texture_index: u32,
|
@location(1) texture_index_a: u32,
|
||||||
@location(2) mask_coords: vec2<f32>,
|
@location(2) texture_coords_a: vec2<f32>,
|
||||||
@location(3) mask_index: vec2<u32>,
|
@location(3) texture_index_b: u32,
|
||||||
@location(4) color_transform: vec4<f32>,
|
@location(4) texture_coords_b: vec2<f32>,
|
||||||
|
@location(5) color: vec4<f32>,
|
||||||
|
|
||||||
|
@location(6) mask_coords: vec2<f32>,
|
||||||
|
@location(7) mask_index: vec2<u32>,
|
||||||
}
|
}
|
||||||
|
|
||||||
@group(0) @binding(0)
|
@group(0) @binding(0)
|
||||||
|
|
@ -80,31 +84,67 @@ fn vertex_main(
|
||||||
vertex: VertexInput,
|
vertex: VertexInput,
|
||||||
instance: InstanceInput,
|
instance: InstanceInput,
|
||||||
) -> VertexOutput {
|
) -> VertexOutput {
|
||||||
|
var out: VertexOutput;
|
||||||
|
|
||||||
// TODO: this will break if we try to use texture 0.
|
// TODO: this will break if we try to use texture 0.
|
||||||
// implement animations for ui sprites & fix that here.
|
// implement animations for ui sprites & fix that here.
|
||||||
|
|
||||||
let pos = transform_vertex(
|
// Pick texture size by the size of the visible texture
|
||||||
instance,
|
// (texture index 0 is special, it's the "hidden" texture)
|
||||||
vertex.position,
|
if instance.texture_index.x == 0u && instance.texture_index.y == 0u {
|
||||||
instance.texture_index.x,
|
out.position = vec4<f32>(0.0, 0.0, 0.0, 1.0);
|
||||||
);
|
} else if instance.texture_index.x == 0u {
|
||||||
|
out.position = transform_vertex(
|
||||||
var out: VertexOutput;
|
instance,
|
||||||
out.position = pos;
|
vertex.position,
|
||||||
out.color_transform = instance.color_transform;
|
instance.texture_index.y,
|
||||||
|
);
|
||||||
|
} else if instance.texture_index.y == 0u {
|
||||||
// TODO: function to get texture from sprite
|
out.position = transform_vertex(
|
||||||
// Pick texture frame
|
instance,
|
||||||
let t = global_atlas[instance.texture_index.x];
|
vertex.position,
|
||||||
out.texture_index = u32(t.atlas_texture);
|
instance.texture_index.x,
|
||||||
out.texture_coords = vec2(t.xpos, t.ypos);
|
);
|
||||||
if vertex.texture_coords.x == 1.0 {
|
} else {
|
||||||
out.texture_coords = vec2(out.texture_coords.x + t.width, out.texture_coords.y);
|
out.position = transform_vertex(
|
||||||
|
instance,
|
||||||
|
vertex.position,
|
||||||
|
instance.texture_index.x,
|
||||||
|
);
|
||||||
}
|
}
|
||||||
if vertex.texture_coords.y == 1.0 {
|
|
||||||
out.texture_coords = vec2(out.texture_coords.x, out.texture_coords.y + t.height);
|
out.color = instance.color_transform;
|
||||||
|
out.tween = instance.texture_fade;
|
||||||
|
|
||||||
|
// Texture 0 is special, it's the empty texture
|
||||||
|
if instance.texture_index.x == 0u {
|
||||||
|
out.texture_index_a = 0u;
|
||||||
|
out.texture_coords_a = vec2(0.0, 0.0);
|
||||||
|
} else {
|
||||||
|
let t = global_atlas[instance.texture_index.x];
|
||||||
|
out.texture_index_a = t.atlas_texture;
|
||||||
|
out.texture_coords_a = vec2(t.xpos, t.ypos);
|
||||||
|
if vertex.texture_coords.x == 1.0 {
|
||||||
|
out.texture_coords_a = out.texture_coords_a + vec2(t.width, 0.0);
|
||||||
|
}
|
||||||
|
if vertex.texture_coords.y == 1.0 {
|
||||||
|
out.texture_coords_a = out.texture_coords_a + vec2(0.0, t.height);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if instance.texture_index.y == 0u {
|
||||||
|
out.texture_index_b = u32(0u);
|
||||||
|
out.texture_coords_b = vec2(0.0, 0.0);
|
||||||
|
} else {
|
||||||
|
let b = global_atlas[instance.texture_index.y];
|
||||||
|
out.texture_index_b = u32(b.atlas_texture);
|
||||||
|
out.texture_coords_b = vec2(b.xpos, b.ypos);
|
||||||
|
if vertex.texture_coords.x == 1.0 {
|
||||||
|
out.texture_coords_b = out.texture_coords_b + vec2(b.width, 0.0);
|
||||||
|
}
|
||||||
|
if vertex.texture_coords.y == 1.0 {
|
||||||
|
out.texture_coords_b = out.texture_coords_b + vec2(0.0, b.height);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Pick mask image if mask is enabled
|
// Pick mask image if mask is enabled
|
||||||
|
|
@ -142,12 +182,40 @@ fn fragment_main(in: VertexOutput) -> @location(0) vec4<f32> {
|
||||||
).a;
|
).a;
|
||||||
}
|
}
|
||||||
|
|
||||||
var color: vec4<f32> = textureSampleLevel(
|
var texture_a: vec4<f32> = vec4(0.0, 0.0, 0.0, 0.0);
|
||||||
texture_array[in.texture_index],
|
if !(
|
||||||
sampler_array[0],
|
(in.texture_index_a == 0u) &&
|
||||||
in.texture_coords,
|
(in.texture_coords_a.x == 0.0) &&
|
||||||
0.0
|
(in.texture_coords_a.y == 0.0)
|
||||||
).rgba * in.color_transform;
|
) {
|
||||||
|
texture_a = textureSampleLevel(
|
||||||
|
texture_array[in.texture_index_a],
|
||||||
|
sampler_array[0],
|
||||||
|
in.texture_coords_a,
|
||||||
|
0.0
|
||||||
|
).rgba;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
var texture_b: vec4<f32> = vec4(0.0, 0.0, 0.0, 0.0);
|
||||||
|
if !(
|
||||||
|
(in.texture_index_b == 0u) &&
|
||||||
|
(in.texture_coords_b.x == 0.0) &&
|
||||||
|
(in.texture_coords_b.y == 0.0)
|
||||||
|
) {
|
||||||
|
texture_b = textureSampleLevel(
|
||||||
|
texture_array[in.texture_index_b],
|
||||||
|
sampler_array[0],
|
||||||
|
in.texture_coords_b,
|
||||||
|
0.0
|
||||||
|
).rgba;
|
||||||
|
}
|
||||||
|
|
||||||
|
var color: vec4<f32> = mix(
|
||||||
|
texture_a,
|
||||||
|
texture_b,
|
||||||
|
in.tween
|
||||||
|
) * in.color;
|
||||||
|
|
||||||
// Apply mask and discard fully transparent pixels
|
// Apply mask and discard fully transparent pixels
|
||||||
color = vec4(color.rgb, color.a *mask);
|
color = vec4(color.rgb, color.a *mask);
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue