@dcloudio/uni-app-x 0.7.12 → 0.7.14

package/types/uni/uts-plugin-extend/lib/uni-canvas/utssdk/interface.d.ts

@@ -0,0 +1,710 @@
+export interface Uni {
+  /**
+   * 创建 canvas 绘图上下文
+   *
+   * @tutorial-uni-app https://uniapp.dcloud.io/api/canvas/createCanvasContext.html
+   * @tutorial https://doc.dcloud.net.cn/uni-app-x/api/create-canvas-context.html
+   * @tutorial-uni-app-x https://doc.dcloud.net.cn/uni-app-x/api/create-canvas-context.html
+   *
+   * @uniPlatform {
+   *  "app": {
+   *    "android": {
+   *      "osVer": "5.0",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "ios": {
+   *      "osVer": "12.0",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "harmony": {
+   *      "osVer": "3.0",
+   *      "uniVer": "4.24",
+   *      "unixVer": "x"
+   *    }
+   *  },
+   *  "mp": {
+   *    "weixin": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "alipay": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "baidu": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "toutiao": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "lark": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "√"
+   *    },
+   *    "qq": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "kuaishou": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "jd": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    }
+   *  },
+   *  "web": {
+   *    "uniVer": "√",
+   *    "unixVer": "4.0"
+   *  }
+   * }
+   */
+  createCanvasContext: CreateCanvasContext;
+  /**
+   * 把当前画布指定区域的内容导出生成指定大小的图片
+   *
+   * @tutorial-uni-app https://uniapp.dcloud.io/api/canvas/canvasToTempFilePath.html
+   * @uniPlatform {
+   *  "app": {
+   *    "android": {
+   *      "osVer": "5.0",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "ios": {
+   *      "osVer": "12.0",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "harmony": {
+   *      "osVer": "3.0",
+   *      "uniVer": "4.24",
+   *      "unixVer": "x"
+   *    }
+   *  },
+   *  "mp": {
+   *    "weixin": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "alipay": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "baidu": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "toutiao": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "lark": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "√"
+   *    },
+   *    "qq": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "kuaishou": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "jd": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    }
+   *  },
+   *  "web": {
+   *    "uniVer": "√",
+   *    "unixVer": "4.0"
+   *  }
+   * }
+   */
+  canvasToTempFilePath: CanvasToTempFilePath;
+  /**
+   * 描述 canvas 区域隐含的像素数据
+   * @tutorial-uni-app https://uniapp.dcloud.io/api/canvas/canvasGetImageData.html
+   * @uniPlatform {
+   *  "app": {
+   *    "android": {
+   *      "osVer": "5.0",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "ios": {
+   *      "osVer": "12.0",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "harmony": {
+   *      "osVer": "3.0",
+   *      "uniVer": "4.24",
+   *      "unixVer": "x"
+   *    }
+   *  },
+   *  "mp": {
+   *    "weixin": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "alipay": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "baidu": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "toutiao": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "lark": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "√"
+   *    },
+   *    "qq": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "kuaishou": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "jd": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    }
+   *  },
+   *  "web": {
+   *    "uniVer": "√",
+   *    "unixVer": "4.0"
+   *  }
+   * }
+   */
+  canvasGetImageData: CanvasGetImageData;
+  /**
+   * 将像素数据绘制到画布
+   * @tutorial-uni-app https://uniapp.dcloud.io/api/canvas/canvasPutImageData.html
+   * @uniPlatform {
+   *  "app": {
+   *    "android": {
+   *      "osVer": "5.0",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "ios": {
+   *      "osVer": "12.0",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "harmony": {
+   *      "osVer": "3.0",
+   *      "uniVer": "4.24",
+   *      "unixVer": "x"
+   *    }
+   *  },
+   *  "mp": {
+   *    "weixin": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "alipay": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "baidu": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "toutiao": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "lark": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "√"
+   *    },
+   *    "qq": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "kuaishou": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    },
+   *    "jd": {
+   *      "hostVer": "√",
+   *      "uniVer": "√",
+   *      "unixVer": "x"
+   *    }
+   *  },
+   *  "web": {
+   *    "uniVer": "√",
+   *    "unixVer": "4.0"
+   *  }
+   * }
+   */
+  canvasPutImageData: CanvasPutImageData;
+}
+export type CreateCanvasContext = (canvasId: string, componentInstance: any) => CanvasContext;
+
+export interface CanvasGradient {
+  /**
+   * 添加颜色的渐变点
+   */
+  addColorStop(stop: number, color: string): void;
+}
+
+export interface CanvasTextMetrics {
+  /**
+   * 文本的宽度
+   */
+  width: number;
+}
+
+export interface CanvasContext {
+  /**
+   * 填充色
+   */
+  fillStyle: string;
+  /**
+   * 边框颜色
+   */
+  strokeStyle: string;
+  /**
+   * 阴影的模糊级别
+   */
+  shadowBlur: number;
+  /**
+   * 阴影的颜色
+   */
+  shadowColor: string;
+  /**
+   * 阴影相对于形状在水平方向的偏移
+   */
+  shadowOffsetX: number;
+  /**
+   * 阴影相对于形状在竖直方向的偏移
+   */
+  shadowOffsetY: number;
+  /**
+   * 线条的宽度
+   */
+  lineWidth: number;
+  /**
+   * 线条的端点样式
+   * - butt:
+   * - round:
+   * - square:
+   * @type 'butt' | 'round' | 'square'
+   */
+  lineCap: string;
+  /**
+   * 线条的结束交点样式
+   * - bevel:
+   * - round:
+   * - miter:
+   * @type 'bevel' | 'round' | 'miter'
+   */
+  lineJoin: string;
+  /**
+   * 最大斜接长度
+   */
+  miterLimit: number;
+  /**
+   * 透明度
+   */
+  globalAlpha: number;
+  /**
+   * 设置要在绘制新形状时应用的合成操作的类型
+   */
+  globalCompositeOperation: string;
+  /**
+   * 偏移量
+   */
+  lineDashOffset: number;
+  /**
+   * 字体样式
+   */
+  font: string;
+  /**
+   * 设置填充色
+   */
+  setFillStyle(color: CanvasGradient): void;
+  /**
+   * 设置边框颜色
+   */
+  setStrokeStyle(color: string): void;
+  /**
+   * 设置阴影样式
+   */
+  setShadow(offsetX?: number, offsetY?: number, blur?: number, color?: string): void;
+  /**
+   * 创建一个线性的渐变颜色
+   */
+  createLinearGradient(x0: number, y0: number, x1: number, y1: number): CanvasGradient;
+  /**
+   * 创建一个圆形的渐变颜色
+   */
+  createCircularGradient(x: number, y: number, r: number): CanvasGradient;
+  /**
+   * 创建一个颜色的渐变点
+   */
+  addColorStop(stop: number, color: string): void;
+  /**
+   * 设置线条的宽度
+   */
+  setLineWidth(lineWidth: number): void;
+  /**
+   * 设置线条的端点样式
+   */
+  setLineCap(lineCap: string): void;
+  /**
+   * 设置线条的交点样式
+   */
+  setLineJoin(lineJoin: string): void;
+  /**
+   * 设置线条的宽度
+   */
+  setLineDash(pattern: any[], offset: number): void;
+  /**
+   * 设置最大斜接长度
+   */
+  setMiterLimit(miterLimit: number): void;
+  /**
+   * 创建一个矩形
+   */
+  rect(x: number, y: number, width: number, height: number): void;
+  /**
+   * 填充一个矩形
+   */
+  fillRect(x: number, y: number, width: number, height: number): void;
+  /**
+   * 画一个矩形(非填充)
+   */
+  strokeRect(x: number, y: number, width: number, height: number): void;
+  /**
+   * 清除画布上在该矩形区域内的内容
+   */
+  clearRect(x: number, y: number, width: number, height: number): void;
+  /**
+   * 对当前路径中的内容进行填充
+   */
+  fill(): void;
+  /**
+   * 画出当前路径的边框
+   */
+  stroke(): void;
+  /**
+   * 开始创建一个路径
+   */
+  beginPath(): void;
+  /**
+   * 关闭一个路径
+   */
+  closePath(): void;
+  /**
+   * 把路径移动到画布中的指定点，不创建线条
+   */
+  moveTo(x: number, y: number): void;
+  /**
+   * 增加一个新点，然后创建一条从上次指定点到目标点的线
+   */
+  lineTo(x: number, y: number): void;
+  /**
+   * 画一条弧线
+   */
+  arc(x: number, y: number, r: number, sAngle: number, eAngle: number, counterclockwise?: boolean): void;
+  /**
+   * 创建三次方贝塞尔曲线路径
+   */
+  bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): void;
+  /**
+   * 创建二次贝塞尔曲线路径
+   */
+  quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void;
+  /**
+   * 横纵坐标缩放
+   */
+  scale(scaleWidth: number, scaleHeight: number): void;
+  /**
+   * 顺时针旋转当前坐标轴
+   */
+  rotate(rotate: number): void;
+  /**
+   * 对当前坐标系的原点(0, 0)进行变换
+   */
+  translate(x: number, y: number): void;
+  /**
+   * 从原始画布中剪切任意形状和尺寸
+   */
+  clip(): void;
+  /**
+   * 设置字体的字号
+   */
+  setFontSize(fontSize: number): void;
+  /**
+   * 在画布上绘制被填充的文本
+   */
+  fillText(text: string, x: number, y: number, maxWidth?: number): void;
+  /**
+   * 设置文字的对齐
+   */
+  setTextAlign(align: string): void;
+  /**
+   * 设置文字的水平对齐
+   */
+  setTextBaseline(textBaseline: string): void;
+  /**
+   * 绘制图像到画布
+   */
+  drawImage(imageResource: string, dx?: number, dy?: number, dWidth?: number, dHeigt?: number, sx?: number, sy?: number, sWidth?: number, sHeight?: number): void;
+  /**
+   * 设置全局画笔透明度
+   */
+  setGlobalAlpha(alpha: number): void;
+  /**
+   * 保存当前的绘图上下文
+   */
+  save(): void;
+  /**
+   * 恢复之前保存的绘图上下文
+   */
+  restore(): void;
+  /**
+   * 将之前在绘图上下文中的描述（路径、变形、样式）画到 canvas 中
+   */
+  draw(reserve?: boolean, callback?: ((result: any) => void)): void;
+  /**
+   * 测量文本尺寸信息，目前仅返回文本宽度
+   */
+  measureText(text: string): CanvasTextMetrics;
+  /**
+   * 根据控制点和半径绘制圆弧路径
+   */
+  arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void;
+  /**
+   * 给定的 (x, y) 位置绘制文本描边的方法
+   */
+  strokeText(text: string, x: number, y: number, maxWidth?: number): void;
+  /**
+   * 对指定的图像创建模式的方法，可在指定的方向上重复元图像
+   */
+  createPattern(image: string, repetition: string): void;
+  /**
+   * 使用矩阵重新设置（覆盖）当前变换的方法
+   */
+  setTransform(scaleX: number, skewX: number, skewY: number, scaleY: number, translateX: number, translateY: number): void;
+}
+
+export type CanvasToTempFilePath = (options: CanvasToTempFilePathOptions, componentInstance: any) => void;
+export type CanvasToTempFilePathSuccess = {
+  /**
+   * 导出生成的图片路径
+   */
+  tempFilePath: string
+};
+export type CanvasToTempFilePathSuccessCallback = (result: CanvasToTempFilePathSuccess) => void;
+export type CanvasToTempFilePathFail = UniError;
+export type UniError = {
+  errSubject: string,
+  errCode: number,
+  errMsg: string,
+  data?: object | null,
+  cause?: any | null
+};
+export type CanvasToTempFilePathFailCallback = (result: CanvasToTempFilePathFail) => void;
+export type CanvasToTempFilePathComplete = any;
+export type CanvasToTempFilePathCompleteCallback = (result: CanvasToTempFilePathComplete) => void;
+export type CanvasToTempFilePathOptions = {
+  /**
+   * 画布x轴起点（默认0）
+   */
+  x?: number | null,
+  /**
+   * 画布y轴起点（默认0）
+   */
+  y?: number | null,
+  /**
+   * 画布宽度（默认为canvas宽度-x）
+   */
+  width?: number | null,
+  /**
+   * 画布高度（默认为canvas高度-y）
+   */
+  height?: number | null,
+  /**
+   * 输出图片宽度（默认为 width * 屏幕像素密度）
+   */
+  destWidth?: number | null,
+  /**
+   * 输出图片高度（默认为 height * 屏幕像素密度）
+   */
+  destHeight?: number | null,
+  /**
+   * 画布标识，传入 <canvas/> 的 canvas-id
+   */
+  canvasId: string,
+  /**
+   * 目标文件的类型，默认为 'png'
+   */
+  fileType?: string | null,
+  /**
+   * 图片的质量，取值范围为 (0, 1]，不在范围内时当作1.0处理
+   */
+  quality?: number | null,
+  /**
+   * 接口调用成功的回调函数
+   */
+  success?: CanvasToTempFilePathSuccessCallback | null,
+  /**
+   * 接口调用失败的回调函数
+   */
+  fail?: CanvasToTempFilePathFailCallback | null,
+  /**
+   * 接口调用结束的回调函数（调用成功、失败都会执行）
+   */
+  complete?: CanvasToTempFilePathCompleteCallback | null
+};
+export type CanvasGetImageData = (options: CanvasGetImageDataOptions) => void;
+export type CanvasGetImageDataSuccess = {
+  /**
+   * 回调信息
+   */
+  errMsg: string,
+  /**
+   * 图像数据矩形的宽度
+   */
+  width: number,
+  /**
+   * 图像数据矩形的高度
+   */
+  height: number,
+  /**
+   * 图像像素点数据，一维数组，每四项表示一个像素点的rgba
+   */
+  data: any[]
+};
+export type CanvasGetImageDataSuccessCallback = (result: CanvasGetImageDataSuccess) => void;
+export type CanvasGetImageDataFail = UniError;
+export type CanvasGetImageDataFailCallback = (result: CanvasGetImageDataFail) => void;
+export type CanvasGetImageDataComplete = any;
+export type CanvasGetImageDataCompleteCallback = (result: CanvasGetImageDataComplete) => void;
+export type CanvasGetImageDataOptions = {
+  /**
+   * 画布标识，传入 <canvas/> 的 canvas-id
+   */
+  canvasId: string,
+  /**
+   * 将要被提取的图像数据矩形区域的左上角 x 坐标
+   */
+  x?: number | null,
+  /**
+   * 将要被提取的图像数据矩形区域的左上角 y 坐标
+   */
+  y?: number | null,
+  /**
+   * 将要被提取的图像数据矩形区域的宽度
+   */
+  width?: number | null,
+  /**
+   * 将要被提取的图像数据矩形区域的高度
+   */
+  height?: number | null,
+  /**
+   * 接口调用成功的回调函数
+   */
+  success?: CanvasGetImageDataSuccessCallback | null,
+  /**
+   * 接口调用失败的回调函数
+   */
+  fail?: CanvasGetImageDataFailCallback | null,
+  /**
+   * 接口调用结束的回调函数（调用成功、失败都会执行）
+   */
+  complete?: CanvasGetImageDataCompleteCallback | null
+};
+export type CanvasPutImageData = (options: CanvasPutImageDataOptions) => void;
+export type CanvasPutImageDataSuccess = {};
+export type CanvasPutImageDataSuccessCallback = (result: CanvasPutImageDataSuccess) => void;
+export type CanvasPutImageDataFail = UniError;
+export type CanvasPutImageDataFailCallback = (result: CanvasPutImageDataFail) => void;
+export type CanvasPutImageDataComplete = any;
+export type CanvasPutImageDataCompleteCallback = (result: CanvasPutImageDataComplete) => void;
+export type CanvasPutImageDataOptions = {
+  /**
+   * 画布标识，传入 <canvas/> 的 canvas-id
+   */
+  canvasId: string,
+  /**
+   * 图像像素点数据，一维数组，每四项表示一个像素点的rgba
+   */
+  data?: (any[]) | null,
+  /**
+   * 源图像数据在目标画布中的位置偏移量（x 轴方向的偏移量）
+   */
+  x?: number | null,
+  /**
+   * 源图像数据在目标画布中的位置偏移量（y 轴方向的偏移量）
+   */
+  y?: number | null,
+  /**
+   * 源图像数据矩形区域的宽度
+   */
+  width?: number | null,
+  /**
+   * 源图像数据矩形区域的高度
+   */
+  height?: number | null,
+  /**
+   * 接口调用成功的回调函数
+   */
+  success?: CanvasPutImageDataSuccessCallback | null,
+  /**
+   * 接口调用失败的回调函数
+   */
+  fail?: CanvasPutImageDataFailCallback | null,
+  /**
+   * 接口调用结束的回调函数（调用成功、失败都会执行）
+   */
+  complete?: CanvasPutImageDataCompleteCallback | null
+};