e-virt-table/dist/lib/Paint.d.ts

A powerful data table based on canvas. You can use it as data grid、Microsoft Excel or Google sheets. It supports virtual scroll、cell edit etc.

import { Align, VerticalAlign } from './types';
export type LineOptions = {
    lineCap?: CanvasLineCap;
    lineDash?: number[];
    lineJoin?: CanvasLineJoin;
    borderWidth?: number;
    borderColor?: string | CanvasGradient | CanvasPattern;
    fillColor?: string | CanvasGradient | CanvasPattern;
};
export type ShodowOptions = {
    side: 'left' | 'right' | 'top' | 'bottom';
    shadowWidth: number;
    colorStart: string;
    colorEnd: string;
    fillColor?: string | CanvasGradient | CanvasPattern;
};
export type RectOptions = {
    borderWidth?: number;
    borderColor?: string;
    fillColor?: string;
    radius?: number | [number, number, number, number];
};
export type DrawTextOptions = {
    font?: string;
    color?: string;
    align?: Align;
    padding?: number;
    verticalAlign?: VerticalAlign;
};
export declare class Paint {
    private ctx;
    constructor(target: HTMLCanvasElement);
    scale(dpr: number): void;
    save(): void;
    restore(): void;
    translate(x: number, y: number): void;
    setCursor(cursor?: string): void;
    clear(x?: number, y?: number, width?: number, height?: number): void;
    /**
     * 在 Canvas 上绘制单侧阴影
     * @param {number} x - 矩形的 x 坐标
     * @param {number} y - 矩形的 y 坐标
     * @param {number} width - 矩形的宽度
     * @param {number} height - 矩形的高度
     * @param {string} side - 阴影的位置（'left', 'right', 'top', 'bottom'）
     * @param {number} shadowWidth - 阴影的宽度
     * @param {string} color - 阴影的颜色
     */
    drawShadow(x: number, y: number, width: number, height: number, options: ShodowOptions): void;
    drawLine(points: number[], options: LineOptions): void;
    drawImage(img: CanvasImageSource, x: number, y: number, width: number, height: number): void;
    drawRect(x: number, y: number, width: number, height: number, { borderWidth, borderColor, fillColor, radius }?: RectOptions): void;
    /**
     * 画文本
     * @param text
     * @param x
     * @param y
     * @param width
     * @param height
     * @param options
     * @returns 是否溢出
     */
    drawText(text: string | undefined, x: number, y: number, width: number, height: number, options?: DrawTextOptions): boolean;
    handleEllipsis(text: string, width: number, padding?: number, font?: string): {
        _text: string;
        ellipsis: boolean;
    };
}
export default Paint;