Introduction to Node-Centric UIs
Creating a UI in JavaFX is like creating a theater play, in that it typically consists of these very simple steps:
-
프로그램이 실행할 무대를 만든다. The realization of your stage will depend on the platform on which it is deployed (e.g., a desktop, a tablet, or an embedded system).
-
배우들과 시각적으로 반응하는 장치들(노드) 그리고 관객(프로그램 사용자)을 만든다. Like any good set designer in the theater business, good JavaFX developers endeavor to make their scenes visually appealing. To this end, it is often a good idea to collaborate with a graphic designer on your “theater play.”
-
배경에 노드를 만든다. These nodes are subclasses of the
javafx.scene.Node
class, which include UI controls, shapes, Text (a type of shape), images, media players, embedded browsers, and custom UI components that you create. Nodes can also be containers for other nodes, often providing cross-platform layout capabilities. A scene has a scene graph that contains a directed graph of nodes. Individual nodes and groups of nodes can be manipulated in many ways (e.g., moving, scaling, and setting opacity) by changing the values of a very rich set of Node properties. -
무대위의 장치(노드)를 나타내는 변수와 클래스를 만든다. As discussed in Chapter 1, one of the very powerful aspects of JavaFX is binding, which enables the application’s UI to stay in sync easily with the state, or model, of the application.
-
onMousePressed
와 같은 이벤트 핸들러를 만든다. that allow the user to interact with your program. Often these event handlers manipulate instance variables in the model. Many of these handlers require a single abstract method to be implemented, and as a consequence provide a perfect opportunity to use lambda expressions. -
배경을 움직이게 하는 타임라인과 변환을 만든다. For example, you might want the thumbnail images of a list of books to move smoothly across the scene or a page in the UI to fade into view. You might simply want a ping pong ball to move across the scene, bouncing off walls and paddles, which is demonstrated later in this chapter in the section, “The Zen of Node Collision Detection.”
Let’s get started with a closer look at Step 1, in which we examine the capabilities of the stage.
Note: Most of the examples in this chapter are small programs intended to demonstrate UI concepts. For this reason, the model in many of these examples consists of variables appearing in the main program, rather than being contained by separate Java classes (e.g., the AudioConfigModel class in Chapter 1).