tableview - JavaFX 自定义 MasterDetail Pane-6ren

tableview - JavaFX 自定义 MasterDetail Pane

转载作者：行者123 更新时间：2023-12-03 09:13:03

我为我的项目创建了一个自定义的“主从” Pane ，其中我使用了一个拆分 Pane ，每个 Pane 中都有两个锚定 Pane 。其中一个是 TableView，其中填充了 Users (ObservableList)。在每一行(用户)上，我都实现了一个 ChangeListener ，如下所示:

table.getSelectionModel().selectedItemProperty().addListener(listElementChangeListener());

选择该行后，我会为 DetailPane 传递 UserObject，并在 TextFields 中可视化 User 数据> 详细信息。我已经实现了控件，以了解 User 是否在 Detail 中进行修改，如果是，我想阻止 TableView 中的行更改>.

当我修改用户时，我尝试从 TableView 中删除 ChangeListener，但效果不佳。

我正在考虑一个解决方案，例如设置焦点并将其保持在该行上，直到取消或保存修改的 User。

有什么好的解决办法吗？

最佳答案

我可能会以不同的方式处理这个问题。我会将“详细 View ”中的控件双向绑定(bind)到 User 对象中的属性。这样，当用户编辑它们时，它们将在对象(和表)中更新。如果您愿意，还可以提供“取消”按钮以恢复到以前的值。

这是使用此方法的完整解决方案:

用户.java:

package usermasterdetail;

import javafx.beans.property.BooleanProperty;
import javafx.beans.property.SimpleBooleanProperty;
import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;

public class User {

    private final StringProperty firstName = new SimpleStringProperty();
    private final StringProperty lastName = new SimpleStringProperty();
    private final BooleanProperty admin = new SimpleBooleanProperty();

    public User(String firstName, String lastName, boolean admin) {
        setFirstName(firstName);
        setLastName(lastName);
        setAdmin(admin);
    }

    public final StringProperty firstNameProperty() {
        return this.firstName;
    }


    public final String getFirstName() {
        return this.firstNameProperty().get();
    }


    public final void setFirstName(final String firstName) {
        this.firstNameProperty().set(firstName);
    }


    public final StringProperty lastNameProperty() {
        return this.lastName;
    }


    public final String getLastName() {
        return this.lastNameProperty().get();
    }


    public final void setLastName(final String lastName) {
        this.lastNameProperty().set(lastName);
    }


    public final BooleanProperty adminProperty() {
        return this.admin;
    }


    public final boolean isAdmin() {
        return this.adminProperty().get();
    }


    public final void setAdmin(final boolean admin) {
        this.adminProperty().set(admin);
    }

}

DataModel.java:

package usermasterdetail;

import javafx.beans.property.ObjectProperty;
import javafx.beans.property.SimpleObjectProperty;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;

public class DataModel {

    private final ObservableList<User> userList = FXCollections.observableArrayList(
            new User("Jacob", "Smith", false),
            new User("Isabella", "Johnson", true),
            new User("Ethan", "Williams", false),
            new User("Emma", "Jones", true),
            new User("Michael", "Brown", true)
    );

    private final ObjectProperty<User> currentUser = new SimpleObjectProperty<>();

    public final ObjectProperty<User> currentUserProperty() {
        return this.currentUser;
    }


    public final User getCurrentUser() {
        return this.currentUserProperty().get();
    }


    public final void setCurrentUser(final User currentUser) {
        this.currentUserProperty().set(currentUser);
    }


    public ObservableList<User> getUserList() {
        return userList;
    }

}

TableController.java:

package usermasterdetail;

import javafx.fxml.FXML;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.control.cell.CheckBoxTableCell;

public class TableController {

    @FXML
    private TableView<User> table ;
    @FXML
    private TableColumn<User, String> firstNameColumn ;
    @FXML
    private TableColumn<User, String> lastNameColumn ;
    @FXML
    private TableColumn<User, Boolean> adminColumn ;

