Allineamento testo JavaFX TableView
Come potete vedere nell'immagine l'allineamento del testo per ogni colonna è impostato sull'allineamento a sinistra. C'è un modo per cambiare questo? Finora ho provato all'interno del mio file CSS:
#Cols{
text-align: right;
}
Ho anche provato:
#Cols{
-fx-text-alignment: right;
}
Qualcuno sa come posso cambiare l'allineamento a destra?
6 answers
Allineamento di tutte le colonne della tabella:
A partire da JavaFX-8, è possibile utilizzare il selettore CSS appena definito table-column
,
#my-table .table-column {
-fx-alignment: CENTER-RIGHT;
}
Per JavaFX-2, Per raggiungere questo obiettivo definire un selettore 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;
}
E impostare l'id del tableview.
tableView.setId("my-table");
Allineamento della singola colonna della tabella:
A partire da JavaFX-8, è possibile applicare lo styling direttamente a TableColumn
,
firstTextCol.setStyle( "-fx-alignment: CENTER-RIGHT;");
O con css,
firstTextCol.getStyleClass().add( "custom-align");
Dove
.custom-align {
-fx-alignment: center-right;
}
Per JavaFX-2,
Per applicare allineamenti diversi a colonne diverse è necessario impostare cell factory per quella colonna. Ad esempio, supponiamo che la 1a colonna nella tabella debba essere allineata a sinistra mentre altre colonne utilizzano l'allineamento predefinito della tabella (CENTER-RIGHT
nel tuo caso).
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;
}
});
Una soluzione rapida consiste nel selezionare la colonna in SceneBuilder e aggiungere la proprietà al campo stile
Anche questo ha due anni, ecco un'altra risposta. Per ogni colonna della tabella esiste una classe di stile css predefinita .table-column
, quindi se si desidera modificare l'intera colonna della tabella per giustificare il centro destra è solo necessario inserirla in un foglio di stile o in linea:
.table-column {
-fx-alignment: CENTER_RIGHT;
}
E se hai una colonna che dovrebbe essere allineata in un altro modo, come un'intestazione di riga, nessun problema, allega un id a questa colonna come rowHeading e scrivi nel tuo foglio di stile o stile in linea:
#rowHeading {
-fx-alignment: CENTER_LEFT;
}
E dovrebbe essere lasciato centrato. Non c'è bisogno di codifica enorme.
Ho usato
cell.setAlignment(Pos.CENTER_RIGHT);
Invece di
cell.setStyle("-fx-alignment: CENTER-LEFT;");
Ma se c'è CSS per questo, che non posso mettere fx:id su una colonna e poi mettere l'allineamento per esso in un file CSS? Questo è un sacco di codice sopra solo per impostare l'allineamento delle colonne.
Ho provato questo e funziona
@FXML private TableColumn<BookingData,String>colClientMobile;
//Some code
colClientMobile.setCellFactory(new Callback<TableColumn<BookingData, String>, TableCell<BookingData, String>>() {
@Override
public TableCell<BookingData, String> call(TableColumn<BookingData, String> param) {
return new TableCellFormat();
}
});
private class TableCellFormat extends TableCell<BookingData, String>{
@Override
protected void updateItem(String item, boolean empty) {
super.updateItem(item, empty);
this.setText(item);
this.setAlignment(Pos.CENTER_RIGHT);
}
}
Non potrebbe essere più semplice.
Per una singola colonna (o qualsiasi selezione)...
Dichiara una classe di stile nel tuo fxml
<TableColumn styleClass="centered-table-column" />
Quindi applicare il css
.centered-table-column{
-fx-alignment: center;
}
O per tutte le colonne
.table-column{
-fx-alignment: center;
}