TornadoFX - View 적용

[출처 - 이 글은 tornadofx-guide르 통해 공부한 내용을 정리한 글입니다. 더 정확한 내용은 https://edvin.gitbooks.io/tornadofx-guide/part1/3.%20Components.html 에서 확인 하실 수 있습니다.]

 

TornadoFX에서 View는 root에서 시작하여 JavaFX 노드의 계층 구조를 포함합니다. 그리고 생성한 특정 View는(이전 Code에서 예를 들면 MyView) 오직 한개이기 때문에, 효과적으로 sigleton으로 만들수 있습니다.

또한, TornadoFX는 scope를 지원하기 때문에 view,Fragment, Controller의 컬랙션을 개별 인스턴스로 그룹하여 구분할 수 있어 View가 scope안의 singleton으로 생성 됩니다. 

 

그럼 간단한 top bottom 을 이용해 보겠습니다.

 

여기서는 root를 BorderPane 로 사용하여 top과 bottom에 label을 적용할 것입니다. (BorderPane은 간단하게 아래와 같이 top, bottom, left, Right, center로 구분되는 Pane입니다.)

 

 

Code는 다음과 같습니다.

class MasterView : View(){
    override val root = borderpane {
        top<TopView>()
        bottom<BottomView>()
    }
}
class TopView : View(){
    override val root = label("Top View" )
}
class BottomView : View(){
    override  val root = label ("Bottom View")
}
class TBApp : App(MasterView::class)

위와 같이 code를 만들고 이전 실행하면(실행 방법은 2019/10/07 - [프로그래밍/kotlin] - TornadoFX 동작시키기) 

이렇게 보면 머가 바뀐지 알 수 없지만 화면을 키우면 

이렇게 Top과 Bottom 영역에 label이 적용됨을 확인 할 수 있습니다.

이전 MyApp(2019/10/07 - [프로그래밍/kotlin] - TornadoFX 동작시키기)은 화면을 키우면 

이런 형태이므로, BorderPane에 Top 과 Bottom에 잘 적용된 것을 확인 할 수 있습니다.

이 외에도 find와 inject을 사용하여 위의 top bottom을 구현할 수 있습니다. code는 다음과 같습니다.

class TopView : View(){
    override val root = label("Top View" )
}
class BottomView : View(){
    override  val root = label ("Bottom View")
}
class MasterView : View(){
    private val topView = find(TopView::class)
    private val bottomView: BottomView by inject<BottomView>()
    override val root = borderpane {
        top = topView.root
        bottom = bottomView.root
    }
}
class TBApp : App(MasterView::class)

위의 TopView를 만들어서 find를 통하여 topView 파라미터에 적용을 하고 by inject을 사용하여 bottomView 파라미터에 BottomView를 적용합니다. (by inject는 by를 통하여 BottomView 생성을 inject에 위임하는 것입니다.)

이렇게 code 작성후 실행하면 위와 동일한 결과가 나옴을 확인 할 수 있습니다.