JavaFX 表视图文本对齐方式

2022-08-31 20:26:42

enter image description here

正如您在图片上看到的,每个列的文本对齐方式都设置为左对齐。有没有办法改变这一点?到目前为止,我已经在我的CSS文件中尝试了:

#Cols{
    text-align: right;
}

我也试过:

#Cols{
    -fx-text-alignment: right;
}

有谁知道如何将对齐方式更改为正确?


答案 1

所有表格列的对齐方式:

从 JavaFX-8 开始,您可以使用新定义的 CSS 选择器 ,table-column

#my-table .table-column {
  -fx-alignment: CENTER-RIGHT;
}

对于 JavaFX-2,要实现这一点,请定义一个 CSS 选择器:

#my-table .table-cell {
    -fx-alignment: CENTER-RIGHT;
     /* The rest is from caspian.css */

    -fx-skin: "com.sun.javafx.scene.control.skin.TableCellSkin";
    -fx-padding: 0.166667em; /* 2px, plus border adds 1px */

    -fx-background-color: transparent;
    -fx-border-color: transparent -fx-table-cell-border-color transparent transparent;
    -fx-border-width: 0.083333em; /* 1 */
    -fx-cell-size: 2.0em; /* 24 */
    -fx-text-fill: -fx-text-inner-color;
}

并设置表视图的 ID。

tableView.setId("my-table");


单个表列的对齐方式:

从 JavaFX-8 开始,您可以将样式直接应用于 、TableColumn

firstTextCol.setStyle( "-fx-alignment: CENTER-RIGHT;");

或使用 css,

firstTextCol.getStyleClass().add( "custom-align");

哪里

.custom-align { 
  -fx-alignment: center-right; 
} 

对于 JavaFX-2,
要将不同的对齐方式应用于不同的列,您需要为该列设置单元格工厂。例如,假设表中的第 1 列应向左对齐,而其他列使用表的默认对齐方式(在您的情况下)。CENTER-RIGHT

firstTextCol.setCellFactory(new Callback<TableColumn, TableCell>() {
            public TableCell call(TableColumn p) {
                TableCell cell = new TableCell<Person, String>() {
                    @Override
                    public void updateItem(String item, boolean empty) {
                        super.updateItem(item, empty);
                        setText(empty ? null : getString());
                        setGraphic(null);
                    }

                    private String getString() {
                        return getItem() == null ? "" : getItem().toString();
                    }
                };

                cell.setStyle("-fx-alignment: CENTER-LEFT;");
                return cell;
            }
        });

答案 2

快速解决方法是在 SceneBuilder 中选择列,然后只需将属性添加到样式字段

enter image description here


推荐