javafx 根据项目自定义TableCell外观

示例

有时,一列应该显示的内容不仅仅是toString单元格项目的值。在这种情况下,由TableCell的创建cellFactory的会TableColumn被自定义,以根据项目更改布局。

重要说明: TableView仅创建TableCellUI中显示的。单元格内的项目可以更改,甚至变空。程序员需要注意撤消TableCell对删除项的添加所做的任何更改。否则,内容可能仍会显示在“不属于”的单元格中。

在以下示例中,设置项目会导致设置文本以及显示在中的图像ImageView:

image.setImage(item.getEmoji());

setText(item.getValue());

如果该项变为null或单元格为空,则通过将值设置回以下来撤消那些更改null:

setText(null);

image.setImage(null);


以下示例显示了中除文字外的表情符号TableCell。

updateItem每次Cell更改a的项目时都会调用此方法。重写此方法可以对更改做出反应并调整单元格的外观。将侦听器添加到itemProperty()单元的可以是一种替代方法,但是在许多情况下TableCell可以扩展。

物品种类

import javafx.scene.image.Image;

// 枚举提供某些感觉的图像和文本

public enum Feeling {

    HAPPY("happy", "https://upload.wikimedia.org/wikipedia/commons/thumb/8/80/Emojione_1F600.svg/64px-Emojione_1F600.svg.png"),

    SAD("sad", "https://upload.wikimedia.org/wikipedia/commons/thumb/4/42/Emojione_1F62D.svg/64px-Emojione_1F62D.svg.png")

    ;

    private final Image emoji;

    private final String value;

    Feeling(String value, String url) {

        // 在背景中加载图片

        emoji = new Image(url, true);

       this.value= value;

    }

    public Image getEmoji() {

        return emoji;

    }

    public String getValue() {

        return value;

    }

    

}

应用程序类中的代码

import javafx.application.Application;

import javafx.beans.property.ObjectProperty;

import javafx.beans.property.SimpleObjectProperty;

import javafx.collections.FXCollections;

import javafx.event.ActionEvent;

import javafx.event.EventHandler;

import javafx.scene.Node;

import javafx.scene.Scene;

import javafx.scene.control.Button;

import javafx.scene.control.TableCell;

import javafx.scene.control.TableColumn;

import javafx.scene.control.TableView;

import javafx.scene.control.cell.PropertyValueFactory;

import javafx.scene.image.ImageView;

import javafx.scene.layout.HBox;

import javafx.scene.layout.VBox;

import javafx.stage.Stage;

import javafx.util.Callback;

public class EmotionTable extends Application {

    public static class Item {

        private final ObjectProperty<Feeling> feeling;

        public Item(Feeling feeling) {

           this.feeling= new SimpleObjectProperty<>(feeling);

        }

        public final Feeling getFeeling() {

            return this.feeling.get();

        }

        public final void setFeeling(Feeling value) {

            this.feeling.set(value);

        }

        public final ObjectProperty<Feeling> feelingProperty() {

            return this.feeling;

        }

    }

    @Override

    public void start(Stage primaryStage) {

        TableView<Item> table = new TableView<>(FXCollections.observableArrayList(

                new Item(Feeling.HAPPY),

                new Item(Feeling.HAPPY),

                new Item(Feeling.HAPPY),

                new Item(Feeling.SAD),

                null,

                new Item(Feeling.HAPPY),

                new Item(Feeling.HAPPY),

                new Item(Feeling.SAD)

        ));

        EventHandler<ActionEvent> eventHandler = new EventHandler<ActionEvent>() {

            @Override

            public void handle(ActionEvent event) {

                // 根据源用户数据更改表项

                Node source = (Node) event.getSource();

                Feeling targetFeeling = (Feeling) source.getUserData();

                for (Item item : table.getItems()) {

                    if (item != null) {

                        item.setFeeling(targetFeeling);

                    }

                }

            }

        };

        TableColumn<Item, Feeling> feelingColumn = new TableColumn<>("Feeling");

        feelingColumn.setCellValueFactory(new PropertyValueFactory<>("feeling"));

        // 使用自定义表格单元格显示表情符号图像

        feelingColumn.setCellFactory(new Callback<TableColumn<Item, Feeling>, TableCell<Item, Feeling>>() {

            @Override

            public TableCell<Item, Feeling> call(TableColumn<Item, Feeling> param) {

                return new EmojiCell<>();

            }

        });

        table.getColumns().add(feelingColumn);

        Button sunshine = new Button("sunshine");

        Button rain = new Button("rain");

        sunshine.setOnAction(eventHandler);

        rain.setOnAction(eventHandler);

        sunshine.setUserData(Feeling.HAPPY);

        rain.setUserData(Feeling.SAD);

        Scene scene = new Scene(new VBox(10, table, new HBox(10, sunshine, rain)));

        primaryStage.setScene(scene);

        primaryStage.show();

    }

    public static void main(String[] args) {

        launch(args);

    }

}

单元类别

import javafx.scene.control.TableCell;

import javafx.scene.image.ImageView;

public class EmojiCell<T> extends TableCell<T, Feeling> {

    private final ImageView image;

    public EmojiCell() {

        // 将ImageView添加为图形以显示它

        // 到单元格中的文本

        image = new ImageView();

        image.setFitWidth(64);

        image.setFitHeight(64);

        image.setPreserveRatio(true);

        setGraphic(image);

        setMinHeight(70);

    }

    @Override

    protected void updateItem(Feeling item, boolean empty) {

        super.updateItem(item, empty);

        if (empty || item == null) {

            // 回到空单元格的外观

            setText(null);

            image.setImage(null);

        } else {

            // 为非空单元格设置图像和文本

            image.setImage(item.getEmoji());

            setText(item.getValue());

        }

    }

}

           

以上是 javafx 根据项目自定义TableCell外观 的全部内容, 来源链接: utcz.com/z/330666.html

回到顶部