    private DataModel model ;

    public void initialize() {
        firstNameColumn.setCellValueFactory(cellData -> cellData.getValue().firstNameProperty());
        lastNameColumn.setCellValueFactory(cellData -> cellData.getValue().lastNameProperty());
        adminColumn.setCellValueFactory(cellData -> cellData.getValue().adminProperty());
        adminColumn.setCellFactory(CheckBoxTableCell.forTableColumn(adminColumn));
    }

    public void setDataModel(DataModel dataModel) {
        if (model !=  null) {
            model.currentUserProperty().unbind();
        }
        this.model = dataModel ;
        dataModel.currentUserProperty().bind(table.getSelectionModel().selectedItemProperty());
        table.setItems(model.getUserList());
    }
}

UserEditorController.java:

package usermasterdetail;

import javafx.beans.value.ChangeListener;
import javafx.fxml.FXML;
import javafx.scene.control.CheckBox;
import javafx.scene.control.TextField;

public class UserEditorController {

    @FXML
    private TextField firstNameField ;
    @FXML
    private TextField lastNameField ;
    @FXML
    private CheckBox adminCheckBox ;

    private String cachedFirstName ;
    private String cachedLastName ;
    private boolean cachedAdmin ;

    private ChangeListener<User> userListener = (obs, oldUser, newUser) -> {
        if (oldUser != null) {
            firstNameField.textProperty().unbindBidirectional(oldUser.firstNameProperty());
            lastNameField.textProperty().unbindBidirectional(oldUser.lastNameProperty());
            adminCheckBox.selectedProperty().unbindBidirectional(oldUser.adminProperty());
        }

        if (newUser == null) {
            firstNameField.clear();
            lastNameField.clear();
            adminCheckBox.setSelected(false);
        } else {
            firstNameField.textProperty().bindBidirectional(newUser.firstNameProperty());
            lastNameField.textProperty().bindBidirectional(newUser.lastNameProperty());
            adminCheckBox.selectedProperty().bindBidirectional(newUser.adminProperty());

            cachedFirstName = newUser.getFirstName();
            cachedLastName = newUser.getLastName();
            cachedAdmin = newUser.isAdmin();
        }
    };


    private DataModel model ;

    public void setDataModel(DataModel dataModel) {
        if (this.model != null) {
            this.model.currentUserProperty().removeListener(userListener);
        }
        this.model = dataModel ;
        this.model.currentUserProperty().addListener(userListener);
    }

    @FXML
    private void cancel() {
        firstNameField.setText(cachedFirstName);
        lastNameField.setText(cachedLastName);
        adminCheckBox.setSelected(cachedAdmin);
    }
}

表.fxml:

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.control.TableView?>
<?import javafx.scene.control.TableColumn?>

<StackPane xmlns:fx="http://javafx.com/fxml/1" fx:controller="usermasterdetail.TableController">
    <TableView fx:id="table">
        <columns>
            <TableColumn fx:id="firstNameColumn" text="First Name"/>
            <TableColumn fx:id="lastNameColumn" text="Last Name"/>
            <TableColumn fx:id="adminColumn" text="Administrator"/>
        </columns>
    </TableView>
</StackPane>

用户编辑器.fxml:

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.control.CheckBox?>
<?import javafx.scene.control.Button?>
<?import javafx.geometry.Insets?>

