Change separator fill in title bar and launch button to reduce color difference

This commit is contained in:
huanghongxun
2018-10-11 22:20:41 +08:00
parent 0e5250dfb3
commit 9981423927
5 changed files with 13 additions and 3 deletions

View File

@@ -146,7 +146,7 @@ public class DecoratorSkin extends SkinBase<Decorator> {
titleContainer.setOnMouseMoved(this::onMouseMoved); titleContainer.setOnMouseMoved(this::onMouseMoved);
titleContainer.setPickOnBounds(false); titleContainer.setPickOnBounds(false);
titleContainer.setMinHeight(40); titleContainer.setMinHeight(40);
titleContainer.getStyleClass().setAll("jfx-tool-bar"); titleContainer.getStyleClass().addAll("jfx-tool-bar", "window-title-bar");
titleContainer.addEventHandler(MouseEvent.MOUSE_ENTERED, e -> allowMove = true); titleContainer.addEventHandler(MouseEvent.MOUSE_ENTERED, e -> allowMove = true);
titleContainer.addEventHandler(MouseEvent.MOUSE_EXITED, e -> { titleContainer.addEventHandler(MouseEvent.MOUSE_EXITED, e -> {
if (!isDragging) allowMove = false; if (!isDragging) allowMove = false;
@@ -169,9 +169,9 @@ public class DecoratorSkin extends SkinBase<Decorator> {
titleWrapper.setCenter(lblTitle); titleWrapper.setCenter(lblTitle);
Rectangle separator = new Rectangle(); Rectangle separator = new Rectangle();
separator.getStyleClass().add("separator");
separator.heightProperty().bind(titleWrapper.heightProperty()); separator.heightProperty().bind(titleWrapper.heightProperty());
separator.setWidth(1); separator.setWidth(1);
separator.setFill(Color.GRAY);
titleWrapper.setRight(separator); titleWrapper.setRight(separator);
} }
titleContainer.setLeft(titleWrapper); titleContainer.setLeft(titleWrapper);

View File

@@ -1,5 +1,6 @@
.root { .root {
-fx-base-color: #5c6bc0; -fx-base-color: #5c6bc0;
-fx-base-darker-color: derive(-fx-base-color, -10%);
-fx-base-check-color: derive(-fx-base-color, 30%); -fx-base-check-color: derive(-fx-base-color, 30%);
-fx-base-text-fill: white; -fx-base-text-fill: white;
} }

View File

@@ -1,5 +1,6 @@
.root { .root {
-fx-base-color: %base-color%; -fx-base-color: %base-color%;
-fx-base-darker-color: derive(-fx-base-color, -10%);
-fx-base-check-color: derive(-fx-base-color, 30%); -fx-base-check-color: derive(-fx-base-color, 30%);
-fx-base-text-fill: %font-color%; -fx-base-text-fill: %font-color%;
} }

View File

@@ -104,6 +104,14 @@
-jfx-subtitle-fill: gray; -jfx-subtitle-fill: gray;
} }
.window-title-bar .separator {
-fx-fill: -fx-base-darker-color;
}
.darker-fill {
-fx-fill: -fx-base-darker-color;
}
/******************************************************************************* /*******************************************************************************
* * * *
* JFX Tab Pane * * JFX Tab Pane *

View File

@@ -41,7 +41,7 @@
</VBox> </VBox>
</graphic> </graphic>
</JFXButton> </JFXButton>
<Rectangle fx:id="separator" translateX="95" height="57" fill="gray" width="1" mouseTransparent="true"/> <Rectangle fx:id="separator" translateX="95" height="57" styleClass="darker-fill" width="1" mouseTransparent="true"/>
<JFXButton prefWidth="230" prefHeight="55" buttonType="RAISED" styleClass="jfx-button-raised" <JFXButton prefWidth="230" prefHeight="55" buttonType="RAISED" styleClass="jfx-button-raised"
style="-fx-font-size: 15;" onMouseClicked="#onMenu" fx:id="btnMenu" /> style="-fx-font-size: 15;" onMouseClicked="#onMenu" fx:id="btnMenu" />
</StackPane> </StackPane>