Text2d shadows (#20463)

# Objective

Add support for shadows to `Text2d`.

Fixes #19529

## Solution
* New `Text2dShadow` component. 
`Text2dShadow` has identical fields to `bevy_ui`'s `TextShadow`. Only
the `Default` impl is different; since the y-axis is inverted for
`Text2d`, the default y-offset needs to be negative.

* `extract_text2d_sprite` now also draws shadow sprites when the
`Text2dShadow` component is present. Unlike in the `bevy_ui`
implementation, the shadows are extracted in the same system as the
glyph sprites to ensure correct ordering.

## Testing

Updated the `text2d` example to add some shadows to the text boxes:
```
cargo run --example text2d
```

## Showcase

<img width="1924" height="1127" alt="text-2d-shadows"
src="https://github.com/user-attachments/assets/ba3c0ae3-a962-4a62-9cee-ea7e328cd80c"
/>

Author: ickshonpe

crates/bevy_text/src/text2d.rs

@@ -9,7 +9,7 @@ use bevy_camera::primitives::Aabb;
 use bevy_camera::visibility::{
     self, NoFrustumCulling, ViewVisibility, Visibility, VisibilityClass,
 };
-use bevy_color::LinearRgba;
+use bevy_color::{Color, LinearRgba};
 use bevy_derive::{Deref, DerefMut};
 use bevy_ecs::entity::EntityHashSet;
 use bevy_ecs::{
@@ -132,6 +132,28 @@ pub type Text2dReader<'w, 's> = TextReader<'w, 's, Text2d>;
 /// 2d alias for [`TextWriter`].
 pub type Text2dWriter<'w, 's> = TextWriter<'w, 's, Text2d>;
 
+/// Adds a shadow behind `Text2d` text
+///
+/// Use `TextShadow` for text drawn with `bevy_ui`
+#[derive(Component, Copy, Clone, Debug, PartialEq, Reflect)]
+#[reflect(Component, Default, Debug, Clone, PartialEq)]
+pub struct Text2dShadow {
+    /// Shadow displacement
+    /// With a value of zero the shadow will be hidden directly behind the text
+    pub offset: Vec2,
+    /// Color of the shadow
+    pub color: Color,
+}
+
+impl Default for Text2dShadow {
+    fn default() -> Self {
+        Self {
+            offset: Vec2::new(4., -4.),
+            color: Color::BLACK,
+        }
+    }
+}
+
 /// This system extracts the sprites from the 2D text components and adds them to the
 /// "render world".
 pub fn extract_text2d_sprite(
@@ -148,6 +170,7 @@ pub fn extract_text2d_sprite(
             &TextLayoutInfo,
             &TextBounds,
             &Anchor,
+            Option<&Text2dShadow>,
             &GlobalTransform,
         )>,
     >,
@@ -170,6 +193,7 @@ pub fn extract_text2d_sprite(
         text_layout_info,
         text_bounds,
         anchor,
+        maybe_shadow,
         global_transform,
     ) in text2d_query.iter()
     {
@@ -183,9 +207,60 @@ pub fn extract_text2d_sprite(
         );
 
         let top_left = (Anchor::TOP_LEFT.0 - anchor.as_vec()) * size;
+
+        if let Some(shadow) = maybe_shadow {
+            let shadow_transform = *global_transform
+                * GlobalTransform::from_translation((top_left + shadow.offset).extend(0.))
+                * scaling;
+            let color = shadow.color.into();
+
+            for (
+                i,
+                PositionedGlyph {
+                    position,
+                    atlas_info,
+                    ..
+                },
+            ) in text_layout_info.glyphs.iter().enumerate()
+            {
+                let rect = texture_atlases
+                    .get(atlas_info.texture_atlas)
+                    .unwrap()
+                    .textures[atlas_info.location.glyph_index]
+                    .as_rect();
+                extracted_slices.slices.push(ExtractedSlice {
+                    offset: Vec2::new(position.x, -position.y),
+                    rect,
+                    size: rect.size(),
+                });
+
+                if text_layout_info
+                    .glyphs
+                    .get(i + 1)
+                    .is_none_or(|info| info.atlas_info.texture != atlas_info.texture)
+                {
+                    let render_entity = commands.spawn(TemporaryRenderEntity).id();
+                    extracted_sprites.sprites.push(ExtractedSprite {
+                        main_entity,
+                        render_entity,
+                        transform: shadow_transform,
+                        color,
+                        image_handle_id: atlas_info.texture,
+                        flip_x: false,
+                        flip_y: false,
+                        kind: bevy_sprite::ExtractedSpriteKind::Slices {
+                            indices: start..end,
+                        },
+                    });
+                    start = end;
+                }
+
+                end += 1;
+            }
+        }
+
         let transform =
             *global_transform * GlobalTransform::from_translation(top_left.extend(0.)) * scaling;
-
         let mut color = LinearRgba::WHITE;
         let mut current_span = usize::MAX;
 

crates/bevy_ui/src/widget/text.rs

@@ -130,7 +130,7 @@ impl From<String> for Text {
 
 /// Adds a shadow behind text
 ///
-/// Not supported by `Text2d`
+/// Use the `Text2dShadow` component for `Text2d` shadows
 #[derive(Component, Copy, Clone, Debug, PartialEq, Reflect)]
 #[reflect(Component, Default, Debug, Clone, PartialEq)]
 pub struct TextShadow {

examples/2d/text2d.rs

@@ -10,7 +10,7 @@ use bevy::{
     math::ops,
     prelude::*,
     sprite::Anchor,
-    text::{FontSmoothing, LineBreak, TextBounds},
+    text::{FontSmoothing, LineBreak, Text2dShadow, TextBounds},
 };
 
 fn main() {
@@ -47,13 +47,15 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
         Text2d::new("translation"),
         text_font.clone(),
         TextLayout::new_with_justify(text_justification),
+        Text2dShadow::default(),
         AnimateTranslation,
     ));
     // Demonstrate changing rotation
     commands.spawn((
         Text2d::new("rotation"),
         text_font.clone(),
         TextLayout::new_with_justify(text_justification),
+        Text2dShadow::default(),
         AnimateRotation,
     ));
     // Demonstrate changing scale
@@ -62,6 +64,7 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
         text_font,
         TextLayout::new_with_justify(text_justification),
         Transform::from_translation(Vec3::new(400.0, 0.0, 0.0)),
+        Text2dShadow::default(),
         AnimateScale,
     ));
     // Demonstrate text wrapping
@@ -72,6 +75,8 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
     };
     let box_size = Vec2::new(300.0, 200.0);
     let box_position = Vec2::new(0.0, -250.0);
+    let box_color = Color::srgb(0.25, 0.25, 0.55);
+    let text_shadow_color = box_color.darker(0.05);
     commands.spawn((
         Sprite::from_color(Color::srgb(0.25, 0.25, 0.55), box_size),
         Transform::from_translation(box_position.extend(0.0)),
@@ -83,6 +88,11 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
             TextBounds::from(box_size),
             // Ensure the text is drawn on top of the box
             Transform::from_translation(Vec3::Z),
+            // Add a shadow to the text
+            Text2dShadow {
+                color: text_shadow_color,
+                ..default()
+            },
         )],
     ));
 
@@ -99,6 +109,11 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
             TextBounds::from(other_box_size),
             // Ensure the text is drawn on top of the box
             Transform::from_translation(Vec3::Z),
+            // Add a shadow to the text
+            Text2dShadow {
+                color: text_shadow_color,
+                ..default()
+            }
         )],
     ));
 
@@ -110,6 +125,8 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
             .with_font_smoothing(FontSmoothing::None),
         TextLayout::new_with_justify(Justify::Center),
         Transform::from_translation(Vec3::new(-400.0, -250.0, 0.0)),
+        // Add a black shadow to the text
+        Text2dShadow::default(),
     ));
 
     commands

release-content/release-notes/text2d_shadows.md

@@ -0,0 +1,7 @@
+---
+title: Text2d Shadows
+authors: ["@Ickshonpe"]
+pull_requests: [20463]
+---
+
+`Text2d` now supports shadows. Add the `Text2dShadow` component to a `Text2d` entity to draw a shadow beneath its text.