加载 UI 并仅在数据准备就绪时渲染组件（网格）

Question

我正在尝试加载 UI 除了我的网格，因为它花费了太多时间。我想加载我的 UI，然后，当我的网格数据准备就绪时，我想显示它。

在我的 UI 上，我有一个组合框。当用户 select 它时，网格将发生变化并具有其他数据。目前：

用户select组合框
我在顶部有一个进度条，UI没有改变
当数据提供者有数据时，UI 发生变化，网格获取新信息。

我想要什么：

用户select组合框
UI 变化，我只能看到组合框（以及可选的空网格）
当数据提供者有数据时，它填充网格。

我的代码是：

regionSelection = new ComboBox<>(IStringConstants.REGION_COMBO_LABEL);
regionSelection.setItems(InstanceUtil.getRegions());
regionSelection.setSelectedItem(Regions.EU_CENTRAL_1.getName());
regionSelection.setEmptySelectionAllowed(false);
regionSelection.addValueChangeListener(new HasValue.ValueChangeListener() {
    private static final long serialVersionUID = -5188369735622627751L;

    public void valueChange(HasValue.ValueChangeEvent event) {
refreshGrid();
    }
});
instanceGrid = new Grid<>();
instanceGrid.addColumn(instance -> InstanceUtil.getTagName(instance)).setCaption(IStringConstants.TAGS_LABEL).setId(IStringConstants.TAGS_LABEL);
instanceGrid.addColumn(Instance::getInstanceId).setCaption(IStringConstants.ID_LABEL).setId(IStringConstants.ID_LABEL);
instanceGrid.addColumn(Instance::getInstanceType).setCaption(IStringConstants.TYPE_LABEL);
instanceGrid.addColumn(instance -> instance.getPlacement().getAvailabilityZone()).setCaption(IStringConstants.ZONE_LABEL);
instanceGrid.addColumn(instance -> instance.getState().getName()).setCaption(IStringConstants.STATUS_LABEL).setId(IStringConstants.STATUS_LABEL);
instanceGrid.addColumn(Instance::getPublicIpAddress).setCaption(IStringConstants.IPV4_LABEL).setId(IStringConstants.IPV4_LABEL);

instanceGrid.addColumn(Instance::getKeyName).setCaption(IStringConstants.KEY_NAME_LABEL).setId(IStringConstants.KEY_NAME_LABEL);
instanceGrid.addComponentColumn(this::buildDeleteButton);
ListDataProvider<Instance> dataProvider =DataProvider.ofCollection(ec2Client.getInstances());

instanceGrid.setDataProvider(dataProvider);
layout.addComponent(regionSelection);
layout.addComponent(instanceGrid);

如有任何提示，我们将不胜感激。

编辑，我尝试过但没有成功：

@Asynchronous
private void async(){
    ListDataProvider<Instance> dataProvider =
            DataProvider.ofCollection(ec2Client.getInstances());
    instanceGrid.setDataProvider(dataProvider);
}

Runnable task = () -> getUI().access(() -> {
    ListDataProvider<Instance> dataProvider =DataProvider.ofCollection(ec2Client.getInstances());
    instanceGrid.setDataProvider(dataProvider);
});
Executors.newSingleThreadExecutor().submit(task).isDone();

我也试过了：

ListDataProvider<Instance> dataProvider = new ListDataProvider<>(null);

dataProvider = DataProvider.ofCollection(ec2Client.getInstances());
instanceGrid.setDataProvider(dataProvider);

dataProvider定义了一个成员变量

Answer 1

对于 DataProvider 似乎没有像 DataReadyListener 这样的东西可以帮助解决我认为的问题。

但是如果我稍微简化你的问题并忘记所有关于异步和类似的东西并且只坚持下面的 "requirements"。你能试试这个吗:

What I would like :

The user select the combo box

The UI change, I can only see the combo box (and optionally, the empty grid)

用空的 Collection<Instance> 创建 dataProvider。将其设置为网格 DataProvider。它应该清空网格。

ArrayList<Instance> emptyList = new ArrayList<Instance>();
ListDataProvider<Instance> emptyDataProvider = new ListDataProvider<>(emptyList);
instanceGrid.setDataProvider(emptyDataProvider);

紧接着像现在一样做。创建实际的 DataProvider 并将其设置为网格数据源，例如：

ListDataProvider<Instance> dataProvider =
        DataProvider.ofCollection(ec2Client.getInstances());
instanceGrid.setDataProvider(dataProvider);

when the dataprovider have the data, it fill the grid

希望它能做到这一点。但是即使没有等到数据就绪，网格中也不会有任何旧数据。

我认为这无助于摆脱进度条。但不确定这是否是个好主意。

如果某些默认数据需要，这也可以应用于初始页面加载，或者 DataProvider 的 Collection<Instance> 最初可以是空的，只有在明确选择组合时才会触发加载。

加载 UI 并仅在数据准备就绪时渲染组件（网格）

Load the UI and only render a component (grid) when data is ready

java

vaadin

vaadin8