0

我正在使用 GWT CellTree 类，我希望能够在选择更改时更新页面上的另一个 UI 元素。

我有这个：

@UiField (provided = true)
CellTree folderTree;

我在页面加载时填充数据，然后我需要@UIiHandler，例如：

@UiHandler("folderTree")
void onTreeCellChange(????? e){
    //update UI    
}

我已经尝试过类似的事情：

ValueChangeEvent<List<Folder>> //List<Folder> being the underlying class for the CellTree.
SelectionHandler<CellTree>
ClickEvent

在上述所有情况下，我都会在表单加载时收到延迟绑定失败。我觉得我错过了一些简单的东西，但似乎无法用我的 google-fu 找到它。

4

1 回答 1

2

您可以将处理程序添加到 CellTree 的 TreeViewModel 的 NodeInfo 中。

这是如何做到的示例：

首先让我们定义什么是文件夹：

// the simplest possible folder even without subfolders just to make example working
public class Folder {
    private String name;

    public Folder(String name) {
        this.name = name;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }
}

假设您的 ui.xml 的一部分如下：

<g:HorizontalPanel>
    <cellview:CellTree ui:field="folderTree"/>
    <g:Label ui:field="folderName"/>
</g:HorizontalPanel>

比你有 UiBinder：

public static interface Binder extends UiBinder<HorizontalPanel, BinderOwner> {}

下面是定义 CellTree 所需的 FolerTreeModel 的方法：

public static class FolderTreeModel implements TreeViewModel {
    private final ListDataProvider<Folder> dataProvider;
    private final CellPreviewEvent.Handler<Folder> folderSelectionHandler;

    public FolderTreeModel(List<Folder> folders, CellPreviewEvent.Handler<Folder> folderSelectionHandler) {
        this.folderSelectionHandler = folderSelectionHandler;
        dataProvider = new ListDataProvider<Folder>(folders);
    }

    @Override
    public <T> TreeViewModel.NodeInfo<?> getNodeInfo(T value) {
        return new DefaultNodeInfo<Folder>(dataProvider, new AbstractCell<Folder>() {
            // simple renderer that renders folder name
            @Override 
            public void render(Context context, Folder value, SafeHtmlBuilder sb) {
                sb.appendEscaped(value.getName());
            }
        }, 
        new SingleSelectionModel<Folder>(), // using single selection model
        folderSelectionHandler, // add handler to the node info
        null); // value updater can be null
    }

    @Override
    public boolean isLeaf(Object value) {
        return false; // I will say that every node is not leaf for simplicity 
    }
 }

还有你的 BinderOwner 类：

public static class BinderOwner {
    @UiField(provided = true)
    CellTree folderTree;
    @UiField
    Label folderName; //your other UI element that you will change: show the name of selected folder

    public BinderOwner() {
         //List of folders to show something
         ArrayList<Folder> folders = new ArrayList<Folder>();
         folders.add(new Folder("A"));
         folders.add(new Folder("B"));
         folders.add(new Folder("C"));

         // define folder tree
         folderTree = new CellTree(new FolderTreeModel(folders, new CellPreviewEvent.Handler<Folder>() {
             // this is your handler
             @Override 
             public void onCellPreview(CellPreviewEvent<Folder> event) {
                 // set folder name to label on folder selection
                 folderName.setText(event.getValue().getName());
             }
         }), null);
    }
}
于 2013-08-13T17:18:57.400 回答