fix: Use UI components for GameScreen settings

This commit is contained in:
demenik
2025-11-28 15:32:51 +01:00
parent 202f62b41c
commit 2d0f51ff3d
4 changed files with 59 additions and 105 deletions

View File

@@ -10,9 +10,7 @@ pub fn open_settings(commands: &mut Commands) {
position_type: PositionType::Absolute,
width: percent(100),
height: percent(100),
justify_content: JustifyContent::Center,
align_items: AlignItems::Center,
..default()
..Node::center()
},
ZIndex(1),
BackgroundColor(Color::srgba(0.0, 0.0, 0.0, 0.8)),
@@ -21,10 +19,9 @@ pub fn open_settings(commands: &mut Commands) {
parent
.spawn((
Node {
flex_direction: FlexDirection::Column,
align_items: AlignItems::Center,
width: px(700),
padding: UiRect::all(px(20.0)),
..default()
..Node::vstack(px(20))
},
BackgroundColor(Color::srgb(0.2, 0.2, 0.2)),
BorderRadius::all(px(10.0)),
@@ -32,12 +29,8 @@ pub fn open_settings(commands: &mut Commands) {
.with_children(|parent| {
parent.spawn((
Node {
width: percent(100.0),
justify_content: JustifyContent::SpaceBetween,
align_items: AlignItems::Center,
margin: UiRect::bottom(px(20.0)),
column_gap: px(20.0),
..default()
..Node::hstack(px(20))
},
children![
(
@@ -45,93 +38,73 @@ pub fn open_settings(commands: &mut Commands) {
TextFont::from_font_size(40.0),
TextColor(Color::WHITE),
),
(
Button,
pill_button(
ButtonType::SettingsClose,
ButtonVariant::Destructive,
Node {
width: px(40.0),
height: px(40.0),
justify_content: JustifyContent::Center,
align_items: AlignItems::Center,
width: px(40),
height: px(40),
..default()
},
BackgroundColor(Color::srgb(0.8, 0.2, 0.2)),
BorderRadius::MAX,
children![(
Text::new("X"),
TextFont::from_font_size(24.0),
TextColor(Color::WHITE),
)]
)
"X",
24.0
),
],
));
parent
.spawn(Node {
width: percent(100),
flex_direction: FlexDirection::Column,
margin: UiRect::top(px(10.0)),
row_gap: px(10.0),
..default()
})
.spawn(Node::vstack(px(10)))
.with_children(|parent| {
parent.spawn((
Button,
parent.spawn(button(
ButtonType::SettingsExit,
ButtonVariant::Secondary,
Node {
width: percent(100),
height: px(80),
justify_content: JustifyContent::Center,
align_items: AlignItems::Center,
padding: UiRect::horizontal(px(10.0)),
padding: UiRect::all(px(10)),
..default()
},
BackgroundColor(NORMAL_BUTTON),
BorderRadius::all(px(10)),
children![(
Text::new("Spiel verlassen"),
TextFont::from_font_size(24.0),
TextColor(Color::WHITE)
)],
"Spiel verlassen",
24.0,
));
parent.spawn((
Button,
parent.spawn(button(
ButtonType::SettingsSave,
ButtonVariant::Secondary,
Node {
width: percent(100),
height: px(80),
justify_content: JustifyContent::Center,
align_items: AlignItems::Center,
padding: UiRect::horizontal(px(10.0)),
padding: UiRect::all(px(10)),
..default()
},
BackgroundColor(NORMAL_BUTTON),
BorderRadius::all(px(10)),
children![(
Text::new("Spiel speichern"),
TextFont::from_font_size(24.0),
TextColor(Color::WHITE)
)],
"Spiel speichern",
24.0,
));
parent.spawn((
Node {
width: percent(100),
flex_direction: FlexDirection::Row,
justify_content: JustifyContent::SpaceBetween,
align_items: AlignItems::Center,
column_gap: px(10),
padding: UiRect::horizontal(px(10.0)),
..default()
justify_content: JustifyContent::Center,
..Node::hstack(px(30))
},
children![
(
Node {
flex_direction: FlexDirection::Column,
width: percent(40),
..Node::vstack(px(10))
},
children![
(
Text::new("Timer Einstellungen"),
TextFont::from_font_size(18.0),
TextColor(Color::WHITE),
),
(
Text::new("Tipp: Benutze [Umstellen] um in 10er Schritten zu inkrementieren oder dekrementieren!"),
TextFont::from_font_size(16.0),
TextColor(Color::WHITE)
)
]
),
(
Node {
align_items: AlignItems::Center,
row_gap: px(10),
..default()
..Node::vstack(px(10))
},
children![
(
@@ -144,10 +117,8 @@ pub fn open_settings(commands: &mut Commands) {
),
(
Node {
flex_direction: FlexDirection::Column,
align_items: AlignItems::Center,
row_gap: px(10),
..default()
..Node::vstack(px(10))
},
children![
(
@@ -160,10 +131,8 @@ pub fn open_settings(commands: &mut Commands) {
),
(
Node {
flex_direction: FlexDirection::Column,
align_items: AlignItems::Center,
row_gap: px(10),
..default()
..Node::vstack(px(10))
},
children![
(