image_node/image_node.rs
1//! This example illustrates the basic usage of [`ImageNode`],
2//! a UI node that renders an image.
3
4use bevy::prelude::*;
5
6fn main() {
7 App::new()
8 .add_plugins(DefaultPlugins)
9 .add_systems(Startup, setup)
10 .run();
11}
12
13fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
14 // Ui camera
15 commands.spawn(Camera2d);
16
17 commands.spawn((
18 // This root Node serves as a container for the ImageNode.
19 // In this case, it will center the item on the screen.
20 Node {
21 width: percent(100),
22 height: percent(100),
23 align_items: AlignItems::Center,
24 justify_content: JustifyContent::Center,
25 ..default()
26 },
27 // Child Nodes are added with the `children!` macro.
28 children![(
29 // Create a new `ImageNode` with the given texture.
30 ImageNode::new(asset_server.load("branding/icon.png")),
31 // Child Node control `ImageNode` size
32 Node {
33 border: px(5.).all(),
34 padding: px(10.).all(),
35 width: px(256.),
36 height: px(256.),
37 ..default()
38 },
39 BorderColor::all(Color::WHITE),
40 )],
41 ));
42}