原文链接：DOC-03-27 分页控件(Pagination Control) | JavaFX中文资料
JavaFX程序中添加分页（Pagination）控件。它会告诉你如何向程序中添加Pagination控件，管理其分页项，并且使用CSS样式来改变控件中各元素的风格
Pagination控件用于在被拆分为多个小部分的分页内容间进行导航
在触摸式设备上，Pagination控件可以用于在查看一篇文档时翻页或在不同的屏幕之间切换
注意页索引从0开始。因此如果想让第3页被选中，那么你需要将currentPageIndexProperty设置为2。
pagination3控件的页面都是空的，因为没有向其中添加内容。
你无法直接向Pagination控件中添加任何内容项，因为它需要设置一个页面工厂（Page Factory）。使用Pagination类的setPageFactory方法来实现一个页面工厂，这样来定义页面的内容
PageFactory页面工厂类型,页面工厂类的作用就是在分页组件的主视图区域内部展现页面内容，页面内容的生成就是也页面工厂类的作用
实现页面工厂（PageFactory）
setPageFactory方法用于为Pagination控件定义PageFactory实现内容。应用程序开发者需要创建一个回调方法并设置一个PageFactory内容来使用这个回调方法。回调方法会在一个页面被选中时触发。它会加载并返回被选中页面的内容。如果当前被选中的页面索引不存在，则必须返回null值
例子：
在Pagination类的构造方法中可以直接对页数和被选中的页进行定义。另外，你也可以先创建一个Pagination控件，然后再通过setPageCount和setCurrentPageIndex方法来设置页数和被选中页索引。
createPage方法声明了Pagination控件的内容，并且在setPageFactory方法中将其作为Page Factory进行了调用。在createPage方法中创建了超链接和对应的标签内容作为分页显示的主要内容，并且将它们进行了纵向排列，在元素之间设置了5像素的间隔。
当前实现的Pagination控件会在页数超过10时显示10个Page Indicator。如果要改变显示的Page Indicator数目，可以使用Pagination类的setMaxPageIndicatorCount方法。将下面的代码行添加到例中则会显示7个Page Indicator：pagination.setMaxPageIndicatorCount(7)
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Pagination;
import javafx.scene.control.Hyperlink;
import javafx.scene.control.Label;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
public class PaginationSample extends Application {
private Pagination pagination;//分页组件的定义
public static void main(String[] args) throws Exception {
launch(args);
}
public int itemsPerPage() {
return 8;//每页显示条目数
}
//自定义的页面内容创建渲染方法
public VBox createPage(int pageIndex) {
VBox box = new VBox(5);//创建一个垂直布局盒子对象间隙距离为5
int page = pageIndex * itemsPerPage();//页码号*当页条目数量=当前条目起始索引位置
for (int i = page; i < page + itemsPerPage(); i++) {//当起始于当页记录索引位置<下页记录索引位置的时候
VBox element = new VBox();//创建一个垂直盒子布局器对象
Hyperlink link = new Hyperlink("Item " + (i+1));//创建一个超级链接对象
link.setVisited(true);//显示超级链接对象
Label text = new Label("搜索结果"+ link.getText());
element.getChildren().addAll(link, text);//垂直盒子布局器中添加链接和文本标签
box.getChildren().add(element);//scene场景的根布局器中添加垂直盒子布局器对象
}
return box;
}
@Override
public void start(final Stage stage) throws Exception {
pagination = new Pagination(28, 0);//创建一个分页组件
pagination.setStyle("-fx-border-color:red;");//给分页组件添加样式
pagination.setPageFactory((Integer pageIndex) -> createPage(pageIndex));//分页组件设置页面传参交互绑定,将页面传来的pageIndex变量（页码选择器）对应的选择值传给页面内容创建渲染方法
AnchorPane anchor = new AnchorPane();//创建锚点面板
AnchorPane.setTopAnchor(pagination, 10.0);
AnchorPane.setRightAnchor(pagination, 10.0);
AnchorPane.setBottomAnchor(pagination, 10.0);
AnchorPane.setLeftAnchor(pagination, 10.0);
anchor.getChildren().addAll(pagination);//锚点布局面板中添加分页组件
pagination.setMaxPageIndicatorCount(7);//导航条一次最多展示7个页码导航
Scene scene = new Scene(anchor);//场景对象上添加锚点布局面板
stage.setScene(scene);//舞台上添加场景
stage.setTitle("标题");//舞台标题
stage.show();//舞台展现
}
}
————————————
展示了Pagination控件的另外一种用法。在这个程序中的每个页面中都展示了一段文字。其中总共有5段文字，Pagination控件中声明了28个页面。为了避免出现ArrayIndexOutOfBoundsException，程序增加了页面索引检查，并且当页码超过5时让回调方法返回null值
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Pagination;
import javafx.scene.control.TextArea;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
public class PaginationTest extends Application {
private Pagination pagination;//分页器组件的定义性声明
final String[] textPages = new String[]{
"The apple is the pomaceous fruit of the apple tree, species Malus "
+ "domestica in the rose family (Rosaceae). It is one of the most "
+ "widely cultivated tree fruits, and the most widely known of "
+ "the many members of genus Malus that are used by humans. "
+ "The tree originated in Western Asia, where its wild ancestor, "
+ "the Alma, is still found today.",
"The hawthorn is a large genus of shrubs and trees in the rose family,"
+ "Rosaceae, native to temperate regions of the Northern Hemisphere "
+ "in Europe, Asia and North America. The name hawthorn was "
+ "originally applied to the species native to northern Europe, "
+ "especially the Common Hawthorn C. monogyna, and the unmodified "
+ "name is often so used in Britain and Ireland.",
"The ivy is a flowering plant in the grape family (Vitaceae) native to "
+ " eastern Asia in Japan, Korea, and northern and eastern China. "
+ "It is a deciduous woody vine growing to 30 m tall or more given "
+ "suitable support, attaching itself by means of numerous small "
+ "branched tendrils tipped with sticky disks.",
"The quince is the sole member of the genus Cydonia and is native to "
+ "warm-temperate southwest Asia in the Caucasus region. The "
+ "immature fruit is green with dense grey-white pubescence, most "
+ "of which rubs off before maturity in late autumn when the fruit "
+ "changes color to yellow with hard, strongly perfumed flesh.",
"Aster (syn. Diplopappus Cass.) is a genus of flowering plants "
+ "in the family Asteraceae. The genus once contained nearly 600 "
+ "species in Eurasia and North America, but after morphologic "
+ "and molecular research on the genus during the 1990s, it was "
+ "decided that the North American species are better treated in a "
+ "series of other related genera. After this split there are "
+ "roughly 180 species within the genus, all but one being confined "
+ "to Eurasia."
};
public static void main(String[] args) throws Exception {
launch(args);
}
public int itemsPerPage() {//每页展示一行内容
return 1;
}
public VBox createPage(int pageIndex) {//创建分页显示区域中要显示的页面内容
VBox box = new VBox(5);//创建一个间隔距离为5的垂直盒子布局器组件
int page = pageIndex * itemsPerPage();//求出当前记录的页面上的索引起始值，当前页面码值乘以每页的条目数量
for (int i = page; i < page + itemsPerPage(); i++) {
TextArea text = new TextArea(textPages[i]);//页面上的具体显示内容
text.setWrapText(true);//设置文本环绕包围效果
box.getChildren().add(text);//垂直盒子布局器上添加文本框
}
return box;
}
@Override
public void start(final Stage stage) throws Exception {
pagination = new Pagination(28, 0);//创建一个总页数为28也的分页控件，起始页码索引为0
pagination.setStyle("-fx-border-color:red;");//设置分页组件边框颜色样式
pagination.setPageFactory((Integer pageIndex) -> {//页面页码索引参数会自动在恰当时机传进分页控件，这个是由交互进行时态的控件运行时自动传进来的
if (pageIndex >= textPages.length) {//当当前选中的页码数>文本页内容的条目数
return null;//则返回展示的内容为空
} else {
return createPage(pageIndex);//返回页面要渲染展示的内容
}
});
AnchorPane anchor = new AnchorPane();//创建一个锚点布局面板对象
AnchorPane.setTopAnchor(pagination, 10.0);
AnchorPane.setRightAnchor(pagination, 10.0);
AnchorPane.setBottomAnchor(pagination, 10.0);
AnchorPane.setLeftAnchor(pagination, 10.0);
anchor.getChildren().addAll(pagination);//锚点布局器对象中添加页面分页控件对象
Scene scene = new Scene(anchor, 400, 250);//创建场景对象场景对象上挂载锚点布局对象
stage.setScene(scene);//舞台上挂载场景对象
stage.setTitle("分页组件使用例子");
stage.show();//舞台展现
}
}
重点来了：
有时你无法设置精确的内容项数，因此也就无法计算Pagination控件中的页数。在这种情况下，你可以在Pagination对象的构造方法中加入计算页数的代码。例输出了一个体列表并且通过列表的长度除以每页的行数计算页数
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Pagination;
import javafx.scene.control.Label;
import javafx.scene.control.TextField;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.VBox;
import javafx.scene.text.Font;
import javafx.stage.Stage;
public class Test8 extends Application {
private Pagination pagination;//分页组件的定义
String[] fonts = new String[]{};//展示的文本内容的定义
public static void main(String[] args) throws Exception {
launch(args);
}
public int itemsPerPage() {//每页展示固定的15行
return 15;
}
public VBox createPage(int pageIndex) {
VBox box = new VBox(5);//创建一个垂直布局盒子对象间隙距离为5
int page = pageIndex * itemsPerPage();//页码号*当页条目数量=当前条目起始索引位置
for (int i = page; i < page + itemsPerPage(); i++) {//循环构建渲染出要展示的条目组件
TextField font = new TextField(fonts[i]);//创建一个文本框组件
box.getChildren().add(font);//垂直盒子布局对象中添加要显示的内容本例中添加的是文本框组件
}
return box;
}
@Override
public void start(final Stage stage) throws Exception {
fonts = Font.getFamilies().toArray(fonts);//获得系统字体数组并将名称内容赋值给前文定义的String[] fonts
pagination = new Pagination(fonts.length/itemsPerPage(), 0);//通过数据条目算出总页数
pagination.setStyle("-fx-border-color:red;");//给分页组件添加 css样式
pagination.setPageFactory((Integer pageIndex) -> createPage(pageIndex));//给分页组件挂载待展示显示的内容工厂方法
AnchorPane anchor = new AnchorPane();//创建锚点面板
AnchorPane.setTopAnchor(pagination, 10.0);
AnchorPane.setRightAnchor(pagination, 10.0);
AnchorPane.setBottomAnchor(pagination, 10.0);
AnchorPane.setLeftAnchor(pagination, 10.0);
anchor.getChildren().addAll(pagination);//在锚点面板上添加分页组件
Scene scene = new Scene(anchor, 400, 450);//创建场景对象
stage.setScene(scene);//舞台上创建场景对象
stage.setTitle("场景上添加标题");
stage.show();//舞台展现
}
}
——————————————————————
为为Pagination控件设置样式
通过设置样式类为STYLE_CLASS_BULLET，你可以将Pagination控件的Page Indicator自定义为子弹形状，替代原来数字序号Page Indicator。此外你可以修改modena样式表中Pagination的默认样式
修改后的Pagination控件样式
.pagination {
-fx-border-color: #00FF00;
}
.pagination .page {
-fx-background-color: #00FF00;
}
.pagination .pagination-control {
-fx-background-color: #00FF00;
}
.pagination .pagination-control .bullet-button {
-fx-background-color: transparent, #DDF1F8, #0E5D79, white, white;
}
.pagination .pagination-control .bullet-button:selected {
-fx-background-color: transparent, #DDF1F8, #0E5D79, white, #0E5D79;
}
.pagination .pagination-control .left-arrow, .right-arrow{
-fx-background-color: #DDF1F8, #0E5D79;
}
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Pagination;
import javafx.scene.control.TextField;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.VBox;
import javafx.scene.text.Font;
import javafx.stage.Stage;
public class Test8 extends Application {
private Pagination pagination;//分页组件的定义
String[] fonts = new String[]{};//展示的文本内容的定义
public static void main(String[] args) throws Exception {
launch(args);
}
public int itemsPerPage() {//每页展示固定的15行
return 15;
}
public VBox createPage(int pageIndex) {
VBox box = new VBox(5);//创建一个垂直布局盒子对象间隙距离为5
int page = pageIndex * itemsPerPage();//页码号*当页条目数量=当前条目起始索引位置
for (int i = page; i < page + itemsPerPage(); i++) {//循环构建渲染出要展示的条目组件
TextField font = new TextField(fonts[i]);//创建一个文本框组件
box.getChildren().add(font);//垂直盒子布局对象中添加要显示的内容本例中添加的是文本框组件
}
return box;
}
@Override
public void start(final Stage stage) throws Exception {
fonts = Font.getFamilies().toArray(fonts);//获得系统字体数组并将名称内容赋值给前文定义的String[] fonts
pagination = new Pagination(fonts.length/itemsPerPage(), 0);//通过数据条目算出总页数
pagination.setStyle("-fx-border-color:red;");//给分页组件添加 css样式
pagination.setPageFactory((Integer pageIndex) -> createPage(pageIndex));//给分页组件挂载待展示显示的内容工厂方法
AnchorPane anchor = new AnchorPane();//创建锚点面板
AnchorPane.setTopAnchor(pagination, 10.0);
AnchorPane.setRightAnchor(pagination, 10.0);
AnchorPane.setBottomAnchor(pagination, 10.0);
AnchorPane.setLeftAnchor(pagination, 10.0);
anchor.getChildren().addAll(pagination);//在锚点面板上添加分页组件
Scene scene = new Scene(anchor, 400, 450);//创建场景对象
stage.setScene(scene);//舞台上创建场景对象
stage.setTitle("场景上添加标题");
scene.getStylesheets().add("/test8.css");
stage.show();//舞台展现
}
}
除了前面所应用的样式之外，你还可以在程序中考虑使用如下的样式来改变Pagination控件的外观：
· -fx-max-page-indicator-count ——设置Page Indicator的最大数值。
· -fx-arrows-visible ——控制后一页和前一页箭头按钮的可见性，默认为true。
· -fx-tooltip-visible ——控制Page Indicator提示信息框的可见性，默认为true。
· -fx-page-information-visible ——控制页面信息的可见性，默认为true。
· -fx-page-information-alignment ——设置页面信息的对齐方式
扫一扫
197
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
