[]
        
立即下载
(Showing Draft Content)

Forguncy.Forguncy.Plugin.ListViewContext

接口: ListViewContext

Forguncy.Plugin.ListViewContext

表格操作上下文。

属性

cellState

Optional cellState: ListViewCellState

表格单元格状态信息。


cursor

Optional cursor: string

光标样式。

Example

// 在CellTypeBase.onMouseMoveInListView方法中,用户修改该属性的值更改光标。
//例如,自定义选择器,在表格非编辑状态下,鼠标悬停在下拉按钮位置时,希望光标变成pointer。
public getHitTestTypeInListView(x, y, cellRect, context) {
    if (context.cellState.isInvisible ||
        context.cellState.isReadOnly ||
        context.cellState.isDisabled) {
        return null;
    }

    if (this.showDropDownIcon(context) && x > cellRect.x + cellRect.width - this.getIconWidth()) {
        return 'DropDown';
    }
}

public onMouseMoveInListView(hitInfo, context) {
    if (hitInfo?.type === 'DropDown') {
        context.cursor = 'pointer';
    }

    super.onMouseMoveInListView(hitInfo, context);
}

___

### <a id="drawinghelper" name="drawinghelper"></a> drawingHelper

• `Optional` **drawingHelper**: [`ListViewDrawingHelper`](../classes/Forguncy.Forguncy.Plugin.ListViewDrawingHelper)

表格绘制辅助工具。

**`Example`**

```javascript
// 在CellTypeBase.paintInListView方法中,用户可以用drawingHelper辅助绘制。
// 在单元格右侧绘制一个下拉按钮。
paintInListView(ctx, value, cellRect, cellStyle, context) {
    const iconWidth = this.showDropDownIcon(context) ? this.getIconWidth() : 0;
    const textWidth = cellRect.width - iconWidth;

    if (textWidth > 0) {
        const textRect = { ...cellRect };
        textRect.width = textWidth;
        super.paintInListView(ctx, value, textRect, cellStyle, context);
    }

    if (iconWidth > 0) {
        const url = this.getDropDownSvgUrl();
        const iconRect = {
            x: cellRect.x + cellRect.width - this._iconWidth - this._iconPadding,
            y: cellRect.y,
            width: this._iconWidth,
            height: cellRect.height
        };
        context.drawingHelper.paintSvg(url, "#a8abb2", ctx, iconRect, context);
    }
}

___

### <a id="rowindex" name="rowindex"></a> rowIndex

• `Optional` **rowIndex**: `number`

行索引。

___

### <a id="value" name="value"></a> value

• `Optional` **value**: `any`

表格单元格的值。

**`Example`**

```javascript
//在CellTypeBase.onClickInListView方法中,用户修改该属性的值更改单元格的值。
//例如,自定义选择器,在表格非编辑状态下,鼠标点击下拉按钮时,单元格进入编辑状态。点击清除按钮时,清除值。
public getHitTestTypeInListView(x, y, cellRect, context) {
    if (context.cellState.isInvisible ||
        context.cellState.isReadOnly ||
        context.cellState.isDisabled) {
        return null;
    }

    const dropDownRect = this.getDropDownRect(context);
    if (dropDownRect && x > dropDownRect.x && x < dropDownRect.x + dropDownRect.width) {
        return 'DropDown';
    }

    const deleteButtonRect = this.getDeleteButtonRect(context);
    if (deleteButtonRect && x > deleteButtonRect.x && x < deleteButtonRect.x + deleteButtonRect.width) {
        return 'DeleteButton';
    }
}

public onMouseMoveInListView(hitInfo, context) {
    if (hitInfo?.type === 'DropDown' || hitInfo?.type === 'DeleteButton') {
        context.cursor = 'pointer';
    }

    super.onMouseMoveInListView(hitInfo, context);
}

public onClickInListView(hitInfo, context) {
    if (hitInfo?.type === 'DropDown') {
        //使表格当前单元格进入编辑状态。
        this.parentListView.startEdit();
        return;
    }

    if (hitInfo?.type === 'DeleteButton') {
        //如果在onClickInListView方法中修改context.value的值,那么表格会更新该单元格的值。
        context.value = null;
        return;
    }
}