如何在GWTP中创建动态表

Question

我是一个新的GWTP用户，我不知道如何在GWTP中创建一个表。我知道如何在GWT做一个。

// Create a CellTable.
CellTable<Contact> table = new CellTable<Contact>();
// Create name column.
TextColumn<Contact> nameColumn = new TextColumn<Contact>() {
  @Override
  public String getValue(Contact contact) {
    return contact.name;
  }
};

但这在GWTP似乎不起作用。谁能帮我得到GWTP程序中按钮上的值吗？

Answer 1

我知道你一个多星期前就问过这个问题了，但你可能还是会被困在这个问题上的，就这样吧。您只需确保分别在Presenter和View中放置正确的逻辑位。

这与没有GWTP原则上的MVP (模型-视图-演示者)没有什么不同：

Presenter的工作是获取数据以填充CellTable，并将其传递给View。

public class TablePresenter extends Presenter<TablePresenter.MyView, TablePresenter.MyProxy>
{
    public interface MyView extends View
    {
        void addData(List<Contact> accounts); // pass data to view
    }

    // proxy and constructor omitted for brevity...

    @Override
    protected void onReveal()
    {
        super.onReveal();

        // server action to get contacts
        dispatchAsync.execute(new GetContacts(), new AsyncCallback<GetContactsResult>()
        {
            @Override
            public void onSuccess(GetContactsResult result)
            {                   
                getView().addData(result.getContacts());
            }
        });
    }
}

您的View的工作是首先设置CellTable及其Column，以及接收来自Presenter的数据。在这里，我用一个TextColumn和一个Column展示了一个ButtonCell

public class TableView extends View implements TablePresenter.MyView
{
    @UiField
    CellTable<Contact> table;

    // use a dataprovider to hold the data
    private ListDataProvider<Contact> dataProvider = new ListDataProvider<Contact>();

    // COLUMNS
    TextColumn<Contact> nameColumn;
    Column<Contact, String> buttonColumn;

    @Inject
    public AccountsView(Binder uiBinder)
    {
        initWidget(uiBinder.createAndBindUi(this));

        initTable();
    }

    private void initTable()
    {
        nameColumn = new TextColumn<Contact>()
        {
            @Override
            public String getValue(Contact object)
            {
                return object.name;
            }
        };
        // now add the column to the table
        table.addColumn(nameColumn, "Name");

        buttonColumn = new Column<Contact, String>(new ButtonCell())
        {
            // the text of the button
            @Override
            public String getValue(Contact object)
            {
                return "Delete " + object.name;
            }
        };

        // set the button action
        deleteColumn.setFieldUpdater(new FieldUpdater<Contact, String>()
        {
            @Override
            public void update(int index, Contact object, String value)
            {
                // whatever you want to do when you click the button
                Window.alert("You pressed " + object.name);
            }
        });
        fileTable.addColumn(deleteColumn);

        // link dataprovider to the table
        dataProvider.addDataDisplay(table);
    }

    @Override
    public void addData(List<Contact> contacts)
    {
        // clear the dataProvider's list
        dataProvider.getList().clear();

        // pass the data into the list
        dataProvider.setList(contacts);

    }

}

然后在你的UiBinder中：

<g:HTMLPanel>
    <b:CellTable ui:field="table" />
</g:HTMLPanel>