Skip to content

Commit e2224d2

Browse files
ickshonpebeicause
authored andcommitted
Add BorderRadius to Node (bevyengine#21781)
# Objective There was discussion in the `Next Generation Scene/UI` about adding `BackgroundColor` to `Node`. I don't know about that, but it reminded me that border radius isn't part of `Node`. All the other properties that affect a `Node`'s shape are there, border radius should be there too. ## Solution * Add a `border_radius: BorderRadius` field. * Remove the `Component` derive from `BorderRadius`. ## Testing The internal changes are relatively trivial. There could be mistakes in the examples though, because of the large number of changes.
1 parent d8fe0be commit e2224d2

34 files changed

+171
-129
lines changed

crates/bevy_feathers/src/controls/button.rs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -74,14 +74,14 @@ pub fn button<C: SpawnableList<ChildOf> + Send + Sync + 'static, B: Bundle>(
7474
align_items: AlignItems::Center,
7575
padding: UiRect::axes(Val::Px(8.0), Val::Px(0.)),
7676
flex_grow: 1.0,
77+
border_radius: props.corners.to_border_radius(4.0),
7778
..Default::default()
7879
},
7980
Button,
8081
props.variant,
8182
Hovered::default(),
8283
EntityCursor::System(bevy_window::SystemCursorIcon::Pointer),
8384
TabIndex(0),
84-
props.corners.to_border_radius(4.0),
8585
ThemeBackgroundColor(tokens::BUTTON_BG),
8686
ThemeFontColor(tokens::BUTTON_TEXT),
8787
InheritableFont {

crates/bevy_feathers/src/controls/checkbox.rs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -88,10 +88,10 @@ pub fn checkbox<C: SpawnableList<ChildOf> + Send + Sync + 'static, B: Bundle>(
8888
width: size::CHECKBOX_SIZE,
8989
height: size::CHECKBOX_SIZE,
9090
border: UiRect::all(Val::Px(2.0)),
91+
border_radius: BorderRadius::all(Val::Px(4.0)),
9192
..Default::default()
9293
},
9394
CheckboxOutline,
94-
BorderRadius::all(Val::Px(4.0)),
9595
ThemeBackgroundColor(tokens::CHECKBOX_BG),
9696
ThemeBorderColor(tokens::CHECKBOX_BORDER),
9797
children![(

crates/bevy_feathers/src/controls/color_plane.rs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -136,12 +136,12 @@ pub fn color_plane<B: Bundle>(plane: ColorPlane, overrides: B) -> impl Bundle {
136136
min_height: px(100.0),
137137
align_self: AlignSelf::Stretch,
138138
padding: UiRect::all(px(4)),
139+
border_radius: BorderRadius::all(px(5)),
139140
..Default::default()
140141
},
141142
plane,
142143
ColorPlaneValue::default(),
143144
ThemeBackgroundColor(tokens::COLOR_PLANE_BG),
144-
BorderRadius::all(px(5)),
145145
EntityCursor::System(bevy_window::SystemCursorIcon::Crosshair),
146146
overrides,
147147
children![(
@@ -159,10 +159,10 @@ pub fn color_plane<B: Bundle>(plane: ColorPlane, overrides: B) -> impl Bundle {
159159
width: px(10),
160160
height: px(10),
161161
border: UiRect::all(Val::Px(1.0)),
162+
border_radius: BorderRadius::MAX,
162163
..Default::default()
163164
},
164165
ColorPlaneThumb,
165-
BorderRadius::MAX,
166166
BorderColor::all(palette::WHITE),
167167
Outline {
168168
width: Val::Px(1.),

crates/bevy_feathers/src/controls/color_slider.rs

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -215,9 +215,9 @@ pub fn color_slider<B: Bundle>(props: ColorSliderProps, overrides: B) -> impl Bu
215215
right: Val::Px(0.),
216216
top: Val::Px(TRACK_PADDING),
217217
bottom: Val::Px(TRACK_PADDING),
218+
border_radius: RoundedCorners::All.to_border_radius(TRACK_RADIUS),
218219
..Default::default()
219220
},
220-
RoundedCorners::All.to_border_radius(TRACK_RADIUS),
221221
ColorSliderTrack,
222222
AlphaPattern,
223223
MaterialNode::<AlphaPatternMaterial>(Handle::default()),
@@ -226,9 +226,9 @@ pub fn color_slider<B: Bundle>(props: ColorSliderProps, overrides: B) -> impl Bu
226226
(
227227
Node {
228228
width: Val::Px(THUMB_SIZE * 0.5),
229+
border_radius: RoundedCorners::Left.to_border_radius(TRACK_RADIUS),
229230
..Default::default()
230231
},
231-
RoundedCorners::Left.to_border_radius(TRACK_RADIUS),
232232
BackgroundColor(palette::X_AXIS),
233233
),
234234
// Track with gradient
@@ -255,11 +255,11 @@ pub fn color_slider<B: Bundle>(props: ColorSliderProps, overrides: B) -> impl Bu
255255
width: Val::Px(THUMB_SIZE),
256256
height: Val::Px(THUMB_SIZE),
257257
border: UiRect::all(Val::Px(2.0)),
258+
border_radius: BorderRadius::MAX,
258259
..Default::default()
259260
},
260261
SliderThumb,
261262
ColorSliderThumb,
262-
BorderRadius::MAX,
263263
BorderColor::all(palette::WHITE),
264264
Outline {
265265
width: Val::Px(1.),
@@ -276,9 +276,9 @@ pub fn color_slider<B: Bundle>(props: ColorSliderProps, overrides: B) -> impl Bu
276276
(
277277
Node {
278278
width: Val::Px(THUMB_SIZE * 0.5),
279+
border_radius: RoundedCorners::Right.to_border_radius(TRACK_RADIUS),
279280
..Default::default()
280281
},
281-
RoundedCorners::Right.to_border_radius(TRACK_RADIUS),
282282
BackgroundColor(palette::Z_AXIS),
283283
),
284284
]

crates/bevy_feathers/src/controls/color_swatch.rs

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -48,13 +48,13 @@ pub fn color_swatch<B: Bundle>(overrides: B) -> impl Bundle {
4848
Node {
4949
height: size::ROW_HEIGHT,
5050
min_width: size::ROW_HEIGHT,
51+
border_radius: BorderRadius::all(Val::Px(5.0)),
5152
..Default::default()
5253
},
5354
ColorSwatch,
5455
ColorSwatchValue::default(),
5556
AlphaPattern,
5657
MaterialNode::<AlphaPatternMaterial>(Handle::default()),
57-
BorderRadius::all(Val::Px(5.0)),
5858
overrides,
5959
children![(
6060
Node {
@@ -63,12 +63,12 @@ pub fn color_swatch<B: Bundle>(overrides: B) -> impl Bundle {
6363
top: Val::Px(0.),
6464
bottom: Val::Px(0.),
6565
right: Val::Px(0.),
66+
border_radius: BorderRadius::all(Val::Px(5.0)),
6667
..Default::default()
6768
},
6869
ColorSwatchFg,
6970
BackgroundColor(palette::ACCENT.with_alpha(0.5)),
70-
BorderRadius::all(Val::Px(5.0))
71-
),],
71+
)],
7272
)
7373
}
7474

crates/bevy_feathers/src/controls/radio.rs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -85,19 +85,19 @@ pub fn radio<C: SpawnableList<ChildOf> + Send + Sync + 'static, B: Bundle>(
8585
width: size::RADIO_SIZE,
8686
height: size::RADIO_SIZE,
8787
border: UiRect::all(Val::Px(2.0)),
88+
border_radius: BorderRadius::MAX,
8889
..Default::default()
8990
},
9091
RadioOutline,
91-
BorderRadius::MAX,
9292
ThemeBorderColor(tokens::RADIO_BORDER),
9393
children![(
9494
// Cheesy checkmark: rotated node with L-shaped border.
9595
Node {
9696
width: Val::Px(8.),
9797
height: Val::Px(8.),
98+
border_radius: BorderRadius::MAX,
9899
..Default::default()
99100
},
100-
BorderRadius::MAX,
101101
RadioMark,
102102
ThemeBackgroundColor(tokens::RADIO_MARK),
103103
)],

