bevy/examples/2d
Félix Lescaudey de Maneville 01139b3472
Sprite slicing and tiling (#10588)
> Replaces #5213

# Objective

Implement sprite tiling and [9 slice
scaling](https://en.wikipedia.org/wiki/9-slice_scaling) for
`bevy_sprite`.
Allowing slice scaling and texture tiling.

Basic scaling vs 9 slice scaling:


![Traditional_scaling_vs_9-slice_scaling](https://user-images.githubusercontent.com/26703856/177335801-27f6fa27-c569-4ce6-b0e6-4f54e8f4e80a.svg)

Slicing example:

<img width="481" alt="Screenshot 2022-07-05 at 15 05 49"
src="https://user-images.githubusercontent.com/26703856/177336112-9e961af0-c0af-4197-aec9-430c1170a79d.png">

Tiling example:

<img width="1329" alt="Screenshot 2023-11-16 at 13 53 32"
src="https://github.com/bevyengine/bevy/assets/26703856/14db39b7-d9e0-4bc3-ba0e-b1f2db39ae8f">

# Solution

- `SpriteBundlue` now has a `scale_mode` component storing a
`SpriteScaleMode` enum with three variants:
  - `Stretched` (default) 
  - `Tiled` to have sprites tile horizontally and/or vertically
- `Sliced` allowing 9 slicing the texture and optionally tile some
sections with a `Textureslicer`.
- `bevy_sprite` has two extra systems to compute a
`ComputedTextureSlices` if necessary,:
- One system react to changes on `Sprite`, `Handle<Image>` or
`SpriteScaleMode`
- The other listens to `AssetEvent<Image>` to compute slices on sprites
when the texture is ready or changed
- I updated the `bevy_sprite` extraction stage to extract potentially
multiple textures instead of one, depending on the presence of
`ComputedTextureSlices`
- I added two examples showcasing the slicing and tiling feature.

The addition of `ComputedTextureSlices` as a cache is to avoid querying
the image data, to retrieve its dimensions, every frame in a extract or
prepare stage. Also it reacts to changes so we can have stuff like this
(tiling example):


https://github.com/bevyengine/bevy/assets/26703856/a349a9f3-33c3-471f-8ef4-a0e5dfce3b01

# Related 

- [ ] Once #5103 or #10099 is merged I can enable tiling and slicing for
texture sheets as ui

# To discuss

There is an other option, to consider slice/tiling as part of the asset,
using the new asset preprocessing but I have no clue on how to do it.

Also, instead of retrieving the Image dimensions, we could use the same
system as the sprite sheet and have the user give the image dimensions
directly (grid). But I think it's less user friendly

---------

Co-authored-by: Alice Cecile <alice.i.cecile@gmail.com>
Co-authored-by: ickshonpe <david.curthoys@googlemail.com>
Co-authored-by: Alice Cecile <alice.i.cecil@gmail.com>
2024-01-15 15:40:06 +00:00
..
2d_gizmos.rs Update winit dependency to 0.29 (#10702) 2023-12-21 07:40:47 +00:00
2d_shapes.rs Fix missed explicit conversions in examples (#11261) 2024-01-09 00:44:24 +00:00
2d_viewport_to_world.rs Add example for Camera::viewport_to_world (#7179) 2023-09-11 18:52:11 +00:00
bloom_2d.rs Fix missed explicit conversions in examples (#11261) 2024-01-09 00:44:24 +00:00
custom_gltf_vertex_attribute.rs Reorder impl to be the same as the trait (#11076) 2023-12-24 17:43:55 +00:00
mesh2d.rs Fix missed explicit conversions in examples (#11261) 2024-01-09 00:44:24 +00:00
mesh2d_manual.rs Unload render assets from RAM (#10520) 2024-01-03 03:31:04 +00:00
mesh2d_vertex_color_texture.rs Fix missed explicit conversions in examples (#11261) 2024-01-09 00:44:24 +00:00
move_sprite.rs Schedule-First: the new and improved add_systems (#8079) 2023-03-18 01:45:34 +00:00
pixel_grid_snap.rs Fix missed explicit conversions in examples (#11261) 2024-01-09 00:44:24 +00:00
rotation.rs Update winit dependency to 0.29 (#10702) 2023-12-21 07:40:47 +00:00
sprite.rs Update color and naming for consistency (#10367) 2023-11-04 02:09:23 +00:00
sprite_flipping.rs Update color and naming for consistency (#10367) 2023-11-04 02:09:23 +00:00
sprite_sheet.rs Schedule-First: the new and improved add_systems (#8079) 2023-03-18 01:45:34 +00:00
sprite_slice.rs Sprite slicing and tiling (#10588) 2024-01-15 15:40:06 +00:00
sprite_tile.rs Sprite slicing and tiling (#10588) 2024-01-15 15:40:06 +00:00
text2d.rs Rename TextAlignment to JustifyText. (#10854) 2023-12-05 03:00:41 +00:00
texture_atlas.rs Add insert_state to App. (#11043) 2023-12-21 14:09:24 +00:00
transparency_2d.rs Schedule-First: the new and improved add_systems (#8079) 2023-03-18 01:45:34 +00:00