Add material_tilemap_layout

[st0rmbtw]

Fixes #455

Note that you must set the group index of a uniform to 3, like this:

@group(3) @binding(0)
var<uniform> test: f32

It's not obvious and there are no docs about that

[rparrett]

Maybe we should add a field to the material in the custom_shader example.

[st0rmbtw]

@rparrett Done

[rparrett]

Could you run cargo fmt?

[st0rmbtw]

@rparrett Maybe add a way to control the brightness?

[st0rmbtw]

@rparrett Yeah, sure

[rparrett]

I think as long as we're giving working code to users we don't need to go nuts in this PR.

[rparrett]

The example now errors in webgl2 builds. This diff fixes it.

diff --git a/examples/custom_shader.rs b/examples/custom_shader.rs
index f279ebe..361cb80 100644
--- a/examples/custom_shader.rs
+++ b/examples/custom_shader.rs
@@ -10,7 +10,10 @@ mod helpers;
 #[uuid = "31575692-a956-4762-98e2-5d457f552d0a"]
 pub struct MyMaterial {
     #[uniform(0)]
-    brightness: f32
+    brightness: f32,
+    // webgl2 requires 16 byte alignment
+    #[uniform(0)]
+    _padding: Vec3,
 }
 
 impl MaterialTilemap for MyMaterial {
@@ -27,7 +30,8 @@ fn startup(
     commands.spawn(Camera2dBundle::default());
 
     let my_material_handle = materials.add(MyMaterial {
-        brightness: 0.5
+        brightness: 0.5,
+        ..default()
     });
 
     let texture_handle: Handle<Image> = asset_server.load("tiles.png");

[rparrett]

Oops sorry, the shader needs to be updated too:

diff --git a/assets/custom_shader.wgsl b/assets/custom_shader.wgsl
index 7eb4ece..bbf11f9 100644
--- a/assets/custom_shader.wgsl
+++ b/assets/custom_shader.wgsl
@@ -2,8 +2,13 @@
 #import bevy_ecs_tilemap::vertex_output MeshVertexOutput
 #import bevy_sprite::mesh2d_view_bindings globals
 
+struct MyMaterial {
+    brightness: f32,
+    _padding: vec3<f32>
+};
+
 @group(3) @binding(0)
-var<uniform> brightness: f32;
+var<uniform> material: MyMaterial;
 
 fn hsv2rgb(c: vec3<f32>) -> vec3<f32>
 {
@@ -17,5 +22,5 @@ fn fragment(in: MeshVertexOutput) -> @location(0) vec4<f32> {
     let color = process_fragment(in);
     
     let hsv = vec3(abs(sin(globals.time)), 1.0, 1.0);
-    return vec4((color.rgb + hsv2rgb(hsv)) * brightness, color.a);
+    return vec4((color.rgb + hsv2rgb(hsv)) * material.brightness, color.a);
 }

[rparrett]

Thanks!