JavaFX自定义listView [英] JavaFX custom listView
本文介绍了JavaFX自定义listView的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我想问一下用JavaFX中的自定义对象制作ListView的最佳方法，我想要一个每个项目看起来像这样的列表:
I wanted to ask the best way to make a ListView with custom objects in JavaFX, I want a list that each item looks like this:
我搜索后发现，大多数人都是使用cell factory方法来做到这一点的.还有其他方法吗?例如使用自定义fxml?
I searched and found that most people do it with the cell factory method. Is ther any other way? For example with a custome fxml?
这是我的fmxl存档
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.ListView?>
<?import javafx.scene.control.Menu?>
<?import javafx.scene.control.MenuBar?>
<?import javafx.scene.control.MenuItem?>
<?import javafx.scene.control.SplitPane?>
<?import javafx.scene.layout.AnchorPane?>
<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="557.0" prefWidth="1012.0" style="-fx-background-color: #0288D1;" xmlns="http://javafx.com/javafx/9.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="desktop_tasker.FXMLTaskerController">
<children>
<SplitPane dividerPositions="0.5" layoutX="-8.0" layoutY="35.0" prefHeight="529.0" prefWidth="1027.0" style="-fx-background-color: #EEEEEE;" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="28.0">
<items>
<AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0">
<children>
<ListView fx:id="list_todo" onEditStart="#handleButtonAction" prefHeight="527.0" prefWidth="502.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" />
</children></AnchorPane>
<AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="527.0" prefWidth="640.0">
<children>
<ListView fx:id="list_done" onEditStart="#handleButtonAction" prefHeight="527.0" prefWidth="502.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" />
</children></AnchorPane>
</items>
</SplitPane>
<MenuBar prefHeight="30.0" prefWidth="1012.0">
<menus>
<Menu mnemonicParsing="false" text="File">
<items>
<MenuItem mnemonicParsing="false" text="Close" />
</items>
</Menu>
<Menu mnemonicParsing="false" text="Edit">
<items>
<MenuItem mnemonicParsing="false" text="Delete" />
</items>
</Menu>
<Menu mnemonicParsing="false" text="Help">
<items>
<MenuItem mnemonicParsing="false" text="About" />
</items>
</Menu>
</menus>
</MenuBar>
</children>
</AnchorPane>
这是我的对象任务:
import java.text.SimpleDateFormat;
import java.util.Date;
/**
* Created by Usuario on 26/10/2017.
*/
public class Task implements Comparable<Task> {
private String title;
private String attendant;
private String comment;
private String description;
private int priority;
private String creationDate;
private boolean state;
private boolean visible;
public Task(String title, String attendant, String comment, String description, int priority) {
this.title = title;
this.attendant = attendant;
this.comment = comment;
this.description = description;
this.priority = priority;
this.creationDate = setCreationDate();
this.state = false;
this.visible = true;
}
public Task(String title, String attendant, String comment, String description, int priority, String date, boolean state, boolean visible) {
this.title = title;
this.attendant = attendant;
this.comment = comment;
this.description = description;
this.priority = priority;
this.creationDate = date;
this.state = state;
this.visible = visible;
}
private static String setCreationDate() {
SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
Date date = new Date();
return sdf.format(date);
}
public boolean isVisible() {
return visible;
}
public String getTitle() {
return title;
}
public String getAttendant() {
return attendant;
}
public String getComment() {
return comment;
}
public String getDescription() {
return description;
}
public int getPriority() {
return priority;
}
public String getCreationDate() {
return creationDate;
}
public boolean isState() {
return state;
}
@Override
public String toString() {
return "Task{" +
"title='" + title + '\'' +
", attendant='" + attendant + '\'' +
", comment='" + comment + '\'' +
", description='" + description + '\'' +
", priority=" + priority +
", creationDate='" + creationDate + '\'' +
", state=" + state +
'}';
}
@Override
public boolean equals(Object o) {
if (this == o) return true;
if (o == null || getClass() != o.getClass()) return false;
Task task = (Task) o;
if (priority != task.priority) return false;
if (state != task.state) return false;
if (title != null ? !title.equals(task.title) : task.title != null) return false;
if (attendant != null ? !attendant.equals(task.attendant) : task.attendant != null)
return false;
if (comment != null ? !comment.equals(task.comment) : task.comment != null) return false;
if (description != null ? !description.equals(task.description) : task.description != null)
return false;
return creationDate != null ? creationDate.equals(task.creationDate) : task.creationDate == null;
}
@Override
public int hashCode() {
int result = title != null ? title.hashCode() : 0;
result = 31 * result + (attendant != null ? attendant.hashCode() : 0);
result = 31 * result + (comment != null ? comment.hashCode() : 0);
result = 31 * result + (description != null ? description.hashCode() : 0);
result = 31 * result + priority;
result = 31 * result + (creationDate != null ? creationDate.hashCode() : 0);
result = 31 * result + (state ? 1 : 0);
return result;
}
@Override
public int compareTo( Task task) {
int comparePrior = this.getPriority() - (task.getPriority());
return comparePrior == 0 ? this.getTitle().compareTo(task.getTitle()) : comparePrior;
}
}
我希望这些物品看起来像单独的容器，但是我找不到任何方法.关于使用什么的任何建议?最好的方法是什么?
I want the items to look like individual containers, but I didn't find any way to do it. Any recommendations on what to use? And what's the best way to do it?
推荐答案
这是使用FXML创建自定义ListCell
首先，创建一个控制器来继承ListCell.在此控制器的构造函数中，我们在其视图上加载FXML语句.
First, a controller is created to inherit ListCell. In the constructor of this controller we load the FXML statement on its view.
public class TaskCell extends ListCell<Task> {
@FXML
private Label titleLabel;
@FXML
private Label commentLabel;
@FXML
private Label descriptionLabel;
public TaskCell() {
loadFXML();
}
private void loadFXML() {
try {
FXMLLoader loader = new FXMLLoader(getClass().getResource("task_cell.fxml"));
loader.setController(this);
loader.setRoot(this);
loader.load();
}
catch (IOException e) {
throw new RuntimeException(e);
}
}
@Override
protected void updateItem(Task item, boolean empty) {
super.updateItem(item, empty);
if(empty) {
setText(null);
setContentDisplay(ContentDisplay.TEXT_ONLY);
}
else {
titleLabel.setText(item.getTitle());
commentLabel.setText(item.getComment());
descriptionLabel.setText(item.getDescription());
setContentDisplay(ContentDisplay.GRAPHIC_ONLY);
}
}
}
这是视图- task_cell.fxml
<fx:root type="javafx.scene.control.ListCell" xmlns="http://javafx.com/javafx" xmlns:fx="http://javafx.com/fxml">
<graphic>
<VBox>
<children>
<Label fx:id="titleLabel" />
<VBox>
<children>
<Label fx:id="commentLabel" />
<Label fx:id="descriptionLabel"/>
</children>
</VBox>
</children>
</VBox>
</graphic>
</fx:root>
然后，您需要创建一个可用于创建单元的单元工厂.
Then you need to create a cell factory that can be used to create cells.
public class TaskCellFactory implements Callback<ListView<Task>, ListCell<Task>> {
@Override
public ListCell<Task> call(ListView<Task> param) {
return new TaskCell();
}
}
有了工厂后，我们可以使用ListView#setCellFactory()
Once we have the factory, we can manually submit it to ListView using the ListView#setCellFactory()
public class Controller {
@FXML
private ListView<Task> listView;
@FXML
private void initialize() {
listView.setCellFactory(new TaskCellFactory());
}
}
®我们可以在包含ListView控件的视图的FXML语句中对其进行描述
оr we can describe it in the FXML statement of the view that contains the ListView control
<GridPane fx:controller="sample.Controller" xmlns:fx="http://javafx.com/fxml" alignment="center" hgap="10" vgap="10">
<ListView fx:id="listView" GridPane.columnIndex="0" GridPane.rowIndex="0">
<cellFactory>
<TaskCellFactory />
</cellFactory>
</ListView>
</GridPane>
在第二个版本中，智能想法用<TaskCellFactory />标记了错误的行，但这显然是xml解析器中的错误.
In the second version, the intellij idea marks the wrong line with <TaskCellFactory /> but this is clearly an error in the xml parser.
这篇关于JavaFX自定义listView的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
