GWT动态调整大小的标头

时间:2015-05-22 13:57:10

标签: java javascript gwt

处理在datagrid中显示数据的程序。成功创建了类似Excel的拖放重新调整大小的标头。程序还包含用于在列表中添加或删除列的选项。问题如下:

添加或删除新列时,已调整大小的列的宽度会缩小。这个bug几乎肯定来自创建标题的类。当网格中只有几列时,可拖动区域(光标图标更改为调整大小光标)从列之间的确切中点向左偏移15-20px之间的任何位置。随着列数的增加,此偏移量会逐渐缩小,直到拖动图标出现在列之间的中点上方,应该是这样。

我使用地图存储和维护所有列宽,并且可拖动区域偏移的位置,地图中的列宽度测量误差(例如,测量宽度为100px的列可能会被放入地图中70px,这是在添加/删除列上呈现的方式)。在偏移量为零的情况下不会发生这种情况,因此偏移可能是造成我的困境的原因。

当我尝试通过减去"偏移左边"来移动可拖动区域的位置时从我设置它的位置,没有任何反应。

寻找有关如何调整可拖动区域位置的建议。代码如下:

public void onPreviewNativeEvent(NativePreviewEvent event)
    {
        NativeEvent nativeEvent = event.getNativeEvent();
        nativeEvent.preventDefault();
        nativeEvent.stopPropagation();

        String eventType = nativeEvent.getType();
        int clientX = nativeEvent.getClientX();
        if (eventType.equals("mousemove") && this.mousedown)
        {
            int absoluteLeft = this.el.getAbsoluteLeft();
            int offsetLeft = this.el.getOffsetLeft();
            int newWidth = clientX - absoluteLeft;
            newWidth = newWidth < width ? width : newWidth;
            this.table.setColumnWidth(this.col, newWidth + "px");
            return;
        }

        if (eventType.equals("mousemove") || eventType.equals("mousedown"))
        {
            Element eventTargetEl = nativeEvent.getEventTarget().cast();
            int absoluteLeft = eventTargetEl.getAbsoluteLeft();
            int offsetWidth = eventTargetEl.getOffsetWidth();
            // WIDTH of the clickable location is determined ("width" = constant: 20px)
            if (clientX > (absoluteLeft) + offsetWidth - width)
            {
                if (eventType.equals("mousedown"))
                {
                    this.mousedown = true;
                }
                else
                {
                    //setting cursor icon to col-resize - this MUST relate to draggable area
                    setCursor(this.el, Cursor.COL_RESIZE);
                }
            }
            else
            {
                removeHandler();
                return;
            }
        }

0 个答案:

没有答案