GUI clean up

* moved some style code to styles.css
* adjust the background colors of the MainView
This commit is contained in:
Jannik 2019-06-08 13:25:55 +02:00
parent 86008828f5
commit a82cef599c
Signed by: Seil0
GPG Key ID: E8459F3723C52C24
8 changed files with 119 additions and 23 deletions

View File

@ -13,6 +13,7 @@ class Main: App(StartupView::class){
override fun start(stage: Stage) {
super.start(stage)
stage.setOnCloseRequest { System.exit(0) }
stage.scene.stylesheets.add("/css/Styles.css")
}
}

View File

@ -93,7 +93,7 @@ class RootController : Controller() {
if (SettingsController.serverAddressIsSet()) {
println("[file] try connect with settings file")
try {
svc.setServerAddress(SettingsController.getServerAddress())
svc.setServerAddress(SettingsController.getServerAddress()) // FIXME this crashes the client when there is either not text or no label!
con = Connection(InetAddress.getByName(SettingsController.getServerAddress()))
con.ping()
println("[file] Connection to Server successful")

View File

@ -31,10 +31,10 @@ class GUIModel constructor(var data: Texture, img: Image) : VBox(){
super.setOnMouseClicked{
if (gmc.isLastSelectedInitialized()) {
gmc.lastSelected.background = Background.EMPTY
this.background = Background(BackgroundFill(Paint.valueOf("#42adaf"), CornerRadii.EMPTY, Insets.EMPTY))
this.background = Background(BackgroundFill(Paint.valueOf("#2b7bbb"), CornerRadii.EMPTY, Insets.EMPTY))
gmc.lastSelected = this
} else {
this.background = Background(BackgroundFill(Paint.valueOf("#42adaf"), CornerRadii.EMPTY, Insets.EMPTY))
this.background = Background(BackgroundFill(Paint.valueOf("#2b7bbb"), CornerRadii.EMPTY, Insets.EMPTY))
gmc.lastSelected = this
}
gmc.previewSelectedAction(data)

View File

@ -82,7 +82,7 @@ class ImportView : View() {
tfName.style = "-fx-text-fill: #b15b2e;"
tfName.promptText = "Name eingeben"
cvTags.style = "-fx-background-color: #3c3f41; -fx-text-inner-color: #b15b2e;"
cvTags.style = "-fx-background-color: #53585b; -fx-text-inner-color: #b15b2e;"
//TODO change color of Chip´s see: https://github.com/jfoenixadmin/JFoenix/blob/master/jfoenix/src/main/resources/com/jfoenix/assets/css/controls/jfx-chip-view.css#L52
btnImport.style = "-fx-button-type: RAISED; -fx-background-color: #b15b2e; -fx-text-fill: #3c3f41;"

View File

@ -61,20 +61,11 @@ class DetailView: View() {
style {
cvTags.minHeight = 135.0
cvTags.paddingAll = 3.0
cvTags.style = "-fx-background-color: #3c3f41; -fx-text-inner-color: #b15b2e;"
cvTags.style = "-fx-background-color: #53585b; -fx-text-inner-color: #b15b2e;"
btnImport.buttonType = JFXButton.ButtonType.RAISED
// TODO move this to a css file
btnImport.style = "-fx-background-color: #F1F1F1;\n" +
" -fx-background-radius: 50px;\n" +
" -fx-pref-height: 50px;\n" +
" -fx-pref-width: 50px;\n" +
" -fx-min-width: -fx-pref-width;\n" +
" -fx-max-width: -fx-pref-width;\n" +
" -fx-min-height: -fx-pref-height;\n" +
" -fx-max-height: -fx-pref-height;\n" +
"-jfx-button-type: RAISED;" +
"-fx-font-size: 25px"
btnImport.styleClass.add("jfx-floating-action-button");
}
}
}

View File

@ -15,8 +15,7 @@ class FolderView : View("FolderView"){
paddingAll = 10.0
prefWidth = 732.0
prefHeight = 401.0
background = Background(BackgroundFill(Paint.valueOf("#cfcfcf"), CornerRadii.EMPTY, Insets.EMPTY))
//background = Background(BackgroundFill(Paint.valueOf("#2b2b2b"), CornerRadii.EMPTY, Insets.EMPTY))
background = Background(BackgroundFill(Paint.valueOf("#2b2b2b"), CornerRadii.EMPTY, Insets.EMPTY))
style {

View File

@ -1,7 +1,6 @@
package org.hso.texturesyncclient.view.mainView
import com.jfoenix.controls.JFXChipView
import com.jfoenix.controls.JFXSpinner
import javafx.geometry.Insets
import javafx.scene.control.ScrollPane
@ -20,19 +19,26 @@ class MainView : View() {
private val mvc: MainViewController by inject()
override val root = borderpane {
background = Background(BackgroundFill(Paint.valueOf("#2b2b2b"), CornerRadii.EMPTY, Insets.EMPTY))
minWidth = 1000.0
maxWidth = 1000.0
minHeight = 500.0
maxHeight = 500.0
left = vbox {
background = Background(BackgroundFill(Paint.valueOf("#2b2b2b"), CornerRadii.EMPTY, Insets.EMPTY))
add(cvSearch)
//background = Background(BackgroundFill(Paint.valueOf("#2b2b2b"), CornerRadii.EMPTY, Insets.EMPTY))
anchorpane{
this.fitToParentWidth()
paddingAll = 5.0
add(cvSearch)
}
anchorpane {
scrollpane {
this.fitToParentSize()
this.vbarPolicy = ScrollPane.ScrollBarPolicy.ALWAYS
add(folderView.root)
style = "-fx-background-color:transparent;"
}
}
@ -41,9 +47,16 @@ class MainView : View() {
right = detailView.root
style {
cvSearch.paddingAll = 7.0
cvSearch.paddingAll = 5.0
cvSearch.minHeight = 70.0
cvSearch.style = "-fx-background-color: #3c3f41; -fx-text-inner-color: #b15b2e;"
cvSearch.style = "-fx-background-color: #53585b; -fx-text-inner-color: #b15b2e;"
cvSearch.anchorpaneConstraints {
topAnchor = 3
bottomAnchor = 3
leftAnchor = 3
rightAnchor = -5
}
}
// actions

View File

@ -0,0 +1,92 @@
/*******************************************************************************
* *
* Scroll Bar *
* *
******************************************************************************/
.scroll-bar:vertical > .track-background, .scroll-bar:horizontal > .track-background {
-fx-background-color: #2b2b2b;
-fx-background-insets: 0.0;
}
.scroll-bar:vertical > .thumb, .scroll-bar:horizontal > .thumb {
-fx-background-color: #53585b;
-fx-background-insets: 0.0;
-fx-background-radius: 1.0;
}
/* Up- and Down-Button Padding */
.scroll-bar:vertical > .increment-button, .scroll-bar:vertical > .decrement-button {
-fx-padding: 5 2 5 2;
}
/* Left- and Right-Button Padding */
.scroll-bar:horizontal > .increment-button, .scroll-bar:horizontal > .decrement-button {
-fx-padding: 2 5 2 5;
}
.scroll-bar > .increment-button, .scroll-bar > .decrement-button, .scroll-bar:hover > .increment-button, .scroll-bar:hover > .decrement-button {
-fx-background-color: transparent;
}
.scroll-bar > .increment-button > .increment-arrow, .scroll-bar > .decrement-button > .decrement-arrow {
-fx-background-color: rgb(150.0, 150.0, 150.0);
}
/* Up Arrow */
.scroll-bar:vertical > .increment-button > .increment-arrow {
-fx-shape: "M298 426h428l-214 214z";
}
/* Down Arrow */
.scroll-bar:vertical > .decrement-button > .decrement-arrow {
-fx-shape: "M298 598l214-214 214 214h-428z";
}
/* Right Arrow */
.scroll-bar:horizontal > .increment-button > .increment-arrow {
-fx-shape: "M0 428l0 -428l214 214l-214 214z";
}
/* Left Arrow */
.scroll-bar:horizontal > .decrement-button > .decrement-arrow {
-fx-shape: "M214 0l0 428l-214 -214l214 -214z";
}
/*******************************************************************************
* *
* Scroll Pane *
* *
******************************************************************************/
.scroll-pane {
-fx-background-insets: 0;
-fx-padding: 0;
}
.scroll-pane:focused {
-fx-background-insets: 0;
}
.scroll-pane .corner {
-fx-background-insets: 0;
}
/*******************************************************************************
* *
* Import Button *
* *
******************************************************************************/
.jfx-floating-action-button {
-fx-background-color: #F1F1F1;
-fx-background-radius: 50px;
-fx-pref-height: 50px;
-fx-pref-width: 50px;
-fx-min-width: -fx-pref-width;
-fx-max-width: -fx-pref-width;
-fx-min-height: -fx-pref-height;
-fx-max-height: -fx-pref-height;
-jfx-button-type: RAISED;
-fx-font-size: 25px
}