如何在 Vaadin 表中添加新列以及如何在 vaadin 表中放置链接答案

【问题标题】：How to add new Columns to table in Vaadin and how to place a link in vaadin table如何在 Vaadin 表中添加新列以及如何在 vaadin 表中放置链接
【发布时间】：2015-04-29 14:48:58
【问题描述】：

我是 Vaadin 的新手，我创建了一个表，我可以通过 BeanItemCONtainer 填充其中的数据，下面是此代码。

public Component getMainContent(ViewChangeListener.ViewChangeEvent event) {
        List<ExecutionPlanVO> executionPlanVOs = executionPlanDelegate.getExecutionPlans(getSearchVO());
        Table table = new Table();
        BeanItemContainer<ExecutionPlanVO> container = new BeanItemContainer<ExecutionPlanVO>(ExecutionPlanVO.class, executionPlanVOs);
        container.addBean(new ExecutionPlanVO());
        table.setContainerDataSource(container);
        table.setVisibleColumns(
                new Object[] {"billOfladingNo" , "containerNo" , "houseBill" , "carrier" , "customer" , "origin" , "pol" , "transshipment" ,
                        "pod" , "destination" , "start" , "completion" , "status"});
        table.setColumnHeaders(
                new String[] {"Bill Of Lading" , "Container No." , "House Bill" , "Carrier" , "Customer" , "Origin" , "POL" , "Transshipment" ,
                        "POD" , "Destination" , "Start (LT)" , "Completion (LT)" , "Status"});
        table.setStyleName("ep-list-table");
        return table;

    }

我有两个问题， 1. 我想将 billOfladingNo 列更改为链接，当我单击时会执行一些操作？ 2. 我想再添加一个带有几个链接图标的列？

你能帮我如何添加列吗？

提前致谢基兰。

【问题讨论】：

标签： vaadin vaadin7 vaadin4spring

【解决方案1】：

您可以创建一个类来实现 ColumnGenerator 以返回链接和图标。我在下面做了一个示例

class Linker implements ColumnGenerator{

    /**
     * 
     */
    private static final long serialVersionUID = 1L;

    @Override
    public Object generateCell(Table source, Object itemId, Object columnId) {
        // TODO Auto-generated method stub

        Item item = source.getItem(itemId);
        Link link = new Link();
        String linkCaption = item.getItemProperty("billOfladingNo").toString();
        link.setCaption(linkCaption);
        link.setResource(new ExternalResource("http:/www.domain.com/"+linkCaption));
        return link;
    }



}

class LinkIcons implements ColumnGenerator{

    /**
     * 
     */
    private static final long serialVersionUID = 1L;

    @Override
    public Object generateCell(Table source, Object itemId, Object columnId) {
        // TODO Auto-generated method stub

        Label icons = new Label();
        icons.setIcon(FontAwesome.LINK);
        return icons;
    }
}
    table.addGeneratedColumn("billOfLading", new Linker());
table.addGeneratedColumn("link", LinkIcons);

一定要让 bean 的 billoflading 不可见，并将生成的列 ID 添加到表可见 ID。

【讨论】：

【解决方案2】：

取决于你使用的 vaadin 版本 if 7.X.X then:

您可以在容器上设置所选列的类型：

container.addContainerProperty("billOfladingNo", new Link, null);

第一个参数是您的列的属性

第二个是你想要的类型

第三个是默认值

这将使您的列类型：com.vaadin.ui.Link

使用可能的导航创建新链接：

        Link link = new Link("CAPTION", new ExternalResource("URL"));

对于第二个问题，您需要将链接标题设置为接受 HTML，然后设置 FontAwesome 图标 html：

    link.setCaptionAsHtml(true);
    link.setCaption(FontAwesome.ANCHOR.getHtml());

【讨论】：