<GridPane xmlns:fx="http://javafx.com/fxml/1" fx:controller="usermasterdetail.UserEditorController"
        hgap="5" vgap="5" alignment="CENTER">

    <columnConstraints>
        <ColumnConstraints halignment="RIGHT" hgrow="NEVER"/>
        <ColumnConstraints halignment="LEFT" hgrow="SOMETIMES"/>
    </columnConstraints>

    <padding>
        <Insets top="5" left="5" bottom="5" right="5"/>
    </padding>

    <Label text="First Name:" GridPane.columnIndex="0" GridPane.rowIndex="0"/>
    <Label text="Last Name:" GridPane.columnIndex="0" GridPane.rowIndex="1"/>
    <Label text="Admin Priviliges:" GridPane.columnIndex="0" GridPane.rowIndex="2"/>

    <TextField fx:id="firstNameField" GridPane.columnIndex="1" GridPane.rowIndex="0"/>
    <TextField fx:id="lastNameField" GridPane.columnIndex="1" GridPane.rowIndex="1"/>
    <CheckBox fx:id="adminCheckBox" GridPane.columnIndex="1" GridPane.rowIndex="2"/>
    <Button text="Cancel" onAction="#cancel" GridPane.columnIndex="0" GridPane.rowIndex="3" GridPane.columnSpan="2"
        GridPane.halignment="CENTER"/>

</GridPane>

MainController.java:

package usermasterdetail;

import javafx.fxml.FXML;

public class MainController {
    @FXML
    private TableController tableController ;
    @FXML
    private UserEditorController editorController ;

    private final DataModel model = new DataModel();

    public void initialize() {
        tableController.setDataModel(model);
        editorController.setDataModel(model);
    }
}

Main.fxml:

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.SplitPane?>

<SplitPane xmlns:fx="http://javafx.com/fxml/1" fx:controller="usermasterdetail.MainController">
    <items>
        <fx:include fx:id="table" source="Table.fxml"/>
        <fx:include fx:id="editor" source="UserEditor.fxml"/>
    </items>
</SplitPane>

最后是 Main.java:

package usermasterdetail;

