ADD::added style to some buttons

EDIT::changed travel pane from anchor pane to scroll pane
This commit is contained in:
Sem van der Hoeven
2019-03-25 15:45:31 +01:00
parent 987acbad71
commit 521426ac16
3 changed files with 29 additions and 19 deletions

View File

@@ -7,6 +7,7 @@ import javafx.event.ActionEvent;
import javafx.fxml.FXML; import javafx.fxml.FXML;
import javafx.scene.control.Button; import javafx.scene.control.Button;
import javafx.scene.control.Label; import javafx.scene.control.Label;
import javafx.scene.control.ScrollPane;
import javafx.scene.control.Slider; import javafx.scene.control.Slider;
import javafx.scene.layout.AnchorPane; import javafx.scene.layout.AnchorPane;
import org.springframework.beans.factory.annotation.Autowired; import org.springframework.beans.factory.annotation.Autowired;
@@ -30,7 +31,7 @@ public class CalculatorController {
@FXML @FXML
private AnchorPane getStartedPane; private AnchorPane getStartedPane;
@FXML @FXML
private AnchorPane travelPane; private ScrollPane travelPane;
@FXML @FXML
private AnchorPane homePane; private AnchorPane homePane;
@FXML @FXML
@@ -47,6 +48,8 @@ public class CalculatorController {
private Label annualIncomeLabel; private Label annualIncomeLabel;
@FXML @FXML
private Button saveButton; private Button saveButton;
@FXML
private Button getStartedNextButton;
public void initialize() { public void initialize() {
peopleInHouseholdSLider.setSnapToTicks(true); peopleInHouseholdSLider.setSnapToTicks(true);

View File

@@ -14,7 +14,7 @@
<children> <children>
<AnchorPane fx:id="calculatorTabs" prefHeight="85.0" prefWidth="820.0" style="-fx-background-color: #677069;"> <AnchorPane fx:id="calculatorTabs" prefHeight="85.0" prefWidth="820.0" style="-fx-background-color: #677069;">
<children> <children>
<Button fx:id="calculatorGetStartedButton" contentDisplay="TOP" layoutX="188.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayGetStarted" style="-fx-padding: 0px 0px 0px 0px;" text="Get started" textFill="#d4ddd6" AnchorPane.leftAnchor="188.0"> <Button fx:id="calculatorGetStartedButton" contentDisplay="TOP" layoutX="188.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayGetStarted" style="-fx-padding: 0px 0px 0px 0px;" styleClass="navButton" text="Get started" textFill="#d4ddd6" AnchorPane.leftAnchor="188.0">
<font> <font>
<Font name="Corbel Bold" size="16.0" /> <Font name="Corbel Bold" size="16.0" />
</font> </font>
@@ -30,7 +30,7 @@
</ImageView> </ImageView>
</graphic> </graphic>
</Button> </Button>
<Button fx:id="calculatorTravelButton" contentDisplay="TOP" layoutX="273.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayTravel" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" text="Travel" textFill="#d4ddd6" AnchorPane.leftAnchor="273.0"> <Button fx:id="calculatorTravelButton" contentDisplay="TOP" layoutX="273.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayTravel" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" styleClass="navButton" text="Travel" textFill="#d4ddd6" AnchorPane.leftAnchor="273.0">
<font> <font>
<Font name="Corbel Bold" size="16.0" /> <Font name="Corbel Bold" size="16.0" />
</font> </font>
@@ -47,7 +47,7 @@
</ImageView> </ImageView>
</graphic> </graphic>
</Button> </Button>
<Button fx:id="calculatorHomeButton" contentDisplay="TOP" layoutX="358.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayHome" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" text="Home" textFill="#d4ddd6" AnchorPane.leftAnchor="358.0"> <Button fx:id="calculatorHomeButton" contentDisplay="TOP" layoutX="358.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayHome" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" styleClass="navButton" text="Home" textFill="#d4ddd6" AnchorPane.leftAnchor="358.0">
<font> <font>
<Font name="Corbel Bold" size="16.0" /> <Font name="Corbel Bold" size="16.0" />
</font> </font>
@@ -64,7 +64,7 @@
</ImageView> </ImageView>
</graphic> </graphic>
</Button> </Button>
<Button fx:id="calculatorFoodButton" contentDisplay="TOP" layoutX="443.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayFood" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" text="Food" textFill="#d4ddd6" AnchorPane.leftAnchor="443.0"> <Button fx:id="calculatorFoodButton" contentDisplay="TOP" layoutX="443.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayFood" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" styleClass="navButton" text="Food" textFill="#d4ddd6" AnchorPane.leftAnchor="443.0">
<font> <font>
<Font name="Corbel Bold" size="16.0" /> <Font name="Corbel Bold" size="16.0" />
</font> </font>
@@ -81,7 +81,7 @@
</ImageView> </ImageView>
</graphic> </graphic>
</Button> </Button>
<Button fx:id="calculatorShoppingButton" contentDisplay="TOP" layoutX="528.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayShopping" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" text="Shopping" textFill="#d4ddd6" AnchorPane.leftAnchor="528.0"> <Button fx:id="calculatorShoppingButton" contentDisplay="TOP" layoutX="528.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayShopping" prefHeight="81.0" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" styleClass="navButton" text="Shopping" textFill="#d4ddd6" AnchorPane.leftAnchor="528.0">
<font> <font>
<Font name="Corbel Bold" size="16.0" /> <Font name="Corbel Bold" size="16.0" />
</font> </font>
@@ -98,7 +98,10 @@
</ImageView> </ImageView>
</graphic> </graphic>
</Button> </Button>
<Button fx:id="saveButton" layoutX="702.0" layoutY="30.0" mnemonicParsing="false" text="Save" /> <Button fx:id="saveButton" layoutX="702.0" layoutY="24.0" mnemonicParsing="false" text="Save">
<font>
<Font size="17.0" />
</font></Button>
</children> </children>
</AnchorPane> </AnchorPane>
<AnchorPane fx:id="getStartedPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" AnchorPane.leftAnchor="0.0"> <AnchorPane fx:id="getStartedPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" AnchorPane.leftAnchor="0.0">
@@ -132,8 +135,9 @@
<Insets /> <Insets />
</opaqueInsets> </opaqueInsets>
</Label> </Label>
<Button fx:id="getStartedNextButton" layoutX="383.0" layoutY="406.0" mnemonicParsing="false" onAction="#displayTravel" styleClass="nextButton" text="Next" />
</children></AnchorPane> </children></AnchorPane>
<AnchorPane fx:id="travelPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" /> <ScrollPane fx:id="travelPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" />
<AnchorPane fx:id="homePane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" /> <AnchorPane fx:id="homePane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" />
<AnchorPane fx:id="foodPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" /> <AnchorPane fx:id="foodPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" />
<AnchorPane fx:id="shoppingPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" /> <AnchorPane fx:id="shoppingPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" />

View File

@@ -1,27 +1,28 @@
/*#calculatorShoppingButton:hover {*/
/*-fx-background-color: red;*/
/*}*/
/*#calculatorGetStartedButton:pressed {*/
/*-fx-background-color: red;*/
/*-fx-border-color: #677069;*/
/*}*/
#calculatorTabs .button { #calculatorTabs .navButton {
-fx-background-color: transparent; -fx-background-color: transparent;
-fx-font-size: 16px;
} }
#calculatorTabs .button:pressed { #calculatorTabs .navButton:pressed {
-fx-border-color: #677069; -fx-border-color: #677069;
} }
#calculatorTabs .button:hover { #calculatorTabs .navButton:hover {
-fx-background-color: #707a72; -fx-background-color: #707a72;
} }
#calculatorTabs #saveButton { #calculatorTabs #saveButton {
-fx-background-color: #89a888; -fx-background-color: #89a888;
-fx-font-size: 16px;
-fx-font-weight: regular;
} }
.root { .nextButton {
-fx-background-color: #89a888;
-fx-font-size: 16px;
-fx-font-family: Corbel; -fx-font-family: Corbel;
} }
.nextButton:hover {
-fx-background-color: #9ec19c;
}
.slider { .slider {
-show-value-on-interaction: true; -show-value-on-interaction: true;
@@ -30,3 +31,5 @@