我有一个有许多列的表视图。我想通过在两个列之间添加一些分隔符或更厚的边框来拆分这些列,以表示一种组。一些简单的东西,比如一条更粗的列线就可以了。我不知道如何在fxml或代码中做到这一点。
mnowg1ta1#
我同意评论中提到的。您需要在列中包含样式类并定义边框宽度。但除此之外,我想让你知道另一个重要的变化,使它更有效。如果只调整边框宽度,最终结果如下所示。(包括较厚的边框以供演示)
.thick-border{ -fx-border-width: 0px 10px 0px 0px; }
如果您注意到的话,从视觉上看,边框宽度仅应用于数据列,而不应用于列标题。这看起来确实有点奇怪:-),但从技术上讲,这工作得非常好,而且边框宽度确实应用于列标题。主要问题是列标题的默认边框颜色是透明的。要解决此问题,还需要包括边框颜色以覆盖列标题边框颜色。
.thick-border{ -fx-border-width: 0px 10px 0px 0px; -fx-border-color: #AAAAAA; }
下面是示例的演示。您可以尝试在css文件中注解边框颜色部分。
import javafx.application.Application; import javafx.beans.property.SimpleStringProperty; import javafx.beans.property.StringProperty; import javafx.beans.value.ObservableValue; import javafx.scene.Scene; import javafx.scene.control.TableColumn; import javafx.scene.control.TableView; import javafx.scene.layout.BorderPane; import javafx.stage.Stage; import java.util.function.Function; public class TableColumnThickBorder_Demo extends Application { @Override public void start(Stage primaryStage) { TableView<Person> tableView = new TableView<>(); tableView.getColumns().add(createCol("First Name", Person::firstNameProperty, 150)); tableView.getColumns().add(createCol("Last Name", Person::lastNameProperty, 150)); tableView.getColumns().add(createCol("Email", Person::emailProperty, 200)); tableView.getItems().addAll( new Person("Jacob", "Smith", "jacob.smith@example.com"), new Person("Isabella", "Johnson", "isabella.johnson@example.com"), new Person("Ethan", "Williams", "ethan.williams@example.com"), new Person("Emma", "Jones", "emma.jones@example.com"), new Person("Michael", "Brown", "michael.brown@example.com") ); Scene scene = new Scene(new BorderPane(tableView), 600, 400); scene.getStylesheets().add(this.getClass().getResource("tablecolumnthickborder_demo.css").toExternalForm()); primaryStage.setScene(scene); primaryStage.setTitle("ThickBorder Demo"); primaryStage.show(); } private TableColumn<Person, String> createCol(String title, Function<Person, ObservableValue<String>> mapper, double size) { TableColumn<Person, String> col = new TableColumn<>(title); col.setCellValueFactory(cellData -> mapper.apply(cellData.getValue())); col.setPrefWidth(size); if(title.equals("First Name")){ col.getStyleClass().add("thick-border"); } return col ; } public class Person { private final StringProperty firstName = new SimpleStringProperty(this, "firstName"); private final StringProperty lastName = new SimpleStringProperty(this, "lastName"); private final StringProperty email = new SimpleStringProperty(this, "email"); public Person(String firstName, String lastName, String email) { this.firstName.set(firstName); this.lastName.set(lastName); this.email.set(email); } public final StringProperty firstNameProperty() { return this.firstName; } public final StringProperty lastNameProperty() { return this.lastName; } public final StringProperty emailProperty() { return this.email; } } public static void main(String[] args) { launch(args); } }
css文件中的代码:
1条答案
按热度按时间mnowg1ta1#
我同意评论中提到的。您需要在列中包含样式类并定义边框宽度。
但除此之外,我想让你知道另一个重要的变化,使它更有效。如果只调整边框宽度,最终结果如下所示。(包括较厚的边框以供演示)
如果您注意到的话,从视觉上看,边框宽度仅应用于数据列,而不应用于列标题。这看起来确实有点奇怪:-),但从技术上讲,这工作得非常好,而且边框宽度确实应用于列标题。主要问题是列标题的默认边框颜色是透明的。
要解决此问题,还需要包括边框颜色以覆盖列标题边框颜色。
下面是示例的演示。您可以尝试在css文件中注解边框颜色部分。
css文件中的代码: