JavaFX UI - 9.Scroll Pane

Scroll pane은 UI 요소들에 대한 scrollable view를 제공한다. 이 컨트롤은 사용자들이 뷰포트를 panning 하거나 scroll bar를 이용하여 내부 컨텐츠를 스크롤할 수 있도록 해준다.

아래 화면은 디폴트 세팅 값을 가지고 이미지 컨텐츠를 추가한 scroll pane 예시이다.

 

1. Creating a Scroll Pane

 Example 9-1 Using a Scroll Pane to View an Image 

ScrollPane의 setContent 메서드는 scroll pane의 컨텐트로 사용될 node를 정의하기 위해 사용된다. 여기에는 오직 한 개의 노드 만이 지정될 수 있다. 하나 이상의 컴포넌트를 가진 scrollable view를 만들기 위해서는 layout 컨테이너 또는 Group 클래스를 사용한다. Scroll pane의 컨텐트 상의 마우스 드래그를 통해 이미지를 스크롤하기 위해서는 setPannable 메서드를 사용한다.


2. Setting the Scroll Bar Policy for a Scroll Pane

ScrollPane 클래스는 scroll bar가 언제 보여질 지에 대한 정책들(always, never, only when they are needed)을 제공한다. 이러한 정책을 설정하기 위하여 setHbarPolicy와 setVbarPolicy 메서드를 사용한다.

Example 9-2 Setting the Horizontal and Vertical Scroll Bar Policies

 

결과적으로 보여지는 화면은 아래와 같다.




3. Resizing Components in the Scroll Pane

 UI를 디자인할 때, scroll pane 내의 컴포넌트가 scroll pane의 너비와 높이에 맞도록 사이즈 재조정이 필요할 때가 있다. 이 때 setFitToWidth 또는 setFitToHeight 메서드를 사용할 수 있다.

아래 화면은 setFitToWidth 메서드를 통해 내부 컴포넌트의 너비 크기가 scroll pane의 너비에 맞게 재조정되도록 설정한 화면이다. 수평 스크롤이 생기지 않음을 확인할 수 있다.




디폴트로 FIT_TO_WIDTH와 FIT_TO_HEIGHT 프로퍼티 값은 모두 false 이며, scroll pane 내의 resizable 컴포넌트들은 원래의 크기를 유지할 것이다. 위의 화면에 나오는 scroll pane에서 setFitToWidth(true) 로 설정하는 코드가 빠진다면 아래와 같은 모습이 될 것이다.