Добавьте стиль границы в VBox в TornadoFX

Question

В представлении для моего приложения TornadoFX у меня есть пограничная панель с VBox слева и справа от вида (ничего в центре).На данный момент каждый VBox имеет один и тот же цвет фона, поэтому они как бы смешиваются.Я хотел бы показать какое-то разделение между двумя VBoxами (т. Е. Либо один VBox имеет немного более темный оттенок, цвет границы или оба).Кто-нибудь знает, как добавить стиль рамки в Vbox?Или добавить цвет фона?

Для пояснения я ищу способ сделать это внутри тела определения класса View, чтобы не использовать CSS или FXML для стилизации.

Answer 1

Лучший способ сделать это - создать безопасную таблицу стилей, в которой вы определяете класс для каждого vbox и назначаете эти классы для vbox.Вот полное приложение с таблицей стилей, определением приложения и основным видом:

class MyApp : App(MainView::class, MyStyles::class)

class MyStyles : Stylesheet() {
    companion object {
        val leftBox by cssclass()
        val rightBox by cssclass()
    }

    init {
        leftBox {
            backgroundColor += c("#cecece")
            borderColor += box(c("#a1a1a1"))
            minWidth = 200.px
        }

        rightBox {
            backgroundColor += c("#fefefe")
            borderColor += box(c("#222222"))
            minWidth = 200.px
        }
    }
}

class MainView : View("My View") {
    override val root = borderpane {
        setPrefSize(800.0, 600.0)

        left {
            vbox {
                addClass(MyStyles.leftBox)
            }
        }
        right {
            vbox {
                addClass(MyStyles.rightBox)
            }
        }
    }
}

Если у вас аллергия на таблицы стилей, вы можете установить этисвойства inline или также используйте встроенную таблицу стилей:

class MainView : View("My View") {
    override val root = borderpane {
        setPrefSize(800.0, 600.0)

        left {
            vbox {
                style {
                    backgroundColor += c("#cecece")
                    borderColor += box(c("#a1a1a1"))
                    minWidth = 200.px
                }
            }
        }
        right {
            vbox {
                style {
                    backgroundColor += c("#fefefe")
                    borderColor += box(c("#222222"))
                    minWidth = 200.px
                }
            }
        }
    }
}

Наконец, вы можете настроить соответствующие свойства узлов вместо применения стилей.Я не буду приводить пример этого, поскольку вы действительно не должны этого делать:)