GWT CellList;元素选项之间的程序化滚动

时间:2011-05-17 20:19:04

标签: gwt scroll

我想了解滚动到CellList中特定元素的可用选项吗?目前我在列表中有100个元素,只需单击按钮就可以“跳转”元素,但似乎无法在提供此功能的celllist(或代码)中找到任何方法。

任何想法?

非常感谢,

伊恩。

*的 *修改

下面的工作代码示例;

public class CellListTest implements EntryPoint {

private CellList<String> cellList;
private SingleSelectionModel<String> stringSingleSelectionModel;

/**
 * This is the entry point method.
 */
public void onModuleLoad() {
    cellList = new CellList<String>(new TextCell());
    cellList.setRowData(buildStringList(200));


    cellList.setKeyboardSelectionPolicy(HasKeyboardSelectionPolicy.KeyboardSelectionPolicy.BOUND_TO_SELECTION);

    Button byTen = new Button("Jump Forward 10");
    stringSingleSelectionModel = new SingleSelectionModel<String>();
    cellList.setSelectionModel(stringSingleSelectionModel);
    byTen.addClickHandler(new ClickHandler() {
        public void onClick(ClickEvent event) {
            jumpForward(10);
        }
    });
    byTen.setHeight("30px");
    HTMLPanel htmlPanel = new HTMLPanel("");
    VerticalPanel verticalPanel = new VerticalPanel();
    cellList.setHeight("600px");
    ScrollPanel scrollPanel = new ScrollPanel(cellList);
    verticalPanel.add(byTen);
    verticalPanel.add(scrollPanel);
    htmlPanel.add(verticalPanel);
   RootLayoutPanel.get().add(htmlPanel);
}

final Random random = new Random();
private List<String> buildStringList(int numberToCreate) {
    final ArrayList<String> randomValues = new ArrayList<String>();
    for (int i = 0; i < numberToCreate; i++) {
        randomValues.add(String.valueOf(random.nextInt()));
    }
    return randomValues;
}

private int currentPosition = 0;
private void jumpForward(int toJump) {
    Element rowElement = cellList.getRowElement(currentPosition += toJump);
    rowElement.scrollIntoView();
}

}

2 个答案:

答案 0 :(得分:1)

我认为CellList没有直接用于您的目的。

您可以使用Element的scrollIntoView方法。此方法调整每个可滚动元素的scrollLeft和scrollTop属性,以确保指定的元素完全在视图中。要使用该方法,您需要获取包含要显示的单元格的元素。实现此目的的一种方法是使用CellList public getRowElement(int indexOnPage)。

我还没有尝试过,但我相信以下代码应该有效:

//Ensures cell 22 on page is shown
Element element = myCellList.getRowElement(22);
element.scrollIntoView();

答案 1 :(得分:1)

将元素滚动到视图中是一回事;将键盘焦点更改为特定元素是另一回事。经过深入探索,我发现实现这一目标的最佳方法是触发本机事件以模拟用户按键。

private void hitKeyOnList(int keyCode) {
  NativeEvent keyDownEvent = Document.get().createKeyDownEvent(
    false, false, false, false, keyCode);
  list.getElement().dispatchEvent(keyDownEvent);
}

在上面的代码段中,list变量是对CellList的引用。

因此,要将光标移动到列表的末尾,请执行以下操作:

hitKeyOnList(KeyCodes.KEY_END);

将光标移动到当前具有键盘焦点的下一个项目:

hitKeyOnList(KeyCodes.KEY_DOWN);

此方法适用于所有这些密钥,由AbstractHasData处理:

KeyCodes.KEY_DOWN
KeyCodes.KEY_UP
KeyCodes.KEY_PAGEDOWN
KeyCodes.KEY_PAGEUP
KeyCodes.KEY_HOME
KeyCodes.KEY_END