From 320fd5fde047930ea1a32bdc7fba53a46f283d93 Mon Sep 17 00:00:00 2001
From: Peter <pt033@hdm-stuttgart.de>
Date: Mon, 27 Nov 2023 17:05:36 +0100
Subject: [PATCH] add(ui): add styling to scenes
---
.../Controller/ButtonTransitionScale.java | 27 +++++++++++++++++++
.../Controller/MainMenuController.java | 9 +++++++
.../hdm_stuttgart/battlearena/Main/Main.java | 7 +++++
src/main/resources/fxml/MainMenu.fxml | 2 ++
src/main/resources/styles/style.css | 19 +++++++++++++
5 files changed, 64 insertions(+)
create mode 100644 src/main/java/de/hdm_stuttgart/battlearena/Controller/ButtonTransitionScale.java
create mode 100644 src/main/resources/styles/style.css
diff --git a/src/main/java/de/hdm_stuttgart/battlearena/Controller/ButtonTransitionScale.java b/src/main/java/de/hdm_stuttgart/battlearena/Controller/ButtonTransitionScale.java
new file mode 100644
index 00000000..69488707
--- /dev/null
+++ b/src/main/java/de/hdm_stuttgart/battlearena/Controller/ButtonTransitionScale.java
@@ -0,0 +1,27 @@
+package de.hdm_stuttgart.battlearena.Controller;
+
+import javafx.animation.ScaleTransition;
+import javafx.scene.control.Button;
+import javafx.scene.control.skin.ButtonSkin;
+import javafx.util.Duration;
+
+public class ButtonTransitionScale extends ButtonSkin {
+ public ButtonTransitionScale(Button button) {
+ super(button);
+// set transition for mouse hovering over button
+ final ScaleTransition fadeIn = new ScaleTransition(Duration.millis(150));
+ fadeIn.setNode(button);
+ fadeIn.setByX(0.1);
+ fadeIn.setByY(0.1);
+ button.setOnMouseEntered(e -> fadeIn.playFromStart());
+
+// set transition for mouse exiting buttonButtonTransitionScale
+ final ScaleTransition fadeOut = new ScaleTransition(Duration.millis(150));
+ fadeOut.setNode(button);
+ fadeOut.setByX(-0.1);
+ fadeOut.setByY(-0.1);
+ button.setOnMouseExited(e -> fadeOut.playFromStart());
+
+ button.setScaleX(1.0);
+ }
+}
diff --git a/src/main/java/de/hdm_stuttgart/battlearena/Controller/MainMenuController.java b/src/main/java/de/hdm_stuttgart/battlearena/Controller/MainMenuController.java
index db1ccca5..ebfc5fe5 100644
--- a/src/main/java/de/hdm_stuttgart/battlearena/Controller/MainMenuController.java
+++ b/src/main/java/de/hdm_stuttgart/battlearena/Controller/MainMenuController.java
@@ -1,16 +1,25 @@
package de.hdm_stuttgart.battlearena.Controller;
import javafx.fxml.FXML;
+import javafx.fxml.Initializable;
import javafx.scene.control.Button;
+import javafx.scene.image.Image;
+import javafx.scene.image.ImageView;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.Pane;
import javafx.stage.Stage;
+import java.io.FileInputStream;
+import java.io.FileNotFoundException;
+import java.net.URL;
+import java.util.ResourceBundle;
+
public class MainMenuController extends SceneLoader {
@FXML public BorderPane parent;
@FXML public Button exitButton;
public void playScene() {
+
Pane pane = new Pane(loadScene("Play"));
// get(0) returns the first item from the getChildren() List
parent.setCenter(pane.getChildren().get(0));
diff --git a/src/main/java/de/hdm_stuttgart/battlearena/Main/Main.java b/src/main/java/de/hdm_stuttgart/battlearena/Main/Main.java
index 31ddc730..d1afd4e5 100644
--- a/src/main/java/de/hdm_stuttgart/battlearena/Main/Main.java
+++ b/src/main/java/de/hdm_stuttgart/battlearena/Main/Main.java
@@ -4,8 +4,10 @@ import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
+import javafx.scene.text.Font;
import javafx.stage.Stage;
+import javafx.stage.StageStyle;
import org.apache.logging.log4j.LogManager;
import org.apache.logging.log4j.Logger;
@@ -21,15 +23,20 @@ public class Main extends Application {
@Override
public void start(Stage stage) throws Exception {
+// loading font in start() because CSS can't handle whitespace in folder names
+ Font.loadFont(getClass().getResourceAsStream("/fonts/StarshipShadow.ttf"), 20);
+
Parent root = FXMLLoader.load(Objects.requireNonNull(getClass().getResource("/fxml/MainMenu.fxml")));
Scene scene = new Scene(root);
+ scene.getStylesheets().add(Objects.requireNonNull(this.getClass().getResource("/styles/style.css")).toExternalForm());
stage.setTitle("BattleArena");
stage.setScene(scene);
stage.minHeightProperty().setValue(400);
stage.minWidthProperty().setValue(600);
stage.setMaximized(true);
+ stage.initStyle(StageStyle.UNDECORATED);
stage.show();
log.debug("Project started successfully!");
diff --git a/src/main/resources/fxml/MainMenu.fxml b/src/main/resources/fxml/MainMenu.fxml
index 58e9be7c..152f4a65 100644
--- a/src/main/resources/fxml/MainMenu.fxml
+++ b/src/main/resources/fxml/MainMenu.fxml
@@ -5,12 +5,14 @@
<?import javafx.scene.layout.BorderPane?>
<?import javafx.scene.layout.Pane?>
<?import javafx.scene.layout.VBox?>
+<?import javafx.scene.text.Text?>
<BorderPane fx:id="parent" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/21" xmlns:fx="http://javafx.com/fxml/1" fx:controller="de.hdm_stuttgart.battlearena.Controller.MainMenuController">
<center>
<VBox alignment="CENTER" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" prefHeight="200.0" prefWidth="100.0" spacing="50.0" BorderPane.alignment="CENTER">
<children>
<Pane VBox.vgrow="ALWAYS" />
+ <Text id="gameTitle" strokeType="OUTSIDE" strokeWidth="0.0" text="Battlearena" />
<Button mnemonicParsing="false" onAction="#playScene" text="Play" VBox.vgrow="ALWAYS">
<VBox.margin>
<Insets top="20.0" />
diff --git a/src/main/resources/styles/style.css b/src/main/resources/styles/style.css
new file mode 100644
index 00000000..fb566bb8
--- /dev/null
+++ b/src/main/resources/styles/style.css
@@ -0,0 +1,19 @@
+.root {
+ -fx-font-family: "Starship Shadow";
+ -fx-background-color: #3c2014;
+ -fx-text-fill: #956233;
+ -fx-font-size: 50;
+ -fx-background-image: url("../images/background.png");
+ -fx-background-size: cover;
+ -fx-effect: dropshadow(three-pass-box, black, 30, 0.5, 0, 0);
+}
+
+#gameTitle {
+ -fx-font-size: 100;
+}
+
+.button {
+ -fx-text-fill: #956233;
+ -fx-background-color: none;
+ -fx-skin: "de.hdm_stuttgart.battlearena.Controller.ButtonTransitionScale"
+}
\ No newline at end of file
--
GitLab