bevy/assets/textures
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
..
Game Icons add an example using UI & states to create a game menu (#2960) 2022-01-14 19:09:42 +00:00
parallax_example Add parallax mapping to bevy PBR (#5928) 2023-04-15 10:25:14 +00:00
rpg example: add rpg assets for use in examples (maybe pair this down in the future) 2020-06-05 17:26:41 -07:00
simplespace Simple 2d rotation example (#3065) 2022-01-25 22:10:11 +00:00
array_texture.png Extend the Texture asset type to support 3D data (#903) 2020-11-22 12:04:47 -08:00
Ryfjallet_cubemap.png Support array / cubemap / cubemap array textures in KTX2 (#5325) 2022-07-30 07:02:58 +00:00
Ryfjallet_cubemap_astc4x4.ktx2 Support array / cubemap / cubemap array textures in KTX2 (#5325) 2022-07-30 07:02:58 +00:00
Ryfjallet_cubemap_bc7.ktx2 Support array / cubemap / cubemap array textures in KTX2 (#5325) 2022-07-30 07:02:58 +00:00
Ryfjallet_cubemap_etc2.ktx2 Support array / cubemap / cubemap array textures in KTX2 (#5325) 2022-07-30 07:02:58 +00:00
Ryfjallet_cubemap_readme.txt Support array / cubemap / cubemap array textures in KTX2 (#5325) 2022-07-30 07:02:58 +00:00
slice_square.png Sprite slicing and tiling (#10588) 2024-01-15 15:40:06 +00:00
slice_square_2.png Sprite slicing and tiling (#10588) 2024-01-15 15:40:06 +00:00
spiaggia_di_mondello_1k.hdr add HDR image loader 2020-07-27 11:37:45 +02:00