TornadoFX覆蓋布局區域上的子級

Question

我正在嘗試將此 JavaFX類轉換為TornadoFX。 懸停即時通訊無法弄清楚應該如何使用TornadoFX完成protected void layoutChildren() ？

這是我到目前為止的代碼：

class ReversiSquare(x: Int, y: Int) : View() {

    var x by property(x)
    fun xProperty() = getProperty(ReversiSquare::y)

    var y by property(y)
    fun yProperty() = getProperty(ReversiSquare::y)

    var highlight: Region by singleAssign()
    var highlightTransition: FadeTransition by singleAssign()

    val model = ReversiModel

    override val root = region {
        region {
            opacity = 0.0
            style = "-fx-border-width: 3; -fx-border-color: dodgerblue"
            highlight = this
        }
        // todo not sure this works with singleAssign
        highlightTransition = FadeTransition(Duration.millis(200.0), highlight).apply {
            fromValue = 0.0
            toValue = 1.0
        }

        styleProperty().bind(Bindings.`when`(model.legalMove(x, y))
                .then("-fx-background-color: derive(dodgerblue, -60%)")
                .otherwise("-fx-background-color: burlywood"))

        val light = Light.Distant().apply {
            azimuth = -135.0
            elevation = 30.0
        }
        effect = Lighting(light)
        setPrefSize(200.0,200.0)
        this += highlight
        addEventHandler(MouseEvent.MOUSE_ENTERED_TARGET) {
            if(model.legalMove(x ,y).get()) {
                with(highlightTransition) {
                    rate =1.0
                    play()
                }
            }
        }
        addEventHandler(MouseEvent.MOUSE_EXITED_TARGET) {
            with(highlightTransition) {
                rate = -1.0
                play()
            }
        }
        onDoubleClick {
            model.play(x, y)
            highlightTransition.rate = -1.0
            highlightTransition.play()
        }
    }
}

Answer 1

我不確定翻譯成TornadoFX的意思，但是用Kotlin編寫layoutChildren看起來像這樣：

override fun layoutChildren() {
    layoutInArea(highlight, 0.0, 0.0, width, height, baselineOffset, HPos.CENTER, VPos.CENTER);
}

編輯：您將代碼示例更新為視圖，所以我想我現在明白您想要的是:)

首先，請確保View不需要參數，因為這樣將無法注入該視圖。 使用by param()或更好by param()傳遞參數，在View范圍內注入ViewModel，然后將該ViewModel注入您的View。

也許您可以將x和y作為屬性添加到R​​eversiModel？

如果需要創建自定義區域，則可以創建等效於匿名內部類的語言，用Java講：

class ReversiSquare : View() {
    val model: ReversiModel by inject()

    override val root = object : Region() {
        // ...

        override fun layoutChildren() {
            layoutInArea(highlight, 0.0, 0.0, width, height, baselineOffset, HPos.CENTER, VPos.CENTER);
        }
    }
}

要立即打開此視圖，請創建一個新的作用域並將ReversiModel推入其中：

// Create the model, set x, y and other initial state in the model
val model = ReversiModel()
model.x = 42

// Create a new scope and push the ReversiModel into it
val scope = Scope(model)

// Find the ReversiSquare in the new scope
find<ReversiSquare>(scope) {
    // Do something with the sequare, like openWindow() or similar
}