pub struct GridTrack { /* private fields */ }Expand description
A GridTrack is a Row or Column of a CSS Grid. This struct specifies what size the track should be.
See below for the different “track sizing functions” you can specify.
Implementations§
Source§impl GridTrack
impl GridTrack
pub const DEFAULT: GridTrack
Sourcepub fn px<T>(value: f32) -> T
pub fn px<T>(value: f32) -> T
Create a grid track with a fixed pixel size
Examples found in repository?
examples/testbed/ui.rs (line 823)
811 pub fn setup(mut commands: Commands) {
812 commands.spawn((Camera2d, DespawnOnExit(super::Scene::Grid)));
813 // Top-level grid (app frame)
814 commands.spawn((
815 Node {
816 display: Display::Grid,
817 width: percent(100),
818 height: percent(100),
819 grid_template_columns: vec![GridTrack::min_content(), GridTrack::flex(1.0)],
820 grid_template_rows: vec![
821 GridTrack::auto(),
822 GridTrack::flex(1.0),
823 GridTrack::px(40.),
824 ],
825 ..default()
826 },
827 BackgroundColor(Color::WHITE),
828 DespawnOnExit(super::Scene::Grid),
829 children![
830 // Header
831 (
832 Node {
833 display: Display::Grid,
834 grid_column: GridPlacement::span(2),
835 padding: UiRect::all(px(40)),
836 ..default()
837 },
838 BackgroundColor(RED.into()),
839 ),
840 // Main content grid (auto placed in row 2, column 1)
841 (
842 Node {
843 height: percent(100),
844 aspect_ratio: Some(1.0),
845 display: Display::Grid,
846 grid_template_columns: RepeatedGridTrack::flex(3, 1.0),
847 grid_template_rows: RepeatedGridTrack::flex(2, 1.0),
848 row_gap: px(12),
849 column_gap: px(12),
850 ..default()
851 },
852 BackgroundColor(Color::srgb(0.25, 0.25, 0.25)),
853 children![
854 (Node::default(), BackgroundColor(ORANGE.into())),
855 (Node::default(), BackgroundColor(BISQUE.into())),
856 (Node::default(), BackgroundColor(BLUE.into())),
857 (Node::default(), BackgroundColor(CRIMSON.into())),
858 (Node::default(), BackgroundColor(AQUA.into())),
859 ]
860 ),
861 // Right side bar (auto placed in row 2, column 2)
862 (Node::DEFAULT, BackgroundColor(BLACK.into())),
863 ],
864 ));
865 }More examples
examples/ui/layout/grid.rs (line 42)
18fn spawn_layout(mut commands: Commands, asset_server: Res<AssetServer>) {
19 let font = asset_server.load("fonts/FiraSans-Bold.ttf");
20 commands.spawn(Camera2d);
21
22 // Top-level grid (app frame)
23 commands
24 .spawn((
25 Node {
26 // Use the CSS Grid algorithm for laying out this node
27 display: Display::Grid,
28 // Make node fill the entirety of its parent (in this case the window)
29 width: percent(100),
30 height: percent(100),
31 // Set the grid to have 2 columns with sizes [min-content, minmax(0, 1fr)]
32 // - The first column will size to the size of its contents
33 // - The second column will take up the remaining available space
34 grid_template_columns: vec![GridTrack::min_content(), GridTrack::flex(1.0)],
35 // Set the grid to have 3 rows with sizes [auto, minmax(0, 1fr), 20px]
36 // - The first row will size to the size of its contents
37 // - The second row take up remaining available space (after rows 1 and 3 have both been sized)
38 // - The third row will be exactly 20px high
39 grid_template_rows: vec![
40 GridTrack::auto(),
41 GridTrack::flex(1.0),
42 GridTrack::px(20.),
43 ],
44 ..default()
45 },
46 BackgroundColor(Color::WHITE),
47 ))
48 .with_children(|builder| {
49 // Header
50 builder
51 .spawn(
52 Node {
53 display: Display::Grid,
54 // Make this node span two grid columns so that it takes up the entire top tow
55 grid_column: GridPlacement::span(2),
56 padding: UiRect::all(px(6)),
57 ..default()
58 },
59 )
60 .with_children(|builder| {
61 spawn_nested_text_bundle(builder, font.clone(), "Bevy CSS Grid Layout Example");
62 });
63
64 // Main content grid (auto placed in row 2, column 1)
65 builder
66 .spawn((
67 Node {
68 // Make the height of the node fill its parent
69 height: percent(100),
70 // Make the grid have a 1:1 aspect ratio meaning it will scale as an exact square
71 // As the height is set explicitly, this means the width will adjust to match the height
72 aspect_ratio: Some(1.0),
73 // Use grid layout for this node
74 display: Display::Grid,
75 // Add 24px of padding around the grid
76 padding: UiRect::all(px(24)),
77 // Set the grid to have 4 columns all with sizes minmax(0, 1fr)
78 // This creates 4 exactly evenly sized columns
79 grid_template_columns: RepeatedGridTrack::flex(4, 1.0),
80 // Set the grid to have 4 rows all with sizes minmax(0, 1fr)
81 // This creates 4 exactly evenly sized rows
82 grid_template_rows: RepeatedGridTrack::flex(4, 1.0),
83 // Set a 12px gap/gutter between rows and columns
84 row_gap: px(12),
85 column_gap: px(12),
86 ..default()
87 },
88 BackgroundColor(Color::srgb(0.25, 0.25, 0.25)),
89 ))
90 .with_children(|builder| {
91 // Note there is no need to specify the position for each grid item. Grid items that are
92 // not given an explicit position will be automatically positioned into the next available
93 // grid cell. The order in which this is performed can be controlled using the grid_auto_flow
94 // style property.
95
96 item_rect(builder, ORANGE);
97 item_rect(builder, BISQUE);
98 item_rect(builder, BLUE);
99 item_rect(builder, CRIMSON);
100 item_rect(builder, AQUA);
101 item_rect(builder, ORANGE_RED);
102 item_rect(builder, DARK_GREEN);
103 item_rect(builder, FUCHSIA);
104 item_rect(builder, TEAL);
105 item_rect(builder, ALICE_BLUE);
106 item_rect(builder, CRIMSON);
107 item_rect(builder, ANTIQUE_WHITE);
108 item_rect(builder, YELLOW);
109 item_rect(builder, DEEP_PINK);
110 item_rect(builder, YELLOW_GREEN);
111 item_rect(builder, SALMON);
112 });
113
114 // Right side bar (auto placed in row 2, column 2)
115 builder
116 .spawn((
117 Node {
118 display: Display::Grid,
119 // Align content towards the start (top) in the vertical axis
120 align_items: AlignItems::Start,
121 // Align content towards the center in the horizontal axis
122 justify_items: JustifyItems::Center,
123 // Add 10px padding
124 padding: UiRect::all(px(10)),
125 // Add an fr track to take up all the available space at the bottom of the column so that the text nodes
126 // can be top-aligned. Normally you'd use flexbox for this, but this is the CSS Grid example so we're using grid.
127 grid_template_rows: vec![GridTrack::auto(), GridTrack::auto(), GridTrack::fr(1.0)],
128 // Add a 10px gap between rows
129 row_gap: px(10),
130 ..default()
131 },
132 BackgroundColor(BLACK.into()),
133 ))
134 .with_children(|builder| {
135 builder.spawn((Text::new("Sidebar"),
136 TextFont::from(font.clone()),
137 ));
138 builder.spawn((Text::new("A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely."),
139 TextFont {
140 font: font.clone().into(),
141 font_size: FontSize::Px(13.0),
142 ..default()
143 },
144 ));
145 builder.spawn(Node::default());
146 });
147
148 // Footer / status bar
149 builder.spawn((
150 Node {
151 // Make this node span two grid column so that it takes up the entire bottom row
152 grid_column: GridPlacement::span(2),
153 ..default()
154 },
155 BackgroundColor(WHITE.into()),
156 ));
157
158 // Modal (absolutely positioned on top of content - currently hidden: to view it, change its visibility)
159 builder.spawn((
160 Node {
161 position_type: PositionType::Absolute,
162 margin: UiRect {
163 top: px(100),
164 bottom: auto(),
165 left: auto(),
166 right: auto(),
167 },
168 width: percent(60),
169 height: px(300),
170 max_width: px(600),
171 ..default()
172 },
173 Visibility::Hidden,
174 BackgroundColor(Color::WHITE.with_alpha(0.8)),
175 ));
176 });
177}Sourcepub fn fr<T>(value: f32) -> T
pub fn fr<T>(value: f32) -> T
Create a grid track with an fr size.
Note that this will give the track a content-based minimum size.
Usually you are best off using GridTrack::flex instead which uses a zero minimum size.
Examples found in repository?
examples/ui/layout/grid.rs (line 127)
18fn spawn_layout(mut commands: Commands, asset_server: Res<AssetServer>) {
19 let font = asset_server.load("fonts/FiraSans-Bold.ttf");
20 commands.spawn(Camera2d);
21
22 // Top-level grid (app frame)
23 commands
24 .spawn((
25 Node {
26 // Use the CSS Grid algorithm for laying out this node
27 display: Display::Grid,
28 // Make node fill the entirety of its parent (in this case the window)
29 width: percent(100),
30 height: percent(100),
31 // Set the grid to have 2 columns with sizes [min-content, minmax(0, 1fr)]
32 // - The first column will size to the size of its contents
33 // - The second column will take up the remaining available space
34 grid_template_columns: vec![GridTrack::min_content(), GridTrack::flex(1.0)],
35 // Set the grid to have 3 rows with sizes [auto, minmax(0, 1fr), 20px]
36 // - The first row will size to the size of its contents
37 // - The second row take up remaining available space (after rows 1 and 3 have both been sized)
38 // - The third row will be exactly 20px high
39 grid_template_rows: vec![
40 GridTrack::auto(),
41 GridTrack::flex(1.0),
42 GridTrack::px(20.),
43 ],
44 ..default()
45 },
46 BackgroundColor(Color::WHITE),
47 ))
48 .with_children(|builder| {
49 // Header
50 builder
51 .spawn(
52 Node {
53 display: Display::Grid,
54 // Make this node span two grid columns so that it takes up the entire top tow
55 grid_column: GridPlacement::span(2),
56 padding: UiRect::all(px(6)),
57 ..default()
58 },
59 )
60 .with_children(|builder| {
61 spawn_nested_text_bundle(builder, font.clone(), "Bevy CSS Grid Layout Example");
62 });
63
64 // Main content grid (auto placed in row 2, column 1)
65 builder
66 .spawn((
67 Node {
68 // Make the height of the node fill its parent
69 height: percent(100),
70 // Make the grid have a 1:1 aspect ratio meaning it will scale as an exact square
71 // As the height is set explicitly, this means the width will adjust to match the height
72 aspect_ratio: Some(1.0),
73 // Use grid layout for this node
74 display: Display::Grid,
75 // Add 24px of padding around the grid
76 padding: UiRect::all(px(24)),
77 // Set the grid to have 4 columns all with sizes minmax(0, 1fr)
78 // This creates 4 exactly evenly sized columns
79 grid_template_columns: RepeatedGridTrack::flex(4, 1.0),
80 // Set the grid to have 4 rows all with sizes minmax(0, 1fr)
81 // This creates 4 exactly evenly sized rows
82 grid_template_rows: RepeatedGridTrack::flex(4, 1.0),
83 // Set a 12px gap/gutter between rows and columns
84 row_gap: px(12),
85 column_gap: px(12),
86 ..default()
87 },
88 BackgroundColor(Color::srgb(0.25, 0.25, 0.25)),
89 ))
90 .with_children(|builder| {
91 // Note there is no need to specify the position for each grid item. Grid items that are
92 // not given an explicit position will be automatically positioned into the next available
93 // grid cell. The order in which this is performed can be controlled using the grid_auto_flow
94 // style property.
95
96 item_rect(builder, ORANGE);
97 item_rect(builder, BISQUE);
98 item_rect(builder, BLUE);
99 item_rect(builder, CRIMSON);
100 item_rect(builder, AQUA);
101 item_rect(builder, ORANGE_RED);
102 item_rect(builder, DARK_GREEN);
103 item_rect(builder, FUCHSIA);
104 item_rect(builder, TEAL);
105 item_rect(builder, ALICE_BLUE);
106 item_rect(builder, CRIMSON);
107 item_rect(builder, ANTIQUE_WHITE);
108 item_rect(builder, YELLOW);
109 item_rect(builder, DEEP_PINK);
110 item_rect(builder, YELLOW_GREEN);
111 item_rect(builder, SALMON);
112 });
113
114 // Right side bar (auto placed in row 2, column 2)
115 builder
116 .spawn((
117 Node {
118 display: Display::Grid,
119 // Align content towards the start (top) in the vertical axis
120 align_items: AlignItems::Start,
121 // Align content towards the center in the horizontal axis
122 justify_items: JustifyItems::Center,
123 // Add 10px padding
124 padding: UiRect::all(px(10)),
125 // Add an fr track to take up all the available space at the bottom of the column so that the text nodes
126 // can be top-aligned. Normally you'd use flexbox for this, but this is the CSS Grid example so we're using grid.
127 grid_template_rows: vec![GridTrack::auto(), GridTrack::auto(), GridTrack::fr(1.0)],
128 // Add a 10px gap between rows
129 row_gap: px(10),
130 ..default()
131 },
132 BackgroundColor(BLACK.into()),
133 ))
134 .with_children(|builder| {
135 builder.spawn((Text::new("Sidebar"),
136 TextFont::from(font.clone()),
137 ));
138 builder.spawn((Text::new("A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely."),
139 TextFont {
140 font: font.clone().into(),
141 font_size: FontSize::Px(13.0),
142 ..default()
143 },
144 ));
145 builder.spawn(Node::default());
146 });
147
148 // Footer / status bar
149 builder.spawn((
150 Node {
151 // Make this node span two grid column so that it takes up the entire bottom row
152 grid_column: GridPlacement::span(2),
153 ..default()
154 },
155 BackgroundColor(WHITE.into()),
156 ));
157
158 // Modal (absolutely positioned on top of content - currently hidden: to view it, change its visibility)
159 builder.spawn((
160 Node {
161 position_type: PositionType::Absolute,
162 margin: UiRect {
163 top: px(100),
164 bottom: auto(),
165 left: auto(),
166 right: auto(),
167 },
168 width: percent(60),
169 height: px(300),
170 max_width: px(600),
171 ..default()
172 },
173 Visibility::Hidden,
174 BackgroundColor(Color::WHITE.with_alpha(0.8)),
175 ));
176 });
177}Sourcepub fn flex<T>(value: f32) -> T
pub fn flex<T>(value: f32) -> T
Create a grid track with a minmax(0, Nfr) size.
Examples found in repository?
examples/ui/text/system_fonts.rs (line 62)
16fn setup(mut commands: Commands, mut font_system: ResMut<FontCx>) {
17 let mut families: Vec<String> = font_system
18 .context
19 .collection
20 .family_names()
21 .map(ToOwned::to_owned)
22 .collect();
23 families.sort_unstable();
24 families.dedup();
25 let family_count = families.len();
26
27 commands.spawn(Camera2d);
28
29 commands
30 .spawn((
31 Node {
32 flex_direction: FlexDirection::Column,
33 width: percent(100),
34 height: percent(100),
35 align_items: AlignItems::Center,
36 row_gap: px(10.),
37 ..default()
38 },
39 BackgroundColor(Color::srgb(0.1, 0.1, 0.1)),
40 ))
41 .with_children(move |builder| {
42 builder.spawn(Text::new(format!(
43 "Total available fonts: {}",
44 family_count,
45 )));
46
47 builder
48 .spawn(Node {
49 flex_direction: FlexDirection::Column,
50 row_gap: px(6),
51 overflow: Overflow::scroll_y(),
52 align_items: AlignItems::Stretch,
53 ..default()
54 })
55 .with_children(|builder| {
56 for family in families {
57 let font = FontSource::Family(family.clone().into());
58 builder.spawn((
59 Node {
60 display: Display::Grid,
61 grid_template_columns: vec![
62 GridTrack::flex(1.),
63 GridTrack::flex(1.),
64 ],
65 padding: px(6).all(),
66 column_gap: px(50.),
67 ..default()
68 },
69 BackgroundColor(Color::srgb(0.2, 0.2, 0.25)),
70 children![
71 (
72 Text::new(&family),
73 TextFont { font, ..default() },
74 TextLayout::no_wrap()
75 ),
76 (Text::new(family), TextLayout::no_wrap()),
77 ],
78 ));
79 }
80 })
81 .observe(
82 |on_scroll: On<Pointer<Scroll>>,
83 mut query: Query<(&mut ScrollPosition, &ComputedNode)>| {
84 if let Ok((mut scroll_position, node)) = query.get_mut(on_scroll.entity) {
85 let dy = match on_scroll.unit {
86 MouseScrollUnit::Line => on_scroll.y * 20.,
87 MouseScrollUnit::Pixel => on_scroll.y,
88 };
89 let range = (node.content_size.y - node.size.y).max(0.)
90 * node.inverse_scale_factor;
91 scroll_position.y = (scroll_position.y - dy).clamp(0., range);
92 }
93 },
94 );
95 });
96}More examples
examples/ui/images/image_node_resizing.rs (line 77)
62fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
63 let image_handle = asset_server.load("branding/icon.png");
64 let full_text = format!(
65 "{}height : {}%, width : {}%",
66 TEXT_PREFIX, IMAGE_GROUP_BOX_INIT_HEIGHT, IMAGE_GROUP_BOX_INIT_WIDTH,
67 );
68
69 commands.spawn(Camera2d);
70
71 let container = commands
72 .spawn((
73 Node {
74 display: Display::Grid,
75 width: percent(100),
76 height: percent(100),
77 grid_template_rows: vec![GridTrack::min_content(), GridTrack::flex(1.0)],
78 ..default()
79 },
80 BackgroundColor(Color::WHITE),
81 ))
82 .id();
83
84 // Keyboard Text
85 commands
86 .spawn((
87 TextData {
88 height: IMAGE_GROUP_BOX_INIT_HEIGHT,
89 width: IMAGE_GROUP_BOX_INIT_WIDTH,
90 },
91 Text::new(full_text),
92 TextColor::BLACK,
93 Node {
94 grid_row: GridPlacement::span(1),
95 padding: px(6).all(),
96 ..default()
97 },
98 UiDebugOptions {
99 enabled: false,
100 ..default()
101 },
102 ChildOf(container),
103 ))
104 .observe(update_text);
105
106 commands
107 .spawn((
108 Node {
109 display: Display::Flex,
110 grid_row: GridPlacement::span(1),
111 flex_direction: FlexDirection::Column,
112 justify_content: JustifyContent::SpaceAround,
113 padding: px(10.).all(),
114 ..default()
115 },
116 BackgroundColor(Color::BLACK),
117 ChildOf(container),
118 ))
119 .with_children(|builder| {
120 // `NodeImageMode::Auto` will resize the image automatically by taking the size of the source image and applying any layout constraints.
121 builder
122 .spawn((
123 ImageGroup,
124 Node {
125 display: Display::Flex,
126 justify_content: JustifyContent::Start,
127 width: percent(IMAGE_GROUP_BOX_INIT_WIDTH),
128 height: percent(IMAGE_GROUP_BOX_INIT_HEIGHT),
129 ..default()
130 },
131 BackgroundColor(Color::from(tailwind::BLUE_100)),
132 ))
133 .with_children(|parent| {
134 for _ in 0..4 {
135 // child node will apply Flex layout
136 parent.spawn((
137 Node::default(),
138 ImageNode {
139 image: image_handle.clone(),
140 image_mode: NodeImageMode::Auto,
141 ..default()
142 },
143 ));
144 }
145 });
146 // `NodeImageMode::Stretch` will resize the image to match the size of the `Node` component
147 builder
148 .spawn((
149 ImageGroup,
150 Node {
151 display: Display::Flex,
152 justify_content: JustifyContent::Start,
153 width: percent(IMAGE_GROUP_BOX_INIT_WIDTH),
154 height: percent(IMAGE_GROUP_BOX_INIT_HEIGHT),
155 ..default()
156 },
157 BackgroundColor(Color::from(tailwind::BLUE_100)),
158 ))
159 .with_children(|parent| {
160 for width in [10., 20., 30., 40.] {
161 parent.spawn((
162 Node {
163 height: percent(100),
164 width: percent(width),
165 ..default()
166 },
167 ImageNode {
168 image: image_handle.clone(),
169 image_mode: NodeImageMode::Stretch,
170 ..default()
171 },
172 ));
173 }
174 });
175 });
176}examples/ui/layout/grid.rs (line 34)
18fn spawn_layout(mut commands: Commands, asset_server: Res<AssetServer>) {
19 let font = asset_server.load("fonts/FiraSans-Bold.ttf");
20 commands.spawn(Camera2d);
21
22 // Top-level grid (app frame)
23 commands
24 .spawn((
25 Node {
26 // Use the CSS Grid algorithm for laying out this node
27 display: Display::Grid,
28 // Make node fill the entirety of its parent (in this case the window)
29 width: percent(100),
30 height: percent(100),
31 // Set the grid to have 2 columns with sizes [min-content, minmax(0, 1fr)]
32 // - The first column will size to the size of its contents
33 // - The second column will take up the remaining available space
34 grid_template_columns: vec![GridTrack::min_content(), GridTrack::flex(1.0)],
35 // Set the grid to have 3 rows with sizes [auto, minmax(0, 1fr), 20px]
36 // - The first row will size to the size of its contents
37 // - The second row take up remaining available space (after rows 1 and 3 have both been sized)
38 // - The third row will be exactly 20px high
39 grid_template_rows: vec![
40 GridTrack::auto(),
41 GridTrack::flex(1.0),
42 GridTrack::px(20.),
43 ],
44 ..default()
45 },
46 BackgroundColor(Color::WHITE),
47 ))
48 .with_children(|builder| {
49 // Header
50 builder
51 .spawn(
52 Node {
53 display: Display::Grid,
54 // Make this node span two grid columns so that it takes up the entire top tow
55 grid_column: GridPlacement::span(2),
56 padding: UiRect::all(px(6)),
57 ..default()
58 },
59 )
60 .with_children(|builder| {
61 spawn_nested_text_bundle(builder, font.clone(), "Bevy CSS Grid Layout Example");
62 });
63
64 // Main content grid (auto placed in row 2, column 1)
65 builder
66 .spawn((
67 Node {
68 // Make the height of the node fill its parent
69 height: percent(100),
70 // Make the grid have a 1:1 aspect ratio meaning it will scale as an exact square
71 // As the height is set explicitly, this means the width will adjust to match the height
72 aspect_ratio: Some(1.0),
73 // Use grid layout for this node
74 display: Display::Grid,
75 // Add 24px of padding around the grid
76 padding: UiRect::all(px(24)),
77 // Set the grid to have 4 columns all with sizes minmax(0, 1fr)
78 // This creates 4 exactly evenly sized columns
79 grid_template_columns: RepeatedGridTrack::flex(4, 1.0),
80 // Set the grid to have 4 rows all with sizes minmax(0, 1fr)
81 // This creates 4 exactly evenly sized rows
82 grid_template_rows: RepeatedGridTrack::flex(4, 1.0),
83 // Set a 12px gap/gutter between rows and columns
84 row_gap: px(12),
85 column_gap: px(12),
86 ..default()
87 },
88 BackgroundColor(Color::srgb(0.25, 0.25, 0.25)),
89 ))
90 .with_children(|builder| {
91 // Note there is no need to specify the position for each grid item. Grid items that are
92 // not given an explicit position will be automatically positioned into the next available
93 // grid cell. The order in which this is performed can be controlled using the grid_auto_flow
94 // style property.
95
96 item_rect(builder, ORANGE);
97 item_rect(builder, BISQUE);
98 item_rect(builder, BLUE);
99 item_rect(builder, CRIMSON);
100 item_rect(builder, AQUA);
101 item_rect(builder, ORANGE_RED);
102 item_rect(builder, DARK_GREEN);
103 item_rect(builder, FUCHSIA);
104 item_rect(builder, TEAL);
105 item_rect(builder, ALICE_BLUE);
106 item_rect(builder, CRIMSON);
107 item_rect(builder, ANTIQUE_WHITE);
108 item_rect(builder, YELLOW);
109 item_rect(builder, DEEP_PINK);
110 item_rect(builder, YELLOW_GREEN);
111 item_rect(builder, SALMON);
112 });
113
114 // Right side bar (auto placed in row 2, column 2)
115 builder
116 .spawn((
117 Node {
118 display: Display::Grid,
119 // Align content towards the start (top) in the vertical axis
120 align_items: AlignItems::Start,
121 // Align content towards the center in the horizontal axis
122 justify_items: JustifyItems::Center,
123 // Add 10px padding
124 padding: UiRect::all(px(10)),
125 // Add an fr track to take up all the available space at the bottom of the column so that the text nodes
126 // can be top-aligned. Normally you'd use flexbox for this, but this is the CSS Grid example so we're using grid.
127 grid_template_rows: vec![GridTrack::auto(), GridTrack::auto(), GridTrack::fr(1.0)],
128 // Add a 10px gap between rows
129 row_gap: px(10),
130 ..default()
131 },
132 BackgroundColor(BLACK.into()),
133 ))
134 .with_children(|builder| {
135 builder.spawn((Text::new("Sidebar"),
136 TextFont::from(font.clone()),
137 ));
138 builder.spawn((Text::new("A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely."),
139 TextFont {
140 font: font.clone().into(),
141 font_size: FontSize::Px(13.0),
142 ..default()
143 },
144 ));
145 builder.spawn(Node::default());
146 });
147
148 // Footer / status bar
149 builder.spawn((
150 Node {
151 // Make this node span two grid column so that it takes up the entire bottom row
152 grid_column: GridPlacement::span(2),
153 ..default()
154 },
155 BackgroundColor(WHITE.into()),
156 ));
157
158 // Modal (absolutely positioned on top of content - currently hidden: to view it, change its visibility)
159 builder.spawn((
160 Node {
161 position_type: PositionType::Absolute,
162 margin: UiRect {
163 top: px(100),
164 bottom: auto(),
165 left: auto(),
166 right: auto(),
167 },
168 width: percent(60),
169 height: px(300),
170 max_width: px(600),
171 ..default()
172 },
173 Visibility::Hidden,
174 BackgroundColor(Color::WHITE.with_alpha(0.8)),
175 ));
176 });
177}examples/testbed/ui.rs (line 359)
336 pub fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
337 commands.spawn((Camera2d, DespawnOnExit(super::Scene::Text)));
338
339 let mut container = commands.spawn((
340 Node {
341 flex_direction: FlexDirection::Column,
342 ..default()
343 },
344 DespawnOnExit(super::Scene::Text),
345 ));
346
347 container.with_child((
348 Text::new("Hello World."),
349 TextFont {
350 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
351 font_size: FontSize::Px(200.),
352 ..default()
353 },
354 ));
355
356 container.with_children(|builder| {
357 let mut grid = builder.spawn(Node {
358 display: Display::Grid,
359 grid_template_columns: vec![GridTrack::flex(1.0), GridTrack::flex(1.0)],
360 padding: UiRect::horizontal(px(5.)),
361 ..default()
362 });
363
364 grid.with_children(|grid| {
365 for hinting in [FontHinting::Enabled, FontHinting::Disabled] {
366 let mut content = grid.spawn(Node {
367 flex_direction: FlexDirection::Column,
368 row_gap: px(5.),
369 ..default()
370 });
371
372 content.with_child((
373 Text::new(format!("FontHinting::{:?}", hinting)),
374 TextFont {
375 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
376 ..default()
377 },
378 hinting,
379 ));
380
381 content.with_child((
382 Text::new("white "),
383 TextFont {
384 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
385 ..default()
386 },
387 hinting,
388 children![
389 (TextSpan::new("red "), TextColor(RED.into()),),
390 (TextSpan::new("green "), TextColor(GREEN.into()),),
391 (TextSpan::new("blue "), TextColor(BLUE.into()),),
392 (
393 TextSpan::new("black"),
394 TextColor(Color::BLACK),
395 TextFont {
396 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
397 ..default()
398 },
399 TextBackgroundColor(Color::WHITE)
400 ),
401 ],
402 ));
403
404 content.with_child((
405 Text::new(""),
406 TextFont {
407 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
408 ..default()
409 },
410 hinting,
411 children![
412 (
413 TextSpan::new("white "),
414 TextFont {
415 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
416 ..default()
417 }
418 ),
419 (TextSpan::new("red "), TextColor(RED.into()),),
420 (TextSpan::new("green "), TextColor(GREEN.into()),),
421 (TextSpan::new("blue "), TextColor(BLUE.into()),),
422 (
423 TextSpan::new("black"),
424 TextColor(Color::BLACK),
425 TextFont {
426 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
427 ..default()
428 },
429 TextBackgroundColor(Color::WHITE)
430 ),
431 ],
432 ));
433
434 content.with_child((
435 Text::new(""),
436 TextFont {
437 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
438 ..default()
439 },
440 hinting,
441 children![
442 (TextSpan::new(""), TextColor(YELLOW.into()),),
443 TextSpan::new(""),
444 (
445 TextSpan::new("white "),
446 TextFont {
447 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
448 ..default()
449 }
450 ),
451 TextSpan::new(""),
452 (TextSpan::new("red "), TextColor(RED.into()),),
453 TextSpan::new(""),
454 TextSpan::new(""),
455 (TextSpan::new("green "), TextColor(GREEN.into()),),
456 (TextSpan::new(""), TextColor(YELLOW.into()),),
457 (TextSpan::new("blue "), TextColor(BLUE.into()),),
458 TextSpan::new(""),
459 (TextSpan::new(""), TextColor(YELLOW.into()),),
460 (
461 TextSpan::new("black"),
462 TextColor(Color::BLACK),
463 TextFont {
464 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
465 ..default()
466 },
467 TextBackgroundColor(Color::WHITE)
468 ),
469 TextSpan::new(""),
470 ],
471 ));
472
473 content.with_child((
474 hinting,
475 Text::new("FiraSans_"),
476 TextFont {
477 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
478 font_size: FontSize::Px(25.),
479 ..default()
480 },
481 children![
482 (
483 TextSpan::new("MonaSans_"),
484 TextFont {
485 font: asset_server
486 .load("fonts/MonaSans-VariableFont.ttf")
487 .into(),
488 font_size: FontSize::Px(25.),
489 ..default()
490 }
491 ),
492 (
493 TextSpan::new("EBGaramond_"),
494 TextFont {
495 font: asset_server
496 .load("fonts/EBGaramond12-Regular.otf")
497 .into(),
498 font_size: FontSize::Px(25.),
499 ..default()
500 },
501 ),
502 (
503 TextSpan::new("FiraMono"),
504 TextFont {
505 font: asset_server.load("fonts/FiraMono-Medium.ttf").into(),
506 font_size: FontSize::Px(25.),
507 ..default()
508 },
509 ),
510 ],
511 ));
512
513 content.with_child((
514 hinting,
515 Text::new("FiraSans "),
516 TextFont {
517 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
518 font_size: FontSize::Px(25.),
519 ..default()
520 },
521 children![
522 (
523 TextSpan::new("MonaSans "),
524 TextFont {
525 font: asset_server
526 .load("fonts/MonaSans-VariableFont.ttf")
527 .into(),
528 font_size: FontSize::Px(25.),
529 ..default()
530 }
531 ),
532 (
533 TextSpan::new("EBGaramond "),
534 TextFont {
535 font: asset_server
536 .load("fonts/EBGaramond12-Regular.otf")
537 .into(),
538 font_size: FontSize::Px(25.),
539 ..default()
540 },
541 ),
542 (
543 TextSpan::new("FiraMono"),
544 TextFont {
545 font: asset_server.load("fonts/FiraMono-Medium.ttf").into(),
546 font_size: FontSize::Px(25.),
547 ..default()
548 },
549 ),
550 ],
551 ));
552
553 content.with_child((
554 hinting,
555 Text::new("FiraSans "),
556 TextFont {
557 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
558 font_size: FontSize::Px(25.),
559 ..default()
560 },
561 children![
562 (
563 TextSpan::new("MonaSans_"),
564 TextFont {
565 font: asset_server
566 .load("fonts/MonaSans-VariableFont.ttf")
567 .into(),
568 font_size: FontSize::Px(25.),
569 ..default()
570 }
571 ),
572 (
573 TextSpan::new("EBGaramond "),
574 TextFont {
575 font: asset_server
576 .load("fonts/EBGaramond12-Regular.otf")
577 .into(),
578 font_size: FontSize::Px(25.),
579 ..default()
580 },
581 ),
582 (
583 TextSpan::new("FiraMono"),
584 TextFont {
585 font: asset_server.load("fonts/FiraMono-Medium.ttf").into(),
586 font_size: FontSize::Px(25.),
587 ..default()
588 },
589 ),
590 ],
591 ));
592
593 content.with_child((
594 hinting,
595 Text::new("FiraSans"),
596 TextFont {
597 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
598 font_size: FontSize::Px(25.),
599 ..default()
600 },
601 children![
602 TextSpan::new(" "),
603 (
604 TextSpan::new("MonaSans"),
605 TextFont {
606 font: asset_server
607 .load("fonts/MonaSans-VariableFont.ttf")
608 .into(),
609 font_size: FontSize::Px(25.),
610 ..default()
611 }
612 ),
613 TextSpan::new(" "),
614 (
615 TextSpan::new("EBGaramond"),
616 TextFont {
617 font: asset_server
618 .load("fonts/EBGaramond12-Regular.otf")
619 .into(),
620 font_size: FontSize::Px(25.),
621 ..default()
622 },
623 ),
624 TextSpan::new(" "),
625 (
626 TextSpan::new("FiraMono"),
627 TextFont {
628 font: asset_server.load("fonts/FiraMono-Medium.ttf").into(),
629 font_size: FontSize::Px(25.),
630 ..default()
631 },
632 ),
633 ],
634 ));
635
636 content.with_child((
637 hinting,
638 Text::new("Fira Sans_"),
639 TextFont {
640 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
641 font_size: FontSize::Px(25.),
642 ..default()
643 },
644 children![
645 (
646 TextSpan::new("Mona Sans_"),
647 TextFont {
648 font: asset_server
649 .load("fonts/MonaSans-VariableFont.ttf")
650 .into(),
651 font_size: FontSize::Px(25.),
652 ..default()
653 }
654 ),
655 (
656 TextSpan::new("EB Garamond_"),
657 TextFont {
658 font: asset_server
659 .load("fonts/EBGaramond12-Regular.otf")
660 .into(),
661 font_size: FontSize::Px(25.),
662 ..default()
663 },
664 ),
665 (
666 TextSpan::new("Fira Mono"),
667 TextFont {
668 font: asset_server.load("fonts/FiraMono-Medium.ttf").into(),
669 font_size: FontSize::Px(25.),
670 ..default()
671 },
672 ),
673 ],
674 ));
675
676 content.with_child((
677 hinting,
678 Text::new("FontWeight(100)_"),
679 TextFont {
680 font: "Mona Sans".into(),
681 font_size: FontSize::Px(25.),
682 weight: FontWeight(100),
683 ..default()
684 },
685 children![
686 (
687 TextSpan::new("FontWeight(500)_"),
688 TextFont {
689 font: "Mona Sans".into(),
690 font_size: FontSize::Px(25.),
691 weight: FontWeight(500),
692 ..default()
693 }
694 ),
695 (
696 TextSpan::new("FontWeight(900)"),
697 TextFont {
698 font: "Mona Sans".into(),
699 font_size: FontSize::Px(25.),
700 weight: FontWeight(900),
701 ..default()
702 },
703 ),
704 ],
705 ));
706
707 content.with_child((
708 hinting,
709 Text::new("FiraSans_"),
710 TextFont {
711 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
712 font_size: FontSize::Px(25.),
713 weight: FontWeight(900),
714 ..default()
715 },
716 children![
717 (
718 TextSpan::new("MonaSans_"),
719 TextFont {
720 font: asset_server
721 .load("fonts/MonaSans-VariableFont.ttf")
722 .into(),
723 font_size: FontSize::Px(25.),
724 weight: FontWeight(700),
725 ..default()
726 }
727 ),
728 (
729 TextSpan::new("EBGaramond_"),
730 TextFont {
731 font: asset_server
732 .load("fonts/EBGaramond12-Regular.otf")
733 .into(),
734 font_size: FontSize::Px(25.),
735 weight: FontWeight(500),
736 ..default()
737 },
738 ),
739 (
740 TextSpan::new("FiraMono"),
741 TextFont {
742 font: asset_server.load("fonts/FiraMono-Medium.ttf").into(),
743 font_size: FontSize::Px(25.),
744 weight: FontWeight(300),
745 ..default()
746 },
747 ),
748 ],
749 ));
750
751 content.with_child((
752 hinting,
753 Text::new("FiraSans\t"),
754 TextFont {
755 font: asset_server.load("fonts/FiraSans-Bold.ttf").into(),
756 font_size: FontSize::Px(25.),
757 ..default()
758 },
759 children![
760 (
761 TextSpan::new("MonaSans\t"),
762 TextFont {
763 font: asset_server
764 .load("fonts/MonaSans-VariableFont.ttf")
765 .into(),
766 font_size: FontSize::Px(25.),
767 ..default()
768 }
769 ),
770 (
771 TextSpan::new("EBGaramond\t"),
772 TextFont {
773 font: asset_server
774 .load("fonts/EBGaramond12-Regular.otf")
775 .into(),
776 font_size: FontSize::Px(25.),
777 ..default()
778 },
779 ),
780 (
781 TextSpan::new("FiraMono"),
782 TextFont {
783 font: asset_server.load("fonts/FiraMono-Medium.ttf").into(),
784 font_size: FontSize::Px(25.),
785 ..default()
786 },
787 ),
788 ],
789 ));
790
791 for font_smoothing in [FontSmoothing::AntiAliased, FontSmoothing::None] {
792 content.with_child((
793 Text::new(format!("FontSmoothing::{:?}", font_smoothing)),
794 TextFont {
795 font: asset_server.load("fonts/MonaSans-VariableFont.ttf").into(),
796 font_size: FontSize::Px(25.),
797 font_smoothing,
798 ..default()
799 },
800 ));
801 }
802 }
803 });
804 });
805 }
806}
807
808mod grid {
809 use bevy::{color::palettes::css::*, prelude::*};
810
811 pub fn setup(mut commands: Commands) {
812 commands.spawn((Camera2d, DespawnOnExit(super::Scene::Grid)));
813 // Top-level grid (app frame)
814 commands.spawn((
815 Node {
816 display: Display::Grid,
817 width: percent(100),
818 height: percent(100),
819 grid_template_columns: vec![GridTrack::min_content(), GridTrack::flex(1.0)],
820 grid_template_rows: vec![
821 GridTrack::auto(),
822 GridTrack::flex(1.0),
823 GridTrack::px(40.),
824 ],
825 ..default()
826 },
827 BackgroundColor(Color::WHITE),
828 DespawnOnExit(super::Scene::Grid),
829 children![
830 // Header
831 (
832 Node {
833 display: Display::Grid,
834 grid_column: GridPlacement::span(2),
835 padding: UiRect::all(px(40)),
836 ..default()
837 },
838 BackgroundColor(RED.into()),
839 ),
840 // Main content grid (auto placed in row 2, column 1)
841 (
842 Node {
843 height: percent(100),
844 aspect_ratio: Some(1.0),
845 display: Display::Grid,
846 grid_template_columns: RepeatedGridTrack::flex(3, 1.0),
847 grid_template_rows: RepeatedGridTrack::flex(2, 1.0),
848 row_gap: px(12),
849 column_gap: px(12),
850 ..default()
851 },
852 BackgroundColor(Color::srgb(0.25, 0.25, 0.25)),
853 children![
854 (Node::default(), BackgroundColor(ORANGE.into())),
855 (Node::default(), BackgroundColor(BISQUE.into())),
856 (Node::default(), BackgroundColor(BLUE.into())),
857 (Node::default(), BackgroundColor(CRIMSON.into())),
858 (Node::default(), BackgroundColor(AQUA.into())),
859 ]
860 ),
861 // Right side bar (auto placed in row 2, column 2)
862 (Node::DEFAULT, BackgroundColor(BLACK.into())),
863 ],
864 ));
865 }Sourcepub fn auto<T>() -> T
pub fn auto<T>() -> T
Create a grid track which is automatically sized to fit its contents.
Examples found in repository?
examples/testbed/ui.rs (line 821)
811 pub fn setup(mut commands: Commands) {
812 commands.spawn((Camera2d, DespawnOnExit(super::Scene::Grid)));
813 // Top-level grid (app frame)
814 commands.spawn((
815 Node {
816 display: Display::Grid,
817 width: percent(100),
818 height: percent(100),
819 grid_template_columns: vec![GridTrack::min_content(), GridTrack::flex(1.0)],
820 grid_template_rows: vec![
821 GridTrack::auto(),
822 GridTrack::flex(1.0),
823 GridTrack::px(40.),
824 ],
825 ..default()
826 },
827 BackgroundColor(Color::WHITE),
828 DespawnOnExit(super::Scene::Grid),
829 children![
830 // Header
831 (
832 Node {
833 display: Display::Grid,
834 grid_column: GridPlacement::span(2),
835 padding: UiRect::all(px(40)),
836 ..default()
837 },
838 BackgroundColor(RED.into()),
839 ),
840 // Main content grid (auto placed in row 2, column 1)
841 (
842 Node {
843 height: percent(100),
844 aspect_ratio: Some(1.0),
845 display: Display::Grid,
846 grid_template_columns: RepeatedGridTrack::flex(3, 1.0),
847 grid_template_rows: RepeatedGridTrack::flex(2, 1.0),
848 row_gap: px(12),
849 column_gap: px(12),
850 ..default()
851 },
852 BackgroundColor(Color::srgb(0.25, 0.25, 0.25)),
853 children![
854 (Node::default(), BackgroundColor(ORANGE.into())),
855 (Node::default(), BackgroundColor(BISQUE.into())),
856 (Node::default(), BackgroundColor(BLUE.into())),
857 (Node::default(), BackgroundColor(CRIMSON.into())),
858 (Node::default(), BackgroundColor(AQUA.into())),
859 ]
860 ),
861 // Right side bar (auto placed in row 2, column 2)
862 (Node::DEFAULT, BackgroundColor(BLACK.into())),
863 ],
864 ));
865 }More examples
examples/ui/layout/grid.rs (line 40)
18fn spawn_layout(mut commands: Commands, asset_server: Res<AssetServer>) {
19 let font = asset_server.load("fonts/FiraSans-Bold.ttf");
20 commands.spawn(Camera2d);
21
22 // Top-level grid (app frame)
23 commands
24 .spawn((
25 Node {
26 // Use the CSS Grid algorithm for laying out this node
27 display: Display::Grid,
28 // Make node fill the entirety of its parent (in this case the window)
29 width: percent(100),
30 height: percent(100),
31 // Set the grid to have 2 columns with sizes [min-content, minmax(0, 1fr)]
32 // - The first column will size to the size of its contents
33 // - The second column will take up the remaining available space
34 grid_template_columns: vec![GridTrack::min_content(), GridTrack::flex(1.0)],
35 // Set the grid to have 3 rows with sizes [auto, minmax(0, 1fr), 20px]
36 // - The first row will size to the size of its contents
37 // - The second row take up remaining available space (after rows 1 and 3 have both been sized)
38 // - The third row will be exactly 20px high
39 grid_template_rows: vec![
40 GridTrack::auto(),
41 GridTrack::flex(1.0),
42 GridTrack::px(20.),
43 ],
44 ..default()
45 },
46 BackgroundColor(Color::WHITE),
47 ))
48 .with_children(|builder| {
49 // Header
50 builder
51 .spawn(
52 Node {
53 display: Display::Grid,
54 // Make this node span two grid columns so that it takes up the entire top tow
55 grid_column: GridPlacement::span(2),
56 padding: UiRect::all(px(6)),
57 ..default()
58 },
59 )
60 .with_children(|builder| {
61 spawn_nested_text_bundle(builder, font.clone(), "Bevy CSS Grid Layout Example");
62 });
63
64 // Main content grid (auto placed in row 2, column 1)
65 builder
66 .spawn((
67 Node {
68 // Make the height of the node fill its parent
69 height: percent(100),
70 // Make the grid have a 1:1 aspect ratio meaning it will scale as an exact square
71 // As the height is set explicitly, this means the width will adjust to match the height
72 aspect_ratio: Some(1.0),
73 // Use grid layout for this node
74 display: Display::Grid,
75 // Add 24px of padding around the grid
76 padding: UiRect::all(px(24)),
77 // Set the grid to have 4 columns all with sizes minmax(0, 1fr)
78 // This creates 4 exactly evenly sized columns
79 grid_template_columns: RepeatedGridTrack::flex(4, 1.0),
80 // Set the grid to have 4 rows all with sizes minmax(0, 1fr)
81 // This creates 4 exactly evenly sized rows
82 grid_template_rows: RepeatedGridTrack::flex(4, 1.0),
83 // Set a 12px gap/gutter between rows and columns
84 row_gap: px(12),
85 column_gap: px(12),
86 ..default()
87 },
88 BackgroundColor(Color::srgb(0.25, 0.25, 0.25)),
89 ))
90 .with_children(|builder| {
91 // Note there is no need to specify the position for each grid item. Grid items that are
92 // not given an explicit position will be automatically positioned into the next available
93 // grid cell. The order in which this is performed can be controlled using the grid_auto_flow
94 // style property.
95
96 item_rect(builder, ORANGE);
97 item_rect(builder, BISQUE);
98 item_rect(builder, BLUE);
99 item_rect(builder, CRIMSON);
100 item_rect(builder, AQUA);
101 item_rect(builder, ORANGE_RED);
102 item_rect(builder, DARK_GREEN);
103 item_rect(builder, FUCHSIA);
104 item_rect(builder, TEAL);
105 item_rect(builder, ALICE_BLUE);
106 item_rect(builder, CRIMSON);
107 item_rect(builder, ANTIQUE_WHITE);
108 item_rect(builder, YELLOW);
109 item_rect(builder, DEEP_PINK);
110 item_rect(builder, YELLOW_GREEN);
111 item_rect(builder, SALMON);
112 });
113
114 // Right side bar (auto placed in row 2, column 2)
115 builder
116 .spawn((
117 Node {
118 display: Display::Grid,
119 // Align content towards the start (top) in the vertical axis
120 align_items: AlignItems::Start,
121 // Align content towards the center in the horizontal axis
122 justify_items: JustifyItems::Center,
123 // Add 10px padding
124 padding: UiRect::all(px(10)),
125 // Add an fr track to take up all the available space at the bottom of the column so that the text nodes
126 // can be top-aligned. Normally you'd use flexbox for this, but this is the CSS Grid example so we're using grid.
127 grid_template_rows: vec![GridTrack::auto(), GridTrack::auto(), GridTrack::fr(1.0)],
128 // Add a 10px gap between rows
129 row_gap: px(10),
130 ..default()
131 },
132 BackgroundColor(BLACK.into()),
133 ))
134 .with_children(|builder| {
135 builder.spawn((Text::new("Sidebar"),
136 TextFont::from(font.clone()),
137 ));
138 builder.spawn((Text::new("A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely."),
139 TextFont {
140 font: font.clone().into(),
141 font_size: FontSize::Px(13.0),
142 ..default()
143 },
144 ));
145 builder.spawn(Node::default());
146 });
147
148 // Footer / status bar
149 builder.spawn((
150 Node {
151 // Make this node span two grid column so that it takes up the entire bottom row
152 grid_column: GridPlacement::span(2),
153 ..default()
154 },
155 BackgroundColor(WHITE.into()),
156 ));
157
158 // Modal (absolutely positioned on top of content - currently hidden: to view it, change its visibility)
159 builder.spawn((
160 Node {
161 position_type: PositionType::Absolute,
162 margin: UiRect {
163 top: px(100),
164 bottom: auto(),
165 left: auto(),
166 right: auto(),
167 },
168 width: percent(60),
169 height: px(300),
170 max_width: px(600),
171 ..default()
172 },
173 Visibility::Hidden,
174 BackgroundColor(Color::WHITE.with_alpha(0.8)),
175 ));
176 });
177}Sourcepub fn min_content<T>() -> T
pub fn min_content<T>() -> T
Create a grid track which is automatically sized to fit its contents when sized at their “min-content” sizes
Examples found in repository?
examples/testbed/ui.rs (line 819)
811 pub fn setup(mut commands: Commands) {
812 commands.spawn((Camera2d, DespawnOnExit(super::Scene::Grid)));
813 // Top-level grid (app frame)
814 commands.spawn((
815 Node {
816 display: Display::Grid,
817 width: percent(100),
818 height: percent(100),
819 grid_template_columns: vec![GridTrack::min_content(), GridTrack::flex(1.0)],
820 grid_template_rows: vec![
821 GridTrack::auto(),
822 GridTrack::flex(1.0),
823 GridTrack::px(40.),
824 ],
825 ..default()
826 },
827 BackgroundColor(Color::WHITE),
828 DespawnOnExit(super::Scene::Grid),
829 children![
830 // Header
831 (
832 Node {
833 display: Display::Grid,
834 grid_column: GridPlacement::span(2),
835 padding: UiRect::all(px(40)),
836 ..default()
837 },
838 BackgroundColor(RED.into()),
839 ),
840 // Main content grid (auto placed in row 2, column 1)
841 (
842 Node {
843 height: percent(100),
844 aspect_ratio: Some(1.0),
845 display: Display::Grid,
846 grid_template_columns: RepeatedGridTrack::flex(3, 1.0),
847 grid_template_rows: RepeatedGridTrack::flex(2, 1.0),
848 row_gap: px(12),
849 column_gap: px(12),
850 ..default()
851 },
852 BackgroundColor(Color::srgb(0.25, 0.25, 0.25)),
853 children![
854 (Node::default(), BackgroundColor(ORANGE.into())),
855 (Node::default(), BackgroundColor(BISQUE.into())),
856 (Node::default(), BackgroundColor(BLUE.into())),
857 (Node::default(), BackgroundColor(CRIMSON.into())),
858 (Node::default(), BackgroundColor(AQUA.into())),
859 ]
860 ),
861 // Right side bar (auto placed in row 2, column 2)
862 (Node::DEFAULT, BackgroundColor(BLACK.into())),
863 ],
864 ));
865 }More examples
examples/ui/images/image_node_resizing.rs (line 77)
62fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
63 let image_handle = asset_server.load("branding/icon.png");
64 let full_text = format!(
65 "{}height : {}%, width : {}%",
66 TEXT_PREFIX, IMAGE_GROUP_BOX_INIT_HEIGHT, IMAGE_GROUP_BOX_INIT_WIDTH,
67 );
68
69 commands.spawn(Camera2d);
70
71 let container = commands
72 .spawn((
73 Node {
74 display: Display::Grid,
75 width: percent(100),
76 height: percent(100),
77 grid_template_rows: vec![GridTrack::min_content(), GridTrack::flex(1.0)],
78 ..default()
79 },
80 BackgroundColor(Color::WHITE),
81 ))
82 .id();
83
84 // Keyboard Text
85 commands
86 .spawn((
87 TextData {
88 height: IMAGE_GROUP_BOX_INIT_HEIGHT,
89 width: IMAGE_GROUP_BOX_INIT_WIDTH,
90 },
91 Text::new(full_text),
92 TextColor::BLACK,
93 Node {
94 grid_row: GridPlacement::span(1),
95 padding: px(6).all(),
96 ..default()
97 },
98 UiDebugOptions {
99 enabled: false,
100 ..default()
101 },
102 ChildOf(container),
103 ))
104 .observe(update_text);
105
106 commands
107 .spawn((
108 Node {
109 display: Display::Flex,
110 grid_row: GridPlacement::span(1),
111 flex_direction: FlexDirection::Column,
112 justify_content: JustifyContent::SpaceAround,
113 padding: px(10.).all(),
114 ..default()
115 },
116 BackgroundColor(Color::BLACK),
117 ChildOf(container),
118 ))
119 .with_children(|builder| {
120 // `NodeImageMode::Auto` will resize the image automatically by taking the size of the source image and applying any layout constraints.
121 builder
122 .spawn((
123 ImageGroup,
124 Node {
125 display: Display::Flex,
126 justify_content: JustifyContent::Start,
127 width: percent(IMAGE_GROUP_BOX_INIT_WIDTH),
128 height: percent(IMAGE_GROUP_BOX_INIT_HEIGHT),
129 ..default()
130 },
131 BackgroundColor(Color::from(tailwind::BLUE_100)),
132 ))
133 .with_children(|parent| {
134 for _ in 0..4 {
135 // child node will apply Flex layout
136 parent.spawn((
137 Node::default(),
138 ImageNode {
139 image: image_handle.clone(),
140 image_mode: NodeImageMode::Auto,
141 ..default()
142 },
143 ));
144 }
145 });
146 // `NodeImageMode::Stretch` will resize the image to match the size of the `Node` component
147 builder
148 .spawn((
149 ImageGroup,
150 Node {
151 display: Display::Flex,
152 justify_content: JustifyContent::Start,
153 width: percent(IMAGE_GROUP_BOX_INIT_WIDTH),
154 height: percent(IMAGE_GROUP_BOX_INIT_HEIGHT),
155 ..default()
156 },
157 BackgroundColor(Color::from(tailwind::BLUE_100)),
158 ))
159 .with_children(|parent| {
160 for width in [10., 20., 30., 40.] {
161 parent.spawn((
162 Node {
163 height: percent(100),
164 width: percent(width),
165 ..default()
166 },
167 ImageNode {
168 image: image_handle.clone(),
169 image_mode: NodeImageMode::Stretch,
170 ..default()
171 },
172 ));
173 }
174 });
175 });
176}examples/ui/layout/grid.rs (line 34)
18fn spawn_layout(mut commands: Commands, asset_server: Res<AssetServer>) {
19 let font = asset_server.load("fonts/FiraSans-Bold.ttf");
20 commands.spawn(Camera2d);
21
22 // Top-level grid (app frame)
23 commands
24 .spawn((
25 Node {
26 // Use the CSS Grid algorithm for laying out this node
27 display: Display::Grid,
28 // Make node fill the entirety of its parent (in this case the window)
29 width: percent(100),
30 height: percent(100),
31 // Set the grid to have 2 columns with sizes [min-content, minmax(0, 1fr)]
32 // - The first column will size to the size of its contents
33 // - The second column will take up the remaining available space
34 grid_template_columns: vec![GridTrack::min_content(), GridTrack::flex(1.0)],
35 // Set the grid to have 3 rows with sizes [auto, minmax(0, 1fr), 20px]
36 // - The first row will size to the size of its contents
37 // - The second row take up remaining available space (after rows 1 and 3 have both been sized)
38 // - The third row will be exactly 20px high
39 grid_template_rows: vec![
40 GridTrack::auto(),
41 GridTrack::flex(1.0),
42 GridTrack::px(20.),
43 ],
44 ..default()
45 },
46 BackgroundColor(Color::WHITE),
47 ))
48 .with_children(|builder| {
49 // Header
50 builder
51 .spawn(
52 Node {
53 display: Display::Grid,
54 // Make this node span two grid columns so that it takes up the entire top tow
55 grid_column: GridPlacement::span(2),
56 padding: UiRect::all(px(6)),
57 ..default()
58 },
59 )
60 .with_children(|builder| {
61 spawn_nested_text_bundle(builder, font.clone(), "Bevy CSS Grid Layout Example");
62 });
63
64 // Main content grid (auto placed in row 2, column 1)
65 builder
66 .spawn((
67 Node {
68 // Make the height of the node fill its parent
69 height: percent(100),
70 // Make the grid have a 1:1 aspect ratio meaning it will scale as an exact square
71 // As the height is set explicitly, this means the width will adjust to match the height
72 aspect_ratio: Some(1.0),
73 // Use grid layout for this node
74 display: Display::Grid,
75 // Add 24px of padding around the grid
76 padding: UiRect::all(px(24)),
77 // Set the grid to have 4 columns all with sizes minmax(0, 1fr)
78 // This creates 4 exactly evenly sized columns
79 grid_template_columns: RepeatedGridTrack::flex(4, 1.0),
80 // Set the grid to have 4 rows all with sizes minmax(0, 1fr)
81 // This creates 4 exactly evenly sized rows
82 grid_template_rows: RepeatedGridTrack::flex(4, 1.0),
83 // Set a 12px gap/gutter between rows and columns
84 row_gap: px(12),
85 column_gap: px(12),
86 ..default()
87 },
88 BackgroundColor(Color::srgb(0.25, 0.25, 0.25)),
89 ))
90 .with_children(|builder| {
91 // Note there is no need to specify the position for each grid item. Grid items that are
92 // not given an explicit position will be automatically positioned into the next available
93 // grid cell. The order in which this is performed can be controlled using the grid_auto_flow
94 // style property.
95
96 item_rect(builder, ORANGE);
97 item_rect(builder, BISQUE);
98 item_rect(builder, BLUE);
99 item_rect(builder, CRIMSON);
100 item_rect(builder, AQUA);
101 item_rect(builder, ORANGE_RED);
102 item_rect(builder, DARK_GREEN);
103 item_rect(builder, FUCHSIA);
104 item_rect(builder, TEAL);
105 item_rect(builder, ALICE_BLUE);
106 item_rect(builder, CRIMSON);
107 item_rect(builder, ANTIQUE_WHITE);
108 item_rect(builder, YELLOW);
109 item_rect(builder, DEEP_PINK);
110 item_rect(builder, YELLOW_GREEN);
111 item_rect(builder, SALMON);
112 });
113
114 // Right side bar (auto placed in row 2, column 2)
115 builder
116 .spawn((
117 Node {
118 display: Display::Grid,
119 // Align content towards the start (top) in the vertical axis
120 align_items: AlignItems::Start,
121 // Align content towards the center in the horizontal axis
122 justify_items: JustifyItems::Center,
123 // Add 10px padding
124 padding: UiRect::all(px(10)),
125 // Add an fr track to take up all the available space at the bottom of the column so that the text nodes
126 // can be top-aligned. Normally you'd use flexbox for this, but this is the CSS Grid example so we're using grid.
127 grid_template_rows: vec![GridTrack::auto(), GridTrack::auto(), GridTrack::fr(1.0)],
128 // Add a 10px gap between rows
129 row_gap: px(10),
130 ..default()
131 },
132 BackgroundColor(BLACK.into()),
133 ))
134 .with_children(|builder| {
135 builder.spawn((Text::new("Sidebar"),
136 TextFont::from(font.clone()),
137 ));
138 builder.spawn((Text::new("A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely. A paragraph of text which ought to wrap nicely."),
139 TextFont {
140 font: font.clone().into(),
141 font_size: FontSize::Px(13.0),
142 ..default()
143 },
144 ));
145 builder.spawn(Node::default());
146 });
147
148 // Footer / status bar
149 builder.spawn((
150 Node {
151 // Make this node span two grid column so that it takes up the entire bottom row
152 grid_column: GridPlacement::span(2),
153 ..default()
154 },
155 BackgroundColor(WHITE.into()),
156 ));
157
158 // Modal (absolutely positioned on top of content - currently hidden: to view it, change its visibility)
159 builder.spawn((
160 Node {
161 position_type: PositionType::Absolute,
162 margin: UiRect {
163 top: px(100),
164 bottom: auto(),
165 left: auto(),
166 right: auto(),
167 },
168 width: percent(60),
169 height: px(300),
170 max_width: px(600),
171 ..default()
172 },
173 Visibility::Hidden,
174 BackgroundColor(Color::WHITE.with_alpha(0.8)),
175 ));
176 });
177}Sourcepub fn max_content<T>() -> T
pub fn max_content<T>() -> T
Create a grid track which is automatically sized to fit its contents when sized at their “max-content” sizes
Sourcepub fn fit_content_px<T>(limit: f32) -> T
pub fn fit_content_px<T>(limit: f32) -> T
Create a fit-content() grid track with fixed pixel limit.
https://developer.mozilla.org/en-US/docs/Web/CSS/fit-content_function
Sourcepub fn fit_content_percent<T>(limit: f32) -> T
pub fn fit_content_percent<T>(limit: f32) -> T
Create a fit-content() grid track with percentage limit.
https://developer.mozilla.org/en-US/docs/Web/CSS/fit-content_function
Sourcepub fn minmax<T>(min: MinTrackSizingFunction, max: MaxTrackSizingFunction) -> T
pub fn minmax<T>(min: MinTrackSizingFunction, max: MaxTrackSizingFunction) -> T
Create a minmax() grid track.
Sourcepub fn vmin<T>(value: f32) -> T
pub fn vmin<T>(value: f32) -> T
Create a grid track with a percentage of the viewport’s smaller dimension
Sourcepub fn vmax<T>(value: f32) -> T
pub fn vmax<T>(value: f32) -> T
Create a grid track with a percentage of the viewport’s larger dimension
Trait Implementations§
impl Copy for GridTrack
Source§impl<'de> Deserialize<'de> for GridTrack
impl<'de> Deserialize<'de> for GridTrack
Source§fn deserialize<__D>(
__deserializer: __D,
) -> Result<GridTrack, <__D as Deserializer<'de>>::Error>where
__D: Deserializer<'de>,
fn deserialize<__D>(
__deserializer: __D,
) -> Result<GridTrack, <__D as Deserializer<'de>>::Error>where
__D: Deserializer<'de>,
Deserialize this value from the given Serde deserializer. Read more
Source§impl From<GridTrack> for RepeatedGridTrack
impl From<GridTrack> for RepeatedGridTrack
Source§fn from(track: GridTrack) -> RepeatedGridTrack
fn from(track: GridTrack) -> RepeatedGridTrack
Converts to this type from the input type.
Source§impl FromReflect for GridTrack
impl FromReflect for GridTrack
Source§fn from_reflect(reflect: &(dyn PartialReflect + 'static)) -> Option<GridTrack>
fn from_reflect(reflect: &(dyn PartialReflect + 'static)) -> Option<GridTrack>
Constructs a concrete instance of
Self from a reflected value.Source§fn take_from_reflect(
reflect: Box<dyn PartialReflect>,
) -> Result<Self, Box<dyn PartialReflect>>
fn take_from_reflect( reflect: Box<dyn PartialReflect>, ) -> Result<Self, Box<dyn PartialReflect>>
Attempts to downcast the given value to
Self using,
constructing the value using from_reflect if that fails. Read moreSource§impl GetOwnership for GridTrack
impl GetOwnership for GridTrack
Source§impl GetTypeRegistration for GridTrack
impl GetTypeRegistration for GridTrack
Source§fn get_type_registration() -> TypeRegistration
fn get_type_registration() -> TypeRegistration
Returns the default
TypeRegistration for this type.Source§fn register_type_dependencies(registry: &mut TypeRegistry)
fn register_type_dependencies(registry: &mut TypeRegistry)
Registers other types needed by this type. Read more
Source§impl IntoReturn for GridTrack
impl IntoReturn for GridTrack
Source§impl PartialReflect for GridTrack
impl PartialReflect for GridTrack
Source§fn get_represented_type_info(&self) -> Option<&'static TypeInfo>
fn get_represented_type_info(&self) -> Option<&'static TypeInfo>
Source§fn try_apply(
&mut self,
value: &(dyn PartialReflect + 'static),
) -> Result<(), ApplyError>
fn try_apply( &mut self, value: &(dyn PartialReflect + 'static), ) -> Result<(), ApplyError>
Source§fn reflect_kind(&self) -> ReflectKind
fn reflect_kind(&self) -> ReflectKind
Returns a zero-sized enumeration of “kinds” of type. Read more
Source§fn reflect_ref(&self) -> ReflectRef<'_>
fn reflect_ref(&self) -> ReflectRef<'_>
Returns an immutable enumeration of “kinds” of type. Read more
Source§fn reflect_mut(&mut self) -> ReflectMut<'_>
fn reflect_mut(&mut self) -> ReflectMut<'_>
Returns a mutable enumeration of “kinds” of type. Read more
Source§fn reflect_owned(self: Box<GridTrack>) -> ReflectOwned
fn reflect_owned(self: Box<GridTrack>) -> ReflectOwned
Returns an owned enumeration of “kinds” of type. Read more
Source§fn try_into_reflect(
self: Box<GridTrack>,
) -> Result<Box<dyn Reflect>, Box<dyn PartialReflect>>
fn try_into_reflect( self: Box<GridTrack>, ) -> Result<Box<dyn Reflect>, Box<dyn PartialReflect>>
Attempts to cast this type to a boxed, fully-reflected value.
Source§fn try_as_reflect(&self) -> Option<&(dyn Reflect + 'static)>
fn try_as_reflect(&self) -> Option<&(dyn Reflect + 'static)>
Attempts to cast this type to a fully-reflected value.
Source§fn try_as_reflect_mut(&mut self) -> Option<&mut (dyn Reflect + 'static)>
fn try_as_reflect_mut(&mut self) -> Option<&mut (dyn Reflect + 'static)>
Attempts to cast this type to a mutable, fully-reflected value.
Source§fn into_partial_reflect(self: Box<GridTrack>) -> Box<dyn PartialReflect>
fn into_partial_reflect(self: Box<GridTrack>) -> Box<dyn PartialReflect>
Casts this type to a boxed, reflected value. Read more
Source§fn as_partial_reflect(&self) -> &(dyn PartialReflect + 'static)
fn as_partial_reflect(&self) -> &(dyn PartialReflect + 'static)
Casts this type to a reflected value. Read more
Source§fn as_partial_reflect_mut(&mut self) -> &mut (dyn PartialReflect + 'static)
fn as_partial_reflect_mut(&mut self) -> &mut (dyn PartialReflect + 'static)
Casts this type to a mutable, reflected value. Read more
Source§fn reflect_partial_eq(
&self,
value: &(dyn PartialReflect + 'static),
) -> Option<bool>
fn reflect_partial_eq( &self, value: &(dyn PartialReflect + 'static), ) -> Option<bool>
Returns a “partial equality” comparison result. Read more
Source§fn reflect_partial_cmp(
&self,
value: &(dyn PartialReflect + 'static),
) -> Option<Ordering>
fn reflect_partial_cmp( &self, value: &(dyn PartialReflect + 'static), ) -> Option<Ordering>
Returns a “partial comparison” result. Read more
Source§fn reflect_clone(&self) -> Result<Box<dyn Reflect>, ReflectCloneError>
fn reflect_clone(&self) -> Result<Box<dyn Reflect>, ReflectCloneError>
Attempts to clone
Self using reflection. Read moreSource§fn apply(&mut self, value: &(dyn PartialReflect + 'static))
fn apply(&mut self, value: &(dyn PartialReflect + 'static))
Applies a reflected value to this value. Read more
Source§fn to_dynamic(&self) -> Box<dyn PartialReflect>
fn to_dynamic(&self) -> Box<dyn PartialReflect>
Source§fn reflect_clone_and_take<T>(&self) -> Result<T, ReflectCloneError>
fn reflect_clone_and_take<T>(&self) -> Result<T, ReflectCloneError>
For a type implementing
PartialReflect, combines reflect_clone and
take in a useful fashion, automatically constructing an appropriate
ReflectCloneError if the downcast fails.Source§fn reflect_hash(&self) -> Option<u64>
fn reflect_hash(&self) -> Option<u64>
Returns a hash of the value (which includes the type). Read more
Source§fn debug(&self, f: &mut Formatter<'_>) -> Result<(), Error>
fn debug(&self, f: &mut Formatter<'_>) -> Result<(), Error>
Debug formatter for the value. Read more
Source§fn is_dynamic(&self) -> bool
fn is_dynamic(&self) -> bool
Indicates whether or not this type is a dynamic type. Read more
Source§impl Reflect for GridTrack
impl Reflect for GridTrack
Source§fn into_any(self: Box<GridTrack>) -> Box<dyn Any>
fn into_any(self: Box<GridTrack>) -> Box<dyn Any>
Returns the value as a
Box<dyn Any>. Read moreSource§fn as_any_mut(&mut self) -> &mut (dyn Any + 'static)
fn as_any_mut(&mut self) -> &mut (dyn Any + 'static)
Returns the value as a
&mut dyn Any. Read moreSource§fn into_reflect(self: Box<GridTrack>) -> Box<dyn Reflect>
fn into_reflect(self: Box<GridTrack>) -> Box<dyn Reflect>
Casts this type to a boxed, fully-reflected value.
Source§fn as_reflect(&self) -> &(dyn Reflect + 'static)
fn as_reflect(&self) -> &(dyn Reflect + 'static)
Casts this type to a fully-reflected value.
Source§fn as_reflect_mut(&mut self) -> &mut (dyn Reflect + 'static)
fn as_reflect_mut(&mut self) -> &mut (dyn Reflect + 'static)
Casts this type to a mutable, fully-reflected value.
Source§impl Serialize for GridTrack
impl Serialize for GridTrack
Source§fn serialize<__S>(
&self,
__serializer: __S,
) -> Result<<__S as Serializer>::Ok, <__S as Serializer>::Error>where
__S: Serializer,
fn serialize<__S>(
&self,
__serializer: __S,
) -> Result<<__S as Serializer>::Ok, <__S as Serializer>::Error>where
__S: Serializer,
Serialize this value into the given Serde serializer. Read more
Source§impl Struct for GridTrack
impl Struct for GridTrack
Source§fn field(&self, name: &str) -> Option<&(dyn PartialReflect + 'static)>
fn field(&self, name: &str) -> Option<&(dyn PartialReflect + 'static)>
Gets a reference to the value of the field named
name as a &dyn PartialReflect.Source§fn field_mut(
&mut self,
name: &str,
) -> Option<&mut (dyn PartialReflect + 'static)>
fn field_mut( &mut self, name: &str, ) -> Option<&mut (dyn PartialReflect + 'static)>
Gets a mutable reference to the value of the field named
name as a
&mut dyn PartialReflect.Source§fn field_at(&self, index: usize) -> Option<&(dyn PartialReflect + 'static)>
fn field_at(&self, index: usize) -> Option<&(dyn PartialReflect + 'static)>
Gets a reference to the value of the field with index
index as a
&dyn PartialReflect.Source§fn field_at_mut(
&mut self,
index: usize,
) -> Option<&mut (dyn PartialReflect + 'static)>
fn field_at_mut( &mut self, index: usize, ) -> Option<&mut (dyn PartialReflect + 'static)>
Gets a mutable reference to the value of the field with index
index
as a &mut dyn PartialReflect.Source§fn index_of_name(&self, name: &str) -> Option<usize>
fn index_of_name(&self, name: &str) -> Option<usize>
Gets the index of the field with the given name.
Source§fn iter_fields(&self) -> FieldIter<'_> ⓘ
fn iter_fields(&self) -> FieldIter<'_> ⓘ
Returns an iterator over the values of the reflectable fields for this struct.
Source§fn to_dynamic_struct(&self) -> DynamicStruct
fn to_dynamic_struct(&self) -> DynamicStruct
Creates a new
DynamicStruct from this struct.Source§fn get_represented_struct_info(&self) -> Option<&'static StructInfo>
fn get_represented_struct_info(&self) -> Option<&'static StructInfo>
Will return
None if TypeInfo is not available.impl StructuralPartialEq for GridTrack
Source§impl TypePath for GridTrack
impl TypePath for GridTrack
Source§fn type_path() -> &'static str
fn type_path() -> &'static str
Returns the fully qualified path of the underlying type. Read more
Source§fn short_type_path() -> &'static str
fn short_type_path() -> &'static str
Returns a short, pretty-print enabled path to the type. Read more
Source§fn type_ident() -> Option<&'static str>
fn type_ident() -> Option<&'static str>
Source§fn crate_name() -> Option<&'static str>
fn crate_name() -> Option<&'static str>
Auto Trait Implementations§
impl Freeze for GridTrack
impl RefUnwindSafe for GridTrack
impl Send for GridTrack
impl Sync for GridTrack
impl Unpin for GridTrack
impl UnsafeUnpin for GridTrack
impl UnwindSafe for GridTrack
Blanket Implementations§
Source§impl<T, U> AsBindGroupShaderType<U> for T
impl<T, U> AsBindGroupShaderType<U> for T
Source§fn as_bind_group_shader_type(&self, _images: &RenderAssets<GpuImage>) -> U
fn as_bind_group_shader_type(&self, _images: &RenderAssets<GpuImage>) -> U
Return the
T ShaderType for self. When used in AsBindGroup
derives, it is safe to assume that all images in self exist.Source§impl<T> BorrowMut<T> for Twhere
T: ?Sized,
impl<T> BorrowMut<T> for Twhere
T: ?Sized,
Source§fn borrow_mut(&mut self) -> &mut T
fn borrow_mut(&mut self) -> &mut T
Mutably borrows from an owned value. Read more
impl<T> Brush for T
impl<ST, DT> CastableFrom<ST, Initialized, Initialized> for DT
impl<ST, DT> CastableFrom<ST, Uninit, Uninit> for DT
Source§impl<T> CloneToUninit for Twhere
T: Clone,
impl<T> CloneToUninit for Twhere
T: Clone,
impl<T> ConditionalSend for Twhere
T: Send,
impl<T> DeserializeOwned for Twhere
T: for<'de> Deserialize<'de>,
Source§impl<T> Downcast for Twhere
T: Any,
impl<T> Downcast for Twhere
T: Any,
Source§fn into_any(self: Box<T>) -> Box<dyn Any>
fn into_any(self: Box<T>) -> Box<dyn Any>
Converts
Box<dyn Trait> (where Trait: Downcast) to Box<dyn Any>, which can then be
downcast into Box<dyn ConcreteType> where ConcreteType implements Trait.Source§fn into_any_rc(self: Rc<T>) -> Rc<dyn Any>
fn into_any_rc(self: Rc<T>) -> Rc<dyn Any>
Converts
Rc<Trait> (where Trait: Downcast) to Rc<Any>, which can then be further
downcast into Rc<ConcreteType> where ConcreteType implements Trait.Source§fn as_any(&self) -> &(dyn Any + 'static)
fn as_any(&self) -> &(dyn Any + 'static)
Converts
&Trait (where Trait: Downcast) to &Any. This is needed since Rust cannot
generate &Any’s vtable from &Trait’s.Source§fn as_any_mut(&mut self) -> &mut (dyn Any + 'static)
fn as_any_mut(&mut self) -> &mut (dyn Any + 'static)
Converts
&mut Trait (where Trait: Downcast) to &Any. This is needed since Rust cannot
generate &mut Any’s vtable from &mut Trait’s.Source§impl<T> Downcast for Twhere
T: Any,
impl<T> Downcast for Twhere
T: Any,
Source§fn into_any(self: Box<T>) -> Box<dyn Any>
fn into_any(self: Box<T>) -> Box<dyn Any>
Convert
Box<dyn Trait> (where Trait: Downcast) to Box<dyn Any>. Box<dyn Any> can
then be further downcast into Box<ConcreteType> where ConcreteType implements Trait.Source§fn into_any_rc(self: Rc<T>) -> Rc<dyn Any>
fn into_any_rc(self: Rc<T>) -> Rc<dyn Any>
Convert
Rc<Trait> (where Trait: Downcast) to Rc<Any>. Rc<Any> can then be
further downcast into Rc<ConcreteType> where ConcreteType implements Trait.Source§fn as_any(&self) -> &(dyn Any + 'static)
fn as_any(&self) -> &(dyn Any + 'static)
Convert
&Trait (where Trait: Downcast) to &Any. This is needed since Rust cannot
generate &Any’s vtable from &Trait’s.Source§fn as_any_mut(&mut self) -> &mut (dyn Any + 'static)
fn as_any_mut(&mut self) -> &mut (dyn Any + 'static)
Convert
&mut Trait (where Trait: Downcast) to &Any. This is needed since Rust cannot
generate &mut Any’s vtable from &mut Trait’s.Source§impl<T> DowncastSend for T
impl<T> DowncastSend for T
Source§impl<T> DowncastSync for T
impl<T> DowncastSync for T
impl<S, T> Duplex<S> for Twhere
T: FromSample<S> + ToSample<S>,
Source§impl<T> DynamicTypePath for Twhere
T: TypePath,
impl<T> DynamicTypePath for Twhere
T: TypePath,
Source§fn reflect_type_path(&self) -> &str
fn reflect_type_path(&self) -> &str
See
TypePath::type_path.Source§fn reflect_short_type_path(&self) -> &str
fn reflect_short_type_path(&self) -> &str
Source§fn reflect_type_ident(&self) -> Option<&str>
fn reflect_type_ident(&self) -> Option<&str>
See
TypePath::type_ident.Source§fn reflect_crate_name(&self) -> Option<&str>
fn reflect_crate_name(&self) -> Option<&str>
See
TypePath::crate_name.Source§fn reflect_module_path(&self) -> Option<&str>
fn reflect_module_path(&self) -> Option<&str>
Source§impl<T> DynamicTyped for Twhere
T: Typed,
impl<T> DynamicTyped for Twhere
T: Typed,
Source§fn reflect_type_info(&self) -> &'static TypeInfo
fn reflect_type_info(&self) -> &'static TypeInfo
See
Typed::type_info.impl<T> ErasedDestructor for Twhere
T: 'static,
Source§impl<T> FmtForward for T
impl<T> FmtForward for T
Source§fn fmt_binary(self) -> FmtBinary<Self>where
Self: Binary,
fn fmt_binary(self) -> FmtBinary<Self>where
Self: Binary,
Causes
self to use its Binary implementation when Debug-formatted.Source§fn fmt_display(self) -> FmtDisplay<Self>where
Self: Display,
fn fmt_display(self) -> FmtDisplay<Self>where
Self: Display,
Causes
self to use its Display implementation when
Debug-formatted.Source§fn fmt_lower_exp(self) -> FmtLowerExp<Self>where
Self: LowerExp,
fn fmt_lower_exp(self) -> FmtLowerExp<Self>where
Self: LowerExp,
Causes
self to use its LowerExp implementation when
Debug-formatted.Source§fn fmt_lower_hex(self) -> FmtLowerHex<Self>where
Self: LowerHex,
fn fmt_lower_hex(self) -> FmtLowerHex<Self>where
Self: LowerHex,
Causes
self to use its LowerHex implementation when
Debug-formatted.Source§fn fmt_octal(self) -> FmtOctal<Self>where
Self: Octal,
fn fmt_octal(self) -> FmtOctal<Self>where
Self: Octal,
Causes
self to use its Octal implementation when Debug-formatted.Source§fn fmt_pointer(self) -> FmtPointer<Self>where
Self: Pointer,
fn fmt_pointer(self) -> FmtPointer<Self>where
Self: Pointer,
Causes
self to use its Pointer implementation when
Debug-formatted.Source§fn fmt_upper_exp(self) -> FmtUpperExp<Self>where
Self: UpperExp,
fn fmt_upper_exp(self) -> FmtUpperExp<Self>where
Self: UpperExp,
Causes
self to use its UpperExp implementation when
Debug-formatted.Source§fn fmt_upper_hex(self) -> FmtUpperHex<Self>where
Self: UpperHex,
fn fmt_upper_hex(self) -> FmtUpperHex<Self>where
Self: UpperHex,
Causes
self to use its UpperHex implementation when
Debug-formatted.Source§impl<S> FromSample<S> for S
impl<S> FromSample<S> for S
fn from_sample_(s: S) -> S
Source§impl<T> FromTemplate for T
impl<T> FromTemplate for T
Source§impl<T> FromWorld for Twhere
T: Default,
impl<T> FromWorld for Twhere
T: Default,
Source§fn from_world(_world: &mut World) -> T
fn from_world(_world: &mut World) -> T
Creates Self using default().
Source§impl<S> GetField for Swhere
S: Struct,
impl<S> GetField for Swhere
S: Struct,
Source§impl<T> GetPath for T
impl<T> GetPath for T
Source§fn reflect_path<'p>(
&self,
path: impl ReflectPath<'p>,
) -> Result<&(dyn PartialReflect + 'static), ReflectPathError<'p>>
fn reflect_path<'p>( &self, path: impl ReflectPath<'p>, ) -> Result<&(dyn PartialReflect + 'static), ReflectPathError<'p>>
Returns a reference to the value specified by
path. Read moreSource§fn reflect_path_mut<'p>(
&mut self,
path: impl ReflectPath<'p>,
) -> Result<&mut (dyn PartialReflect + 'static), ReflectPathError<'p>>
fn reflect_path_mut<'p>( &mut self, path: impl ReflectPath<'p>, ) -> Result<&mut (dyn PartialReflect + 'static), ReflectPathError<'p>>
Returns a mutable reference to the value specified by
path. Read moreSource§fn path<'p, T>(
&self,
path: impl ReflectPath<'p>,
) -> Result<&T, ReflectPathError<'p>>where
T: Reflect,
fn path<'p, T>(
&self,
path: impl ReflectPath<'p>,
) -> Result<&T, ReflectPathError<'p>>where
T: Reflect,
Returns a statically typed reference to the value specified by
path. Read moreSource§fn path_mut<'p, T>(
&mut self,
path: impl ReflectPath<'p>,
) -> Result<&mut T, ReflectPathError<'p>>where
T: Reflect,
fn path_mut<'p, T>(
&mut self,
path: impl ReflectPath<'p>,
) -> Result<&mut T, ReflectPathError<'p>>where
T: Reflect,
Returns a statically typed mutable reference to the value specified by
path. Read moreSource§impl<T, W> HasTypeWitness<W> for Twhere
W: MakeTypeWitness<Arg = T>,
T: ?Sized,
impl<T, W> HasTypeWitness<W> for Twhere
W: MakeTypeWitness<Arg = T>,
T: ?Sized,
impl<T> HitDataExtra for T
Source§impl<T> Identity for Twhere
T: ?Sized,
impl<T> Identity for Twhere
T: ?Sized,
Source§impl<T> InitializeFromFunction<T> for T
impl<T> InitializeFromFunction<T> for T
Source§fn initialize_from_function(f: fn() -> T) -> T
fn initialize_from_function(f: fn() -> T) -> T
Create an instance of this type from an initialization function
Source§impl<T> Instrument for T
impl<T> Instrument for T
Source§fn instrument(self, span: Span) -> Instrumented<Self> ⓘ
fn instrument(self, span: Span) -> Instrumented<Self> ⓘ
Source§fn in_current_span(self) -> Instrumented<Self> ⓘ
fn in_current_span(self) -> Instrumented<Self> ⓘ
Source§impl<T> IntoEither for T
impl<T> IntoEither for T
Source§fn into_either(self, into_left: bool) -> Either<Self, Self> ⓘ
fn into_either(self, into_left: bool) -> Either<Self, Self> ⓘ
Converts
self into a Left variant of Either<Self, Self>
if into_left is true.
Converts self into a Right variant of Either<Self, Self>
otherwise. Read moreSource§fn into_either_with<F>(self, into_left: F) -> Either<Self, Self> ⓘ
fn into_either_with<F>(self, into_left: F) -> Either<Self, Self> ⓘ
Converts
self into a Left variant of Either<Self, Self>
if into_left(&self) returns true.
Converts self into a Right variant of Either<Self, Self>
otherwise. Read moreSource§impl<T> IntoResult<T> for T
impl<T> IntoResult<T> for T
Source§fn into_result(self) -> Result<T, RunSystemError>
fn into_result(self) -> Result<T, RunSystemError>
Converts this type into the system output type.
Source§impl<F, T> IntoSample<T> for Fwhere
T: FromSample<F>,
impl<F, T> IntoSample<T> for Fwhere
T: FromSample<F>,
fn into_sample(self) -> T
Source§impl<G> PatchFromTemplate for Gwhere
G: FromTemplate,
impl<G> PatchFromTemplate for Gwhere
G: FromTemplate,
Source§fn patch<F>(func: F) -> TemplatePatch<F, <G as PatchFromTemplate>::Template>
fn patch<F>(func: F) -> TemplatePatch<F, <G as PatchFromTemplate>::Template>
Takes a “patch function”
func, and turns it into a TemplatePatch.Source§impl<T> PatchTemplate for Twhere
T: Template,
impl<T> PatchTemplate for Twhere
T: Template,
Source§fn patch_template<F>(func: F) -> TemplatePatch<F, T>
fn patch_template<F>(func: F) -> TemplatePatch<F, T>
Source§impl<T> Pipe for Twhere
T: ?Sized,
impl<T> Pipe for Twhere
T: ?Sized,
Source§fn pipe<R>(self, func: impl FnOnce(Self) -> R) -> Rwhere
Self: Sized,
fn pipe<R>(self, func: impl FnOnce(Self) -> R) -> Rwhere
Self: Sized,
Pipes by value. This is generally the method you want to use. Read more
Source§fn pipe_ref<'a, R>(&'a self, func: impl FnOnce(&'a Self) -> R) -> Rwhere
R: 'a,
fn pipe_ref<'a, R>(&'a self, func: impl FnOnce(&'a Self) -> R) -> Rwhere
R: 'a,
Borrows
self and passes that borrow into the pipe function. Read moreSource§fn pipe_ref_mut<'a, R>(&'a mut self, func: impl FnOnce(&'a mut Self) -> R) -> Rwhere
R: 'a,
fn pipe_ref_mut<'a, R>(&'a mut self, func: impl FnOnce(&'a mut Self) -> R) -> Rwhere
R: 'a,
Mutably borrows
self and passes that borrow into the pipe function. Read moreSource§fn pipe_borrow<'a, B, R>(&'a self, func: impl FnOnce(&'a B) -> R) -> R
fn pipe_borrow<'a, B, R>(&'a self, func: impl FnOnce(&'a B) -> R) -> R
Source§fn pipe_borrow_mut<'a, B, R>(
&'a mut self,
func: impl FnOnce(&'a mut B) -> R,
) -> R
fn pipe_borrow_mut<'a, B, R>( &'a mut self, func: impl FnOnce(&'a mut B) -> R, ) -> R
Source§fn pipe_as_ref<'a, U, R>(&'a self, func: impl FnOnce(&'a U) -> R) -> R
fn pipe_as_ref<'a, U, R>(&'a self, func: impl FnOnce(&'a U) -> R) -> R
Borrows
self, then passes self.as_ref() into the pipe function.Source§fn pipe_as_mut<'a, U, R>(&'a mut self, func: impl FnOnce(&'a mut U) -> R) -> R
fn pipe_as_mut<'a, U, R>(&'a mut self, func: impl FnOnce(&'a mut U) -> R) -> R
Mutably borrows
self, then passes self.as_mut() into the pipe
function.Source§fn pipe_deref<'a, T, R>(&'a self, func: impl FnOnce(&'a T) -> R) -> R
fn pipe_deref<'a, T, R>(&'a self, func: impl FnOnce(&'a T) -> R) -> R
Borrows
self, then passes self.deref() into the pipe function.impl<T> Read<Exclusive, BecauseExclusive> for Twhere
T: ?Sized,
Source§impl<R, P> ReadPrimitive<R> for P
impl<R, P> ReadPrimitive<R> for P
Source§fn read_from_little_endian(read: &mut R) -> Result<Self, Error>
fn read_from_little_endian(read: &mut R) -> Result<Self, Error>
Read this value from the supplied reader. Same as
ReadEndian::read_from_little_endian().impl<T> Reflectable for T
Source§impl<T> Serialize for T
impl<T> Serialize for T
fn erased_serialize(&self, serializer: &mut dyn Serializer) -> Result<(), Error>
fn do_erased_serialize( &self, serializer: &mut dyn Serializer, ) -> Result<(), ErrorImpl>
impl<T> Settings for T
Source§impl<Ret> SpawnIfAsync<(), Ret> for Ret
impl<Ret> SpawnIfAsync<(), Ret> for Ret
Source§impl<T, O> SuperFrom<T> for Owhere
O: From<T>,
impl<T, O> SuperFrom<T> for Owhere
O: From<T>,
Source§fn super_from(input: T) -> O
fn super_from(input: T) -> O
Convert from a type to another type.
Source§impl<T, O, M> SuperInto<O, M> for Twhere
O: SuperFrom<T, M>,
impl<T, O, M> SuperInto<O, M> for Twhere
O: SuperFrom<T, M>,
Source§fn super_into(self) -> O
fn super_into(self) -> O
Convert from a type to another type.
Source§impl<T> Tap for T
impl<T> Tap for T
Source§fn tap_borrow<B>(self, func: impl FnOnce(&B)) -> Self
fn tap_borrow<B>(self, func: impl FnOnce(&B)) -> Self
Immutable access to the
Borrow<B> of a value. Read moreSource§fn tap_borrow_mut<B>(self, func: impl FnOnce(&mut B)) -> Self
fn tap_borrow_mut<B>(self, func: impl FnOnce(&mut B)) -> Self
Mutable access to the
BorrowMut<B> of a value. Read moreSource§fn tap_ref<R>(self, func: impl FnOnce(&R)) -> Self
fn tap_ref<R>(self, func: impl FnOnce(&R)) -> Self
Immutable access to the
AsRef<R> view of a value. Read moreSource§fn tap_ref_mut<R>(self, func: impl FnOnce(&mut R)) -> Self
fn tap_ref_mut<R>(self, func: impl FnOnce(&mut R)) -> Self
Mutable access to the
AsMut<R> view of a value. Read moreSource§fn tap_deref<T>(self, func: impl FnOnce(&T)) -> Self
fn tap_deref<T>(self, func: impl FnOnce(&T)) -> Self
Immutable access to the
Deref::Target of a value. Read moreSource§fn tap_deref_mut<T>(self, func: impl FnOnce(&mut T)) -> Self
fn tap_deref_mut<T>(self, func: impl FnOnce(&mut T)) -> Self
Mutable access to the
Deref::Target of a value. Read moreSource§fn tap_dbg(self, func: impl FnOnce(&Self)) -> Self
fn tap_dbg(self, func: impl FnOnce(&Self)) -> Self
Calls
.tap() only in debug builds, and is erased in release builds.Source§fn tap_mut_dbg(self, func: impl FnOnce(&mut Self)) -> Self
fn tap_mut_dbg(self, func: impl FnOnce(&mut Self)) -> Self
Calls
.tap_mut() only in debug builds, and is erased in release
builds.Source§fn tap_borrow_dbg<B>(self, func: impl FnOnce(&B)) -> Self
fn tap_borrow_dbg<B>(self, func: impl FnOnce(&B)) -> Self
Calls
.tap_borrow() only in debug builds, and is erased in release
builds.Source§fn tap_borrow_mut_dbg<B>(self, func: impl FnOnce(&mut B)) -> Self
fn tap_borrow_mut_dbg<B>(self, func: impl FnOnce(&mut B)) -> Self
Calls
.tap_borrow_mut() only in debug builds, and is erased in release
builds.Source§fn tap_ref_dbg<R>(self, func: impl FnOnce(&R)) -> Self
fn tap_ref_dbg<R>(self, func: impl FnOnce(&R)) -> Self
Calls
.tap_ref() only in debug builds, and is erased in release
builds.Source§fn tap_ref_mut_dbg<R>(self, func: impl FnOnce(&mut R)) -> Self
fn tap_ref_mut_dbg<R>(self, func: impl FnOnce(&mut R)) -> Self
Calls
.tap_ref_mut() only in debug builds, and is erased in release
builds.Source§fn tap_deref_dbg<T>(self, func: impl FnOnce(&T)) -> Self
fn tap_deref_dbg<T>(self, func: impl FnOnce(&T)) -> Self
Calls
.tap_deref() only in debug builds, and is erased in release
builds.Source§impl<T> Template for T
impl<T> Template for T
Source§fn build_template(
&self,
_context: &mut TemplateContext<'_, '_>,
) -> Result<<T as Template>::Output, BevyError>
fn build_template( &self, _context: &mut TemplateContext<'_, '_>, ) -> Result<<T as Template>::Output, BevyError>
Uses this template and the given
entity context to produce a Template::Output.Source§fn clone_template(&self) -> T
fn clone_template(&self) -> T
Clones this template. See
Clone.Source§impl<T, U> ToSample<U> for Twhere
U: FromSample<T>,
impl<T, U> ToSample<U> for Twhere
U: FromSample<T>,
fn to_sample_(self) -> U
Source§impl<T> TypeData for T
impl<T> TypeData for T
Source§fn clone_type_data(&self) -> Box<dyn TypeData>
fn clone_type_data(&self) -> Box<dyn TypeData>
Creates a type-erased clone of this value.