crates/bevy_feathers/src/controls/slider.rs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -86,6 +86,7 @@ pub fn slider<B: Bundle>(props: SliderProps, overrides: B) -> impl Bundle {
8686
align_items: AlignItems::Center,
8787
padding: UiRect::axes(Val::Px(8.0), Val::Px(0.)),
8888
flex_grow: 1.0,
89+
border_radius: RoundedCorners::All.to_border_radius(6.0),
8990
..Default::default()
9091
},
9192
Slider {
@@ -96,7 +97,6 @@ pub fn slider<B: Bundle>(props: SliderProps, overrides: B) -> impl Bundle {
9697
SliderRange::new(props.min, props.max),
9798
EntityCursor::System(bevy_window::SystemCursorIcon::EwResize),
9899
TabIndex(0),
99-
RoundedCorners::All.to_border_radius(6.0),
100100
// Use a gradient to draw the moving bar
101101
BackgroundGradient(vec![Gradient::Linear(LinearGradient {
102102
angle: PI * 0.5,

crates/bevy_feathers/src/controls/toggle_switch.rs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -54,11 +54,11 @@ pub fn toggle_switch<B: Bundle>(overrides: B) -> impl Bundle {
5454
width: size::TOGGLE_WIDTH,
5555
height: size::TOGGLE_HEIGHT,
5656
border: UiRect::all(Val::Px(2.0)),
57+
border_radius: BorderRadius::all(Val::Px(5.0)),
5758
..Default::default()
5859
},
5960
Checkbox,
6061
ToggleSwitchOutline,
61-
BorderRadius::all(Val::Px(5.0)),
6262
ThemeBackgroundColor(tokens::SWITCH_BG),
6363
ThemeBorderColor(tokens::SWITCH_BORDER),
6464
AccessibilityNode(accesskit::Node::new(Role::Switch)),
@@ -73,9 +73,9 @@ pub fn toggle_switch<B: Bundle>(overrides: B) -> impl Bundle {
7373
top: Val::Px(0.),
7474
bottom: Val::Px(0.),
7575
width: Val::Percent(50.),
76+
border_radius: BorderRadius::all(Val::Px(3.0)),
7677
..Default::default()
7778
},
78-
BorderRadius::all(Val::Px(3.0)),
7979
ToggleSwitchSlide,
8080
ThemeBackgroundColor(tokens::SWITCH_SLIDE),
8181
)],

crates/bevy_ui/src/layout/convert.rs

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -448,6 +448,8 @@ impl RepeatedGridTrack {
448448
mod tests {
449449
use bevy_math::Vec2;
450450

451+
use crate::BorderRadius;
452+
451453
use super::*;
452454

453455
#[test]
@@ -489,6 +491,7 @@ mod tests {
489491
top: Val::Auto,
490492
bottom: Val::Percent(31.),
491493
},
494+
border_radius: BorderRadius::DEFAULT,
492495
flex_grow: 1.,
493496
flex_shrink: 0.,
494497
flex_basis: Val::ZERO,

crates/bevy_ui/src/layout/mod.rs

Lines changed: 8 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
use crate::{
22
experimental::{UiChildren, UiRootNodes},
33
ui_transform::{UiGlobalTransform, UiTransform},
4-
BorderRadius, ComputedNode, ComputedUiRenderTargetInfo, ContentSize, Display, IgnoreScroll,
5-
LayoutConfig, Node, Outline, OverflowAxis, ScrollPosition,
4+
ComputedNode, ComputedUiRenderTargetInfo, ContentSize, Display, IgnoreScroll, LayoutConfig,
5+
Node, Outline, OverflowAxis, ScrollPosition,
66
};
77
use bevy_ecs::{
88
change_detection::{DetectChanges, DetectChangesMut},
@@ -87,7 +87,6 @@ pub fn ui_layout_system(
8787
&mut UiGlobalTransform,
8888
&Node,
8989
Option<&LayoutConfig>,
90-
Option<&BorderRadius>,
9190
Option<&Outline>,
9291
Option<&ScrollPosition>,
9392
Option<&IgnoreScroll>,
@@ -199,7 +198,6 @@ pub fn ui_layout_system(
199198
&mut UiGlobalTransform,
200199
&Node,
201200
Option<&LayoutConfig>,
202-
Option<&BorderRadius>,
203201
Option<&Outline>,
204202
Option<&ScrollPosition>,
205203
Option<&IgnoreScroll>,
@@ -215,7 +213,6 @@ pub fn ui_layout_system(
215213
mut global_transform,
216214
style,
217215
maybe_layout_config,
218-
maybe_border_radius,
219216
maybe_outline,
220217
maybe_scroll_position,
221218
maybe_scroll_sticky,
@@ -279,14 +276,12 @@ pub fn ui_layout_system(
279276
*global_transform = inherited_transform.into();
280277
}
281278

282-
if let Some(border_radius) = maybe_border_radius {
283-
// We don't trigger change detection for changes to border radius
284-
node.bypass_change_detection().border_radius = border_radius.resolve(
285-
inverse_target_scale_factor.recip(),
286-
node.size,
287-
target_size,
288-
);
289-
}
279+
// We don't trigger change detection for changes to border radius
280+
node.bypass_change_detection().border_radius = style.border_radius.resolve(
281+
inverse_target_scale_factor.recip(),
282+
node.size,
283+
target_size,
284+
);
290285

291286
if let Some(outline) = maybe_outline {
292287
// don't trigger change detection when only outlines are changed

0 commit comments

Comments
 (0)