控制器"/>
JavaFX开发桌面,移动端,嵌入式权威指南(六)—— 使用JavaFX的UI控制器
文章目录
- 一、尝试JavaFX UI控制器
- 二、使用JavaFX UI控制器
- 1.创建一个菜单和定义菜单项
- 2.创建一个工具条
- 3.创建一个表格视图
- 4.创建手风琴和定义标题面板
- 5.创建一个树视图
- 6.创建一个列表视图和为其指定一个项目
- 7.创建一个分割面板
- 8.创建一个树形表格视图
- 9.创建一个滚动面板
- 10.使用选择框
- 11.使用菜单按钮
- 12.使用内容按钮
- 13.使用分割线菜单按钮
- 14.定义一个文本框
- 15.使用一个密码框
- 16.创建一个文本域
- 17.创建一个日期选择器和一个颜色选择器
- 18.创建一个滑块
- 19.定义一个进度指示器
- 20.定义一个滚动条
- 21.使用一个进度条
- 22.创建一个HTML编辑器
- 23.创建一个弹出功能
- 24.使用一个WebView
一、尝试JavaFX UI控制器
JavaFX有丰富的JavaFX UI控制器来编写应用程序。有相对简单的TextField控制器,也有复杂的WebView控制器。下面将进行这些控制器的快速学习,并创建一个应用作为例子。这个例子将包含大多数可用的UI控制器。它也是一个切入点你可以用来构建自己的应用程序。
二、使用JavaFX UI控制器
1.创建一个菜单和定义菜单项
MenuItem itemNew = new MenuItem("New...", new ImageView(new Image(getClass().getResourceAsStream("images/paper.png"))));itemNew.setAccelerator(KeyCombination.keyCombination("Ctrl+N"));itemNew.setOnAction(e -> System.out.println(e.getEventType()+ " occurred on MenuItem New"));MenuItem itemSave = new MenuItem("Save");Menu menuFile = new Menu("File");menuFile.getItems().addAll(itemNew, itemSave);MenuItem itemCut = new MenuItem("Cut");MenuItem itemCopy = new MenuItem("Copy");MenuItem itemPaste = new MenuItem("Paste");Menu menuEdit = new Menu("Edit");menuEdit.getItems().addAll(itemCut, itemCopy, itemPaste);MenuBar menuBar = new MenuBar();menuBar.getMenus().addAll(menuFile, menuEdit);
2.创建一个工具条
Button newButton = new Button();//创建图片按钮newButton.setGraphic(new ImageView(new Image(getClass().getResourceAsStream("images/paper.png"))));//创建切换按钮ToggleButton italicButton = new ToggleButton();italicButton.setGraphic(new Circle(8, Color.YELLOW));italicButton.setId("italicButton"); //创建切换按钮组final ToggleGroup alignToggleGroup = new ToggleGroup();ToggleButton leftAlignButton = new ToggleButton();leftAlignButton.setGraphic(new Circle(8, Color.PURPLE));leftAlignButton.setId("leftAlignButton");leftAlignButton.setToggleGroup(alignToggleGroup);ToggleButton centerAlignButton = new ToggleButton();centerAlignButton.setGraphic(new Circle(8, Color.ORANGE));centerAlignButton.setId("centerAlignButton");centerAlignButton.setToggleGroup(alignToggleGroup);ToggleButton rightAlignButton = new ToggleButton();rightAlignButton.setGraphic(new Circle(8, Color.CYAN));rightAlignButton.setId("rightAlignButton");rightAlignButton.setToggleGroup(alignToggleGroup); //创建一个按钮分割线new Separator(Orientation.VERTICAL);
3.创建一个表格视图
TableView table = new TableView(model.getTeamMembers());
TableColumn firstNameColumn = new TableColumn("First Name");
firstNameColumn.setCellValueFactory(new PropertyValueFactory("firstName"));
firstNameColumn.setPrefWidth(180);
TableColumn lastNameColumn = new TableColumn("Last Name");
lastNameColumn.setCellValueFactory(new PropertyValueFactory("lastName"));
lastNameColumn.setPrefWidth(180);
TableColumn phoneColumn = new TableColumn("Phone Number");
phoneColumn.setCellValueFactory(new PropertyValueFactory("phone"));
phoneColumn.setPrefWidth(180);
table.getColumns().addAll(firstNameColumn, lastNameColumn, phoneColumn);
table.getSelectionModel().selectedItemProperty()
.addListener((ObservableValue observable, Object oldValue, Object newValue) -> {
Person selectedPerson = (Person) newValue;
System.out.println(selectedPerson + " chosen in TableView");
});
return table;
4.创建手风琴和定义标题面板
TitledPane paneA = new TitledPane("TitledPane A", new TextArea("TitledPane A content"));
TitledPane paneB = new TitledPane("TitledPane B", new TextArea("TitledPane B content"));
TitledPane paneC = new TitledPane("TitledPane C", new TextArea("TitledPane C content"));
Accordion accordion = new Accordion();
accordion.getPanes().addAll(paneA, paneB, paneC);
accordion.setExpandedPane(paneA);
return accordion;
5.创建一个树视图
TreeItem animalTree = new TreeItem("Animal");
animalTree.getChildren().addAll(new TreeItem("Lion"), new TreeItem("Tiger"), new
TreeItem("Bear"));
TreeItem mineralTree = new TreeItem("Mineral");
mineralTree.getChildren().addAll(new TreeItem("Copper"), new TreeItem("Diamond"), new
TreeItem("Quartz"));
TreeItem vegetableTree = new TreeItem("Vegetable");
vegetableTree.getChildren().addAll(new TreeItem("Arugula"), new TreeItem("Broccoli"),
new TreeItem("Cabbage"));
TreeItem root = new TreeItem("Root");
root.getChildren().addAll(animalTree, mineralTree, vegetableTree);
TreeView treeView = new TreeView(root);
treeView.setMinWidth(150);
treeView.setShowRoot(false);
treeView.setEditable(false);
6.创建一个列表视图和为其指定一个项目
ListView listView = new ListView(model.listViewItems);public ObservableList listViewItems = FXCollections.observableArrayList();
7.创建一个分割面板
SplitPane splitPane = new SplitPane();
splitPane.getItems().addAll(treeView, listView);
8.创建一个树形表格视图
Random random = new Random();TreeItem<Person> root = new TreeItem();for (int i = 0; i < 5; i++) {Person parent = new Person("Parent " + i, "LastName" + i, "Phone" + i);TreeItem<Person> parentItem = new TreeItem(parent);for (int j = 0; j < random.nextInt(4); j++) {Person child = new Person("Child " + i + "-" + j, "LastName" + i, "Phone" + j);TreeItem<Person> childItem = new TreeItem(child);parentItem.getChildren().add(childItem);for (int k = 0; k < random.nextInt(4); k++) {Person grandChild = new Person("Grandchild " + i + "-" + j + "-" + k,"LastName" + i, "Phone" + k);TreeItem<Person> grandChildItem = new TreeItem(grandChild);childItem.getChildren().add(grandChildItem);}}root.getChildren().add(parentItem);}return root;
9.创建一个滚动面板
ScrollPane scrollPane = new ScrollPane(variousControls);scrollPane.setHbarPolicy(ScrollPane.ScrollBarPolicy.NEVER);scrollPane.setVbarPolicy(ScrollPane.ScrollBarPolicy.AS_NEEDED);scrollPane.setOnMousePressed((MouseEvent me) -> {if (me.getButton() == MouseButton.SECONDARY) {contextMenu.show(stage, me.getScreenX(), me.getScreenY());}});
10.使用选择框
final CheckBox checkBox = new CheckBox("CheckBox");
checkBox.setOnAction(e -> {
System.out.print(e.getEventType() + " occurred on CheckBox");
System.out.print(", and selectedProperty is: ");
System.out.println(checkBox.selectedProperty().getValue());
});
11.使用菜单按钮
MenuItem menuA = new MenuItem("MenuItem A");
menuA.setOnAction(e -> System.out.println(e.getEventType() + " occurred on Menu Item A"));
MenuItem menuB = new MenuItem("MenuItem B");
MenuButton menuButton = new MenuButton("MenuButton");
menuButton.getItems().addAll(menuA, menuB);
12.使用内容按钮
MenuItem contextA = new MenuItem("MenuItem A");
contextA.setOnAction(e -> System.out.println(e.getEventType()
+ " occurred on Menu Item A"));
MenuItem contextB = new MenuItem("MenuItem B");
final ContextMenu contextMenu = new ContextMenu(contextA, contextB);
ScrollPane scrollPane = new ScrollPane(variousControls);
...
scrollPane.setOnMousePressed((MouseEvent me) -> {
if (me.getButton() == MouseButton.SECONDARY) {
contextMenu.show(stage, me.getScreenX(), me.getScreenY());
}
});
13.使用分割线菜单按钮
MenuItem splitMenuA = new MenuItem("MenuItem A");
splitMenuA.setOnAction(e -> System.out.println(e.getEventType()
+ " occurred on Menu Item A"));
MenuItem splitMenuB = new MenuItem("MenuItem B");
SplitMenuButton splitMenuButton = new SplitMenuButton(splitMenuA, splitMenuB);
splitMenuButton.setText("SplitMenuButton");
splitMenuButton.setOnAction(e -> System.out.println(e.getEventType()
+ " occurred on SplitMenuButton"));
14.定义一个文本框
final TextField textField = new TextField();
textField.setPromptText("Enter user name");
textField.setPrefColumnCount(16);
textField.textProperty().addListener((ov, oldValue, newValue) -> {
System.out.println("TextField text is: " + textField.getText());
});
15.使用一个密码框
final PasswordField passwordField = new PasswordField();
passwordField.setPromptText("Enter password");
passwordField.setPrefColumnCount(16);
passwordField.focusedProperty().addListener((ov, oldValue, newValue) -> {
if (!passwordField.isFocused()) {
System.out.println("PasswordField text is: "
+ passwordField.getText());
}
});
16.创建一个文本域
final TextField textField = new TextField();
textField.setPromptText("Enter user name");
textField.setPrefColumnCount(16);
textField.textProperty().addListener((ov, oldValue, newValue) -> {
System.out.println("TextField text is: " + textField.getText());
});
17.创建一个日期选择器和一个颜色选择器
LocalDate today = LocalDate.now();
DatePicker datePicker = new DatePicker(today);
datePicker.setOnAction(e -> System.out.println("Selected date: " + datePicker.getValue()));
18.创建一个滑块
final Slider slider = new Slider(-1, model.maxRpm, 0);
slider.setPrefWidth(200);
slider.valueProperty().bindBidirectional(model.rpm);
19.定义一个进度指示器
final ProgressIndicator progressIndicator = new ProgressIndicator();
progressIndicator.setPrefWidth(200);
progressIndicator.progressProperty().bind(model.rpm.divide(model.maxRpm));
20.定义一个滚动条
final ScrollBar scrollBar = new ScrollBar();
scrollBar.setPrefWidth(200);
scrollBar.setMin(-1);
scrollBar.setMax(model.maxKph);
scrollBar.valueProperty().bindBidirectional(model.kph);
21.使用一个进度条
final ProgressBar progressBar = new ProgressBar();
progressBar.setPrefWidth(200);
progressBar.progressProperty().bind(model.kph.divide(model.maxKph));
22.创建一个HTML编辑器
final BorderPane htmlEditorDemo;final HTMLEditor htmlEditor = new HTMLEditor();htmlEditor.setHtmlText("<p>Replace this text</p>");Button viewHtmlButton = new Button("View HTML");htmlEditorDemo = new BorderPane();htmlEditorDemo.setCenter(htmlEditor);htmlEditorDemo.setBottom(viewHtmlButton);
23.创建一个弹出功能
Popup alertPopup = new Popup();htmlLabel = new Label(text);htmlLabel.setWrapText(true);htmlLabel.setMaxWidth(280);htmlLabel.setMaxHeight(140);Button okButton = new Button("OK");okButton.setOnAction(e -> alertPopup.hide());BorderPane borderPane = new BorderPane();borderPane.setCenter(htmlLabel);borderPane.setBottom(okButton);Rectangle rectangle = new Rectangle(300, 200, Color.LIGHTBLUE);rectangle.setArcHeight(20);rectangle.setArcWidth(20);rectangle.setStroke(Color.GRAY);rectangle.setStrokeWidth(2);StackPane contentPane = new StackPane(rectangle, borderPane);alertPopup.getContent().add(contentPane);BorderPane.setAlignment(okButton, Pos.CENTER);BorderPane.setMargin(okButton, new Insets(10, 0, 10, 0));return alertPopup;
24.使用一个WebView
Tab webViewTab = new Tab("WebView");
webViewTab.setContent(webView);
webViewTab.setClosable(false);
webViewTab.setOnSelectionChanged(e -> {
String randomWebSite = model.getRandomWebSite();
if (webViewTab.isSelected()) {
webView.getEngine().load(randomWebSite);
System.out.println("WebView tab is selected, loading: "
+ randomWebSite);
}
});
更多推荐
JavaFX开发桌面,移动端,嵌入式权威指南(六)—— 使用JavaFX的UI控制器
发布评论