import java.io.IOException;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) throws IOException {
        primaryStage.setScene(new Scene(FXMLLoader.load(getClass().getResource("Main.fxml")), 800, 600));
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

如果您更喜欢您所描述的用户体验，您可以(如 @SSchuette 在注释中描述的那样)，只需将表的禁用属性绑定(bind)到修改属性即可。这将防止用户在编辑数据时更改选择(即与表中的数据不一致)。为此，您只需要在模型中修改属性:

package usermasterdetail;

import javafx.beans.property.BooleanProperty;
import javafx.beans.property.ObjectProperty;
import javafx.beans.property.SimpleBooleanProperty;
import javafx.beans.property.SimpleObjectProperty;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;

public class DataModel {

    private final ObservableList<User> userList = FXCollections.observableArrayList(
            new User("Jacob", "Smith", false),
            new User("Isabella", "Johnson", true),
            new User("Ethan", "Williams", false),
            new User("Emma", "Jones", true),
            new User("Michael", "Brown", true)
    );

    private final ObjectProperty<User> currentUser = new SimpleObjectProperty<>();

    private final BooleanProperty modifying = new SimpleBooleanProperty();

    public final ObjectProperty<User> currentUserProperty() {
        return this.currentUser;
    }


    public final usermasterdetail.User getCurrentUser() {
        return this.currentUserProperty().get();
    }


    public final void setCurrentUser(final usermasterdetail.User currentUser) {
        this.currentUserProperty().set(currentUser);
    }


    public ObservableList<User> getUserList() {
        return userList;
    }


    public final BooleanProperty modifyingProperty() {
        return this.modifying;
    }



    public final boolean isModifying() {
        return this.modifyingProperty().get();
    }



    public final void setModifying(final boolean modifying) {
        this.modifyingProperty().set(modifying);
    }


}

然后在表 Controller 中您可以将禁用属性绑定(bind)到它:

package usermasterdetail;

import javafx.fxml.FXML;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.control.cell.CheckBoxTableCell;

public class TableController {

    @FXML
    private TableView<User> table ;
    @FXML
    private TableColumn<User, String> firstNameColumn ;
    @FXML
    private TableColumn<User, String> lastNameColumn ;
    @FXML
    private TableColumn<User, Boolean> adminColumn ;

    private DataModel model ;

    public void initialize() {
        firstNameColumn.setCellValueFactory(cellData -> cellData.getValue().firstNameProperty());
        lastNameColumn.setCellValueFactory(cellData -> cellData.getValue().lastNameProperty());
        adminColumn.setCellValueFactory(cellData -> cellData.getValue().adminProperty());
        adminColumn.setCellFactory(CheckBoxTableCell.forTableColumn(adminColumn));
    }

    public void setDataModel(DataModel dataModel) {
        if (model !=  null) {
            model.currentUserProperty().unbind();
        }
        this.model = dataModel ;
        dataModel.currentUserProperty().bind(table.getSelectionModel().selectedItemProperty());
        table.setItems(model.getUserList());
        table.disableProperty().bind(model.modifyingProperty());
    }
}

唯一需要做的地方是确保在数据不同步时将修改属性设置为 true(尽管听起来您已经这样做了):

package usermasterdetail;

import javafx.beans.value.ChangeListener;
import javafx.fxml.FXML;
import javafx.scene.control.CheckBox;
import javafx.scene.control.TextField;

public class UserEditorController {

    @FXML
    private TextField firstNameField ;
    @FXML
    private TextField lastNameField ;
    @FXML
    private CheckBox adminCheckBox ;

    private DataModel model ;

    private ChangeListener<Object> modifyingListener = (obs, oldValue, newValue) -> {
        if (model != null) {
            if (model.getCurrentUser() == null) {
                model.setModifying(false);
            } else {
                model.setModifying(! (model.getCurrentUser().getFirstName().equals(firstNameField.getText())
                        && model.getCurrentUser().getLastName().equals(lastNameField.getText())
                        && model.getCurrentUser().isAdmin() == adminCheckBox.isSelected()));
            }
        }

    };

    private ChangeListener<User> userListener = (obs, oldUser, newUser) -> {
        if (oldUser != null) {
            oldUser.firstNameProperty().removeListener(modifyingListener);
            oldUser.lastNameProperty().removeListener(modifyingListener);
            oldUser.adminProperty().removeListener(modifyingListener);
        }
        if (newUser == null) {
            firstNameField.clear();
            lastNameField.clear();
            adminCheckBox.setSelected(false);
        } else {
            firstNameField.setText(newUser.getFirstName());
            lastNameField.setText(newUser.getLastName());
            adminCheckBox.setSelected(newUser.isAdmin());

            newUser.firstNameProperty().addListener(modifyingListener);
            newUser.lastNameProperty().addListener(modifyingListener);
            newUser.adminProperty().addListener(modifyingListener);
        }
    };


    public void setDataModel(DataModel dataModel) {
        if (this.model != null) {
            this.model.currentUserProperty().removeListener(userListener);
        }
        this.model = dataModel ;
        this.model.currentUserProperty().addListener(userListener);
    }

    public void initialize() {
        firstNameField.textProperty().addListener(modifyingListener);
        lastNameField.textProperty().addListener(modifyingListener);
        adminCheckBox.selectedProperty().addListener(modifyingListener);
    }


    @FXML
    private void cancel() {

        if (model != null) {
            firstNameField.setText(model.getCurrentUser().getFirstName());
            lastNameField.setText(model.getCurrentUser().getLastName());
            adminCheckBox.setSelected(model.getCurrentUser().isAdmin());
        }
    }

    @FXML
    private void update() {
        if (model != null && model.getCurrentUser() != null) {
            model.getCurrentUser().setFirstName(firstNameField.getText());
            model.getCurrentUser().setLastName(lastNameField.getText());
            model.getCurrentUser().setAdmin(adminCheckBox.isSelected());

        }
    }


}

此解决方案需要一个额外的按钮来强制更新数据(和表):

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.control.CheckBox?>
<?import javafx.scene.control.Button?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.layout.HBox?>

<GridPane xmlns:fx="http://javafx.com/fxml/1" fx:controller="usermasterdetail.UserEditorController"
        hgap="5" vgap="5" alignment="CENTER">

    <columnConstraints>
        <ColumnConstraints halignment="RIGHT" hgrow="NEVER"/>
        <ColumnConstraints halignment="LEFT" hgrow="SOMETIMES"/>
    </columnConstraints>

    <padding>
        <Insets top="5" left="5" bottom="5" right="5"/>
    </padding>

    <Label text="First Name:" GridPane.columnIndex="0" GridPane.rowIndex="0"/>
    <Label text="Last Name:" GridPane.columnIndex="0" GridPane.rowIndex="1"/>
    <Label text="Admin Priviliges:" GridPane.columnIndex="0" GridPane.rowIndex="2"/>

    <TextField fx:id="firstNameField" GridPane.columnIndex="1" GridPane.rowIndex="0"/>
    <TextField fx:id="lastNameField" GridPane.columnIndex="1" GridPane.rowIndex="1"/>
    <CheckBox fx:id="adminCheckBox" GridPane.columnIndex="1" GridPane.rowIndex="2"/>
    <HBox spacing="5" alignment="CENTER"  GridPane.columnIndex="0" GridPane.rowIndex="3" GridPane.columnSpan="2">
        <Button text="Update" onAction="#update"/>
        <Button text="Cancel" onAction="#cancel"/>
    </HBox>

</GridPane>

关于tableview - JavaFX 自定义 MasterDetail Pane ，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40106017/

文章推荐： functional-programming - 闭包在函数式编程中的地位

文章推荐：使用 powershell 进行带有校验和的人工上传

文章推荐： r - 使用 RMarkdown 内联结果(测试、描述等)

java - 如何设置两个垂直分割 Pane ，以便拖动每个 Pane 不会影响另一个 Pane ？
我正在尝试设置一个具有三个分割 Pane 的用户界面。前两个是垂直 Pane ，位于屏幕的左侧和右侧。每个拆分的一侧都有一个标题 Pane 。用户可以从这些 Pane 中选择项目以包含在中央 Pane
sql-server - SQL Server Management Studio Pane 设置，始终显示图表 Pane 、条件 Pane 和 SQL Pane
我经常使用 SQL Server Management Studio，并且始终使用以下 Pane 来处理数据:图表、条件和 SQL。 SQL Panes that I always use 目前，我每
Windows 终端，拆分 Pane 但新 Pane 与以前的 Pane 位于同一目录中？
可能是一个有点愚蠢的问题。问题很简单，我倾向于有两个 Pane ，一个用于编写代码，另一个用于编译它。我用 windows 终端 (cmd + vim + Mingw) 做到了这一点，但有些事情困扰着
javascript - 如何更改Leaflet中的多边形 Pane (自定义 Pane )
我想出了如何使用 the Working with Map Panes tutorial 在自定义 Pane 中创建多边形和 this Stack Overflow question及其相关的 Fid
java - 如何将一个 Pane 连接到另一个 Pane
如何将输出连接到 paneWithList？ PaneWithList 在其 JList 上有一个监听器，以便将所选行输出到控制台。如何将该输出定向到输出上的 JTextPane？ PaneWithL
android - 方向从双 Pane 更改为单 Pane
横向和纵向不同布局之间的方向变化似乎很容易，但是我找不到适合我当前情况的解决方案。我想在横向模式下使用带有两个 fragment 的双 Pane 布局 res\layout-land\dashboa
xcode - Xcode右 Pane (实用工具 Pane )不适用？
我在Xcode中使用Swift编程时，当我想使用实用程序 Pane 编辑按钮时，我意识到它变成了“不适用”。属性检查器，连接检查器等全部变为“不适用”，仅快速帮助检查器仍显示。我已选择 Storyb
java - 元素不显示在 Pane 内的 Pane 上
我正在 JavaFX 中编写 vector Canvas ( vector 图形， Canvas 上仅显示形状):好吧，这样您就可以四处移动并放大它。由于翻译时节点左上角的位置发生变化，并且不再响应
JavaFX 将 Pane 悬停在 Pane 上
我有一个带有中心 Pane 的边框 Pane - VBox。VBox 包含一个 GridPane 和一个 VBox Pane 。垂直框(垂直框内的垂直框)最初设置为不可见。我想要做的是，如果将 G
java - 元素不显示在 Pane 内的 Pane 上
我正在 JavaFX 中编写 vector Canvas ( vector 图形， Canvas 上仅显示形状):好吧，这样您就可以四处移动并放大它。由于翻译时节点左上角的位置发生变化，并且不再响应
Java 布局，如何最大化固定高度的 Pane 以及填充屏幕其余部分的 Pane !
简单地说，我想让 java 做我想做的事情，但我无法理解布局管理中的任何其他自动调整大小到它感觉要做的事情。我想要的是一个固定高度的“页脚”和顶部“主”区域，以根据窗口的高度自动调整大小。水平方向
java - 设置堆栈 Pane 中 Pane 的对齐方式
我尝试创建一个在堆栈 Pane 中包含 2 个 Pane 的应用程序。一个 Pane 是主 Pane 并居中，第二个 Pane 较小并停靠在舞台的左下角。问题是我试过使用“setAlignment”
android - 如何在滑动 Pane 布局中将操作栏与 Pane 一起滑动？
我已经在我的第一个 android 应用程序中实现了滑动 Pane 布局，但是当我滑动菜单时，操作栏仍然保持静态，我想实现像 Google+ 应用程序那样的东西在 Stack Overflow 中也
java - 从滚动 Pane 中的文本 Pane 获取文本
我只是 Java 的初学者。这是我的问题: 我用这段代码创建了一个可滚动的文本字段(1): jZone_Text = new JTextPane(); scrollPane = new JScroll
ios - 如何访问导航 Pane (左 Pane )中创建的文件夹的路径？
我在左 Pane 中创建了一个文件夹，其中包含各种图像。它被称为“wikiImages”。如何访问此文件夹或获取此文件夹的路径？我找到了 Bundle.main.resourcePath!，但这似乎
java - 如何更改普通 Pane 的样式(不是布局 Pane )
好吧，我是 JavaFx 的新手，而且我已经很长时间没有使用 Java 了，所以我遇到了很多问题。最大的问题是如何更改该死的 Pane 的背景。下面是Controller类 //Styling pr
java - 滚动 Pane 不会调整大小以适应网格 Pane JavaFX
我正在使用 JavaFX 编写一个程序，其中我有边框 Pane -> 中心 -> VBox -> 滚动 Pane -> 网格 Pane 我希望能够向网格 Pane 添加任意多的行，并让滚动 Pane
html - 如何使左 Pane 扩展到右 Pane 内容的整个高度？
我已经尝试使这项工作 2 天了，并且阅读了许多示例和堆栈溢出问题。我是 html 和 css 的新手，这是我的第 3 天。对于我做错了什么的任何提示或见解，以及一般性评论或批评，我们将不胜感激。我试
java - 在其父 Pane 内设置可拖动 Pane 的边界限制
我有一个位于另一个 Pane 内的可拖动 Pane 。我想让子 Pane 只能在父 Pane 的边界内拖动，但默认情况下，子 Pane 可以拖动到任何地方。如何解决这个问题。最佳答案看看这个dem
JavaFX - 为什么将节点多次添加到一个 Pane 或添加到不同的 Pane 会导致错误？
我现在正在学习基本的 JavaFX，我不明白我正在阅读的书中的这句话:“不，像文本字段这样的节点只能添加到一个 Pane 中一次。添加一个节点多次或不同的 Pane 将导致运行时错误。”从书上提供的U

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

tableview - JavaFX 自定义 MasterDetail Pane