interface.d.ts 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175
  1. /// <reference types="@dcloudio/types" />
  2. import DrawPoster from "../draw-poster";
  3. import { ImageFitOption } from '../extends/draw-function/draw-image-fit';
  4. import { CreateLayerOpts, DrawRowOpt } from "../extends/create-from-list";
  5. import { PainterContainerOption } from "../extends/draw-painter";
  6. /** 绘制容器 */
  7. export declare type Execute = Array<() => Promise<boolean>>;
  8. export interface drawPosterExtends {
  9. from: {
  10. height: number;
  11. padding: number;
  12. margin: number;
  13. };
  14. createLayer: (afferOpts: CreateLayerOpts, rowList: DrawRowOpt[]) => number;
  15. setFromOptions: (opts: Partial<{
  16. height: number;
  17. padding: number;
  18. margin: number;
  19. }>) => void;
  20. gcanvas: {
  21. WeexBridge: any;
  22. Image: any;
  23. enable: (el: any, options: {
  24. bridge?: any;
  25. debug?: boolean;
  26. disableAutoSwap?: any;
  27. disableComboCommands?: any;
  28. }) => Canvas;
  29. };
  30. painter: (option: PainterContainerOption) => void;
  31. }
  32. /** 构建器配置 */
  33. export interface DrawPosterBuildOpts {
  34. /** 查询选择器; 注意不需要加# */
  35. selector: string;
  36. /** 选取组件范围 */
  37. componentThis?: any;
  38. /** 绘制类型为2d绘制, 默认开启, 在微信小程序的时候动态加载 */
  39. type2d?: boolean;
  40. /** 是否在绘制时进行加载提示 */
  41. loading?: boolean;
  42. /** 当存在绘制图片时, 等待绘画完毕的时间(秒)仅App中生效
  43. *
  44. * 具体查看文档说明:https://github.com/TuiMao233/uni-draw-poster
  45. */
  46. drawImageTime?: number;
  47. /** 是否开启调试模式 */
  48. debugging?: boolean;
  49. /** 加载提示文字 */
  50. loadingText?: string;
  51. /** 创建图片提示文字 */
  52. createText?: string;
  53. /** 是否启动gcanvas(nvue) */
  54. gcanvas?: boolean;
  55. }
  56. /** 绘制换行配置 */
  57. export interface FillWarpTextOpts {
  58. text: string;
  59. maxWidth?: number;
  60. lineHeight?: number;
  61. layer?: number;
  62. x?: number;
  63. y?: number;
  64. splitText?: string;
  65. notFillText?: boolean;
  66. }
  67. /** 绘制二维码配置 */
  68. export interface DrawQrCodeOpts {
  69. text: string;
  70. x?: number;
  71. y?: number;
  72. size?: number;
  73. margin?: number;
  74. backgroundColor?: string;
  75. foregroundColor?: string;
  76. }
  77. /** 绘制换行, 单行信息 */
  78. export interface FillWarpTextItemInfo {
  79. text: string;
  80. y: number;
  81. x: number;
  82. }
  83. /** 绘制画笔 */
  84. export interface DrawPosterCanvasCtx extends UniApp.CanvasContext {
  85. [key: string]: any;
  86. createImageData: () => ImageData;
  87. textAlign: CanvasTextDrawingStyles["textAlign"];
  88. textBaseline: CanvasTextDrawingStyles["textBaseline"];
  89. transform: CanvasTransform["transform"];
  90. /** 绘制图片原型 */
  91. drawImageProto: UniApp.CanvasContext['drawImage'];
  92. /** 当前绘制类型 */
  93. drawType: 'context' | 'type2d';
  94. /** 等待绘制图片
  95. *
  96. * 说明文档: https://tuimao233.gitee.io/mao-blog/my-extends/u-draw-poste
  97. */
  98. drawImage(url: string, dx?: number | undefined, dy?: number | undefined, dWidth?: number | undefined, dHeigt?: number | undefined, sx?: number | undefined, sy?: number | undefined, sWidth?: number | undefined, sHeight?: number | undefined): Promise<boolean>;
  99. /** 绘制圆角图片
  100. *
  101. * 说明文档: https://tuimao233.gitee.io/mao-blog/my-extends/u-draw-poste
  102. */
  103. drawRoundImage(url: string, x: number, y: number, w: number, h: number, r?: number): Promise<boolean>;
  104. /** 绘制 Object-Fit 模式图片
  105. *
  106. * 说明文档: https://tuimao233.gitee.io/mao-blog/my-extends/u-draw-poste
  107. */
  108. drawImageFit(url: string, opts?: ImageFitOption): Promise<boolean>;
  109. /** 绘制换行字体
  110. *
  111. * 说明文档: https://tuimao233.gitee.io/mao-blog/my-extends/u-draw-poste
  112. */
  113. fillWarpText(options: FillWarpTextOpts): Array<FillWarpTextItemInfo>;
  114. /** 绘制圆角矩形(原型)
  115. *
  116. */
  117. roundRect(x: number, y: number, w: number, h: number, r: number, fill?: boolean, stroke?: boolean): void;
  118. /** 绘制圆角矩形(填充)
  119. *
  120. * 说明文档: https://tuimao233.gitee.io/mao-blog/my-extends/u-draw-poste
  121. */
  122. fillRoundRect(x: number, y: number, w: number, h: number, r: number): void;
  123. /** 绘制圆角矩形(边框)
  124. *
  125. * 说明文档: https://tuimao233.gitee.io/mao-blog/my-extends/u-draw-poste
  126. */
  127. strokeRoundRect(x: number, y: number, w: number, h: number, r: number): void;
  128. /** 绘制二维码
  129. *
  130. * 说明文档: https://tuimao233.gitee.io/mao-blog/my-extends/u-draw-poste
  131. */
  132. drawQrCode(options: DrawQrCodeOpts): void;
  133. }
  134. /** Canvas2d实例 */
  135. export interface Canvas {
  136. width: number;
  137. height: number;
  138. getContext(contextType: "2d" | "webgl"): DrawPosterCanvasCtx | WebGLRenderingContext;
  139. createImage(): {
  140. src: string;
  141. width: number;
  142. height: number;
  143. onload: () => void;
  144. onerror: () => void;
  145. };
  146. requestAnimationFrame(callback: Function): number;
  147. cancelAnimationFrame(requestID: number): void;
  148. createImageData(): ImageData;
  149. createPath2D(path: Path2D): Path2D;
  150. toDataURL(type: string, encoderOptions: number): string;
  151. }
  152. /** 创建图片路径配置项 */
  153. export interface CreateImagePathOptions {
  154. x?: number;
  155. y?: number;
  156. width?: number;
  157. height?: number;
  158. destWidth?: number;
  159. destHeight?: number;
  160. }
  161. /** 绘制实例扩展配置 */
  162. export interface DrawPosterUseOpts {
  163. name: string;
  164. init?: (dp: InstanceType<typeof DrawPoster>) => void;
  165. handle: (dp: InstanceType<typeof DrawPoster>, ...args: any[]) => any;
  166. createImage?: (dp: InstanceType<typeof DrawPoster>) => void;
  167. [key: string]: any;
  168. }
  169. /** 绘制画笔实例扩展配置 */
  170. export interface DrawPosterUseCtxOpts {
  171. name: string;
  172. init?: (canvas: Canvas, ctx: DrawPosterCanvasCtx) => void;
  173. handle: (canvas: Canvas, ctx: DrawPosterCanvasCtx, ...args: any[]) => any;
  174. [key: string]: any;
  175. }