GWT UiBinder Создание пользовательского виджета списка с виджетом пользовательских элементов - PullRequest
Новая
       51

GWT UiBinder Создание пользовательского виджета списка с виджетом пользовательских элементов

0 голосов
/ 06 января 2019

Я создаю пользовательские виджеты, которые содержат флажки, имя, фамилию и метки, которые я называю PersonItem. 

<g:HorizontalPanel verticalAlignment="middle">
    <g:CheckBox ui:field="isSelected" />
    <g:Label ui:field="firstName" text="placeholder" />
    <g:Label ui:field="lastName" text="placeholder" />
</g:HorizontalPanel>

И что я хотел бы сделать, это создать еще один виджет под названием PersonList, который будет содержать все PersonItems как List<PersonItem>

Представление PersonList будет содержать 

@UiField
List<PersonItem> personItems;

Но, к сожалению, я понятия не имею, как сделать XML-файл uiBinder для полей такого типа в PersonList.ui.xml файле. Это вообще возможно?

В дополнение к вопросу, заданному в комментарии: Я хотел бы использовать PersonList просто как тег 

<p:PersonList ui:field="list" />

и PersonList будет предоставлять данные при загрузке основного докладчика.

1 Ответ

0 голосов
/ 07 января 2019

Как предложено @ Marc Ströbel , вы можете использовать CellList для управления списком данных. В будущем вы можете легко добавить, например, пейджер в такой список.

И вы можете использовать любой контейнер для CellList. Вам просто нужно перезаписать метод ячейки (AbstractCell) render().

Пример кода (в качестве контейнера я использовал VerticalPanel): 

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
    xmlns:g="urn:import:com.google.gwt.user.client.ui">

    <g:HTMLPanel>
        <g:VerticalPanel ui:field="container" />
    </g:HTMLPanel>
</ui:UiBinder>

public class PersonList extends Composite {

    private static PersonListUiBinder uiBinder = GWT.create(PersonListUiBinder.class);

    interface PersonListUiBinder extends UiBinder<Widget, PersonList> {}

    @UiField
    VerticalPanel container;

    private CellList<PersonData> list;

    public PersonList() {
        initWidget(uiBinder.createAndBindUi(this));
        list = new CellList<PersonData>(new AbstractCell<PersonData>() {
            @Override
            public void render(Context context, PersonData value, SafeHtmlBuilder sb) {
                container.add(new PersonItem(value));
            }
        });
    }

    public void setData(List<PersonData> values) {
        container.clear();
        list.setRowData(values);
    }
}

Я предположил, что персональные данные (firstName, lastName и т. Д.) Хранятся в PersonData классе.

Теперь вы можете использовать PersonList виджет в UiBinder так, как вы хотели: 

<p:PersonList ui:field="list" />
...