A JavaFX application can manually lay out the UI by setting the position and size properties for each UI element.(JavaFX应用程序可以通过设置每个UI元素的位置和大小属性来手动布局) However, an easier option is to make use of layout panes. (一个简单的选择是使用布局窗格)The JavaFX SDK provides several layout container classes,(JavaFX SDK提供了几种布局容器) called panes(叫做窗格), for the easy setup and management of classic layouts such as rows, columns, stacks, tiles, and others.(为了方便建立和管理典型的布局,比如行,列,堆,另一层,还有其他的) As a window is resized, the layout pane automatically repositions and resizes the nodes that it contains according to the properties for the nodes.(当窗口大小调整的时候,布局窗格自动根据它包含的节点的属性重新放置和调整节点)
This topic provides an overview and a simple example of each of the layout panes provided by the JavaFX layout package. (这个主题提供了一个概括和一些简单的例子,它们是关于JavaFX layout包提供的布局窗格)TheLayoutSample.java file contains the source code for the UI built in this topic.(LayoutSample.java文件包含了这个主题所有建立的UI的源码) TheLayoutSample.zip
file contains the NetBeans IDE project for the sample application.(LayoutSample.zip文件包含了相同程序的NetBeans IDE工程)
BorderPane
The BorderPane
layout pane provides five regions in which to place nodes: top, bottom, left, right, and center.(BorderPane提供了上下左右中五个区域的布局,这个五个区域都可以放置节点)Figure 1-1 shows the type of layout that you can create with a border pane. The regions can be any size. If your application does not need one of the regions, you do not need to define it and no space is allocated for it.(如果你的应用不需要一个区域,你不需要去定义它,这样就没有空间分配给它)
Figure 1-1 Sample Border Pane
A border pane is useful for the classic look of a tool bar at the top, a status bar at the bottom, a navigation panel on the left, additional information on the right, and a working area in the center.(border布局对于传统的风格是很有用的,传统的风格都是工具条在上面状态栏在下面,导航面板在左边,额外的信息在右边,工作区域在中间)
If the window is larger than the space needed for the contents of each region, the extra space is given to the center region by default.(如果窗口大于各个区域的内容所需要的空间,多余的空间默认分配给中间的区域) If the window is smaller than the space needed for the contents of each region, the regions might overlap.(如果窗口小于各个区域的内容所需要的控件,各个区域之间将会重叠) The overlap is determined by the order in which the regions are set.(重叠取决于各个区域被设置的顺序) For example, if the regions are set in the order of left, bottom, and right, when the window is made smaller, the bottom region overlaps the left region and the right region overlaps the bottom region. (例如,如果各个区域被设置的顺序是左边下面右边,当弄小窗口的时候,下面的区域会重叠在左边的区域,右边的区域会重叠下面的区域)If set in the order of left, right, and bottom, when the window is made smaller, the bottom region overlaps both the left and right regions.
Example 1-1 shows the code for creating the border pane that is used for the UI that is built by the Layout Sample application. The methods that create the layout panes used in each region are described in the remaining sections of this topic.