TypeScript类型#

interface BaseOptions {
  id: string
  width: number
  height: number
  x: number
  y: number
  isLock?: boolean
}

type CardData =
  | (BaseOptions & {
      type: 'image'
      image: HTMLImageElement
    })
  | (BaseOptions & {
      type: 'text'
      text: string
      fontSize: number
      fontFamily: string
      color: string
      fontWeight: string
      fontStyle: 'normal' | 'italic'
      decoration: 'none' | 'underline' | 'line-through'
    })

CardData#

• id

  • Type: string
  • Required: true
  • Description: 卡片的唯一标识符，建议使用UUID。

• width

  • Type: number
  • Required: true
  • Description: 卡片的宽度，单位为像素。

• height

  • Type: number
  • Required: true
  • Description: 卡片的高度，单位为像素。

• x

  • Type: number
  • Required: true
  • Description: 卡片在kitBox中的x坐标，单位为像素

• y

  • Type: number
  • Required: true
  • Description: 卡片在kitBox中的y坐标，单位为像素

• isLock

  • Type: boolean
  • Required: false
  • Description: 是否锁定卡片比例

• type

  • Type: 'image' | 'text'
  • Required: true
  • Description: 卡片的类型，分为图片和文字。

• image

  • Type: HTMLImageElement
  • Required: true when type is image
  • Description: 当type为image时，必填，图片对象。

• text

  • Type: string
  • Required: true when type is text
  • Description: 当type为text时，必填，文字内容。

• fontSize

  • Type: number
  • Required: false
  • Description: 当type为text时，必填，文字大小，单位为像素。

• fontFamily

  • Type: string
  • Required: false
  • Description: 当type为text时，可选，文字字体，可以是系统字体或自定义字体。

• color

  • Type: string
  • Required: false
  • Description: 当type为text时，可选，文字颜色，可以使用十六进制颜色值或RGB颜色值。

• fontWeight

  • Type: string
  • Required: false
  • Description: 当type为text时，可选，文字粗细，支持normal和bold。

• fontStyle

  • Type: 'normal' | 'italic'
  • Required: false
  • Description: 当type为text时，可选，文字样式，支持normal和italic。

• decoration

  • Type: 'none' | 'underline' | 'line-through'
  • Required: false
  • Description: 当type为text时，可选，文字装饰，支持none、underline和line-through。