From 0f6336ba37a4ac3bca58a8d9c08a3f7e2b3eaec6 Mon Sep 17 00:00:00 2001
From: Peter <pt033@hdm-stuttgart.de>
Date: Mon, 18 Dec 2023 18:46:36 +0100
Subject: [PATCH] update(ui): change round selection to scroll pane #14
---
src/main/resources/fxml/LocalCreate.fxml | 31 +++++++++++-------
src/main/resources/styles/style.css | 40 ++++++++++++++++++++++++
2 files changed, 59 insertions(+), 12 deletions(-)
diff --git a/src/main/resources/fxml/LocalCreate.fxml b/src/main/resources/fxml/LocalCreate.fxml
index 9f032d1d..775687f3 100644
--- a/src/main/resources/fxml/LocalCreate.fxml
+++ b/src/main/resources/fxml/LocalCreate.fxml
@@ -4,6 +4,7 @@
<?import javafx.scene.control.Accordion?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.RadioButton?>
+<?import javafx.scene.control.ScrollPane?>
<?import javafx.scene.control.TitledPane?>
<?import javafx.scene.control.ToggleButton?>
<?import javafx.scene.control.ToggleGroup?>
@@ -23,17 +24,24 @@
<panes>
<TitledPane fx:id="roundsTitledPane" text="Select">
<content>
- <VBox fx:id="boxBox">
- <children>
- <ToggleButton mnemonicParsing="false" text="1">
- <toggleGroup>
- <ToggleGroup fx:id="rounds" />
- </toggleGroup>
- </ToggleButton>
- <ToggleButton mnemonicParsing="false" text="2" toggleGroup="$rounds" />
- <ToggleButton mnemonicParsing="false" text="3" toggleGroup="$rounds" />
- </children>
- </VBox>
+ <ScrollPane minViewportHeight="40.0">
+ <content>
+ <VBox fx:id="boxBox">
+ <children>
+ <ToggleButton mnemonicParsing="false" styleClass="roundsButton" text="1">
+ <toggleGroup>
+ <ToggleGroup fx:id="rounds" />
+ </toggleGroup>
+ <VBox.margin>
+ <Insets />
+ </VBox.margin>
+ </ToggleButton>
+ <ToggleButton mnemonicParsing="false" styleClass="roundsButton" text="2" toggleGroup="$rounds" />
+ <ToggleButton mnemonicParsing="false" styleClass="roundsButton" text="3" toggleGroup="$rounds" />
+ </children>
+ </VBox>
+ </content>
+ </ScrollPane>
</content>
</TitledPane>
</panes>
@@ -109,6 +117,5 @@
</VBox.margin>
</Button>
<Pane VBox.vgrow="ALWAYS" />
- <Pane VBox.vgrow="ALWAYS" />
</children>
</VBox>
diff --git a/src/main/resources/styles/style.css b/src/main/resources/styles/style.css
index 4f9ae7b1..2322b78e 100644
--- a/src/main/resources/styles/style.css
+++ b/src/main/resources/styles/style.css
@@ -42,6 +42,46 @@
-fx-border-width: 0;
}
+
+.scroll-pane > .viewport {
+ -fx-background-color: none;
+}
+
+.scroll-pane {
+ -fx-background-color: transparent;
+}
+
+/*scroll pane scroll bar*/
+.scroll-pane .scroll-bar:horizontal .track,
+.scroll-pane .scroll-bar:vertical .track {
+ -fx-background-color: -fx-dark-brown;
+ -fx-border-color: none;
+ -fx-background-radius: 1em;
+ -fx-border-radius: 1em;
+}
+
+/* The increment and decrement button CSS class of scrollbar */
+.scroll-pane .scroll-bar:vertical .increment-button ,
+.scroll-pane .scroll-bar:vertical .decrement-button {
+ -fx-background-color: transparent;
+ -fx-background-radius: 0em;
+ -fx-padding:0 12 0 0;
+}
+
+.scroll-pane .scroll-bar .increment-arrow,
+.scroll-pane .scroll-bar .decrement-arrow {
+ -fx-shape: " ";
+ -fx-padding: 0;
+}
+
+/* The main scrollbar **thumb** CSS class which we drag every time (movable) */
+.scroll-pane .scroll-bar:horizontal .thumb,
+.scroll-pane .scroll-bar:vertical .thumb {
+ -fx-background-color: white;
+ -fx-background-insets: 2, 0, 0;
+ -fx-background-radius: 1em;
+}
+
#boxBox {
-fx-background-color: none;
}
--
GitLab