diff --git a/src/editor/core/draw/Draw.ts b/src/editor/core/draw/Draw.ts index a75ec1e..74e3d86 100644 --- a/src/editor/core/draw/Draw.ts +++ b/src/editor/core/draw/Draw.ts @@ -513,7 +513,7 @@ export class Draw { } private _computeRowList(innerWidth: number, elementList: IElement[]) { - const { defaultSize, defaultRowMargin, scale, tdPadding } = this.options + const { defaultSize, defaultRowMargin, scale, tdPadding, defaultTabWidth } = this.options const defaultBasicRowMarginHeight = this.getDefaultBasicRowMarginHeight() const tdGap = tdPadding * 2 const canvas = document.createElement('canvas') @@ -668,6 +668,11 @@ export class Draw { element.width = elementWidth metrics.width = elementWidth metrics.height = height * scale + } else if (element.type === ElementType.TAB) { + metrics.width = defaultTabWidth * scale + metrics.height = defaultSize * scale + metrics.boundingBoxDescent = 0 + metrics.boundingBoxAscent = metrics.height } else { // 设置上下标真实字体尺寸 const size = element.size || this.options.defaultSize @@ -814,6 +819,8 @@ export class Draw { ) { this.textParticle.complete() this.checkboxParticle.render(ctx, element, x, y + offsetY) + } else if (element.type === ElementType.TAB) { + this.textParticle.complete() } else { this.textParticle.record(ctx, element, x, y + offsetY) } diff --git a/src/editor/core/event/CanvasEvent.ts b/src/editor/core/event/CanvasEvent.ts index b51facc..85200b4 100644 --- a/src/editor/core/event/CanvasEvent.ts +++ b/src/editor/core/event/CanvasEvent.ts @@ -1,5 +1,5 @@ import { ElementType } from '../..' -import { NBSP, ZERO } from '../../dataset/constant/Common' +import { ZERO } from '../../dataset/constant/Common' import { EDITOR_ELEMENT_COPY_ATTR } from '../../dataset/constant/Element' import { ElementStyleKey } from '../../dataset/enum/ElementStyle' import { MouseEventButton } from '../../dataset/enum/Event' @@ -454,7 +454,10 @@ export class CanvasEvent { } else if (evt.key === KeyMap.ESC) { this.clearPainterStyle() } else if (evt.key === KeyMap.TAB) { - this.input(NBSP.repeat(4)) + this.draw.insertElementList([{ + type: ElementType.TAB, + value: '' + }]) evt.preventDefault() } } diff --git a/src/editor/dataset/enum/Element.ts b/src/editor/dataset/enum/Element.ts index f9294ad..f7490dc 100644 --- a/src/editor/dataset/enum/Element.ts +++ b/src/editor/dataset/enum/Element.ts @@ -9,5 +9,6 @@ export enum ElementType { PAGE_BREAK = 'pageBreak', CONTROL = 'control', CHECKBOX = 'checkbox', - LATEX = 'latex' + LATEX = 'latex', + TAB = 'tab' } \ No newline at end of file diff --git a/src/editor/index.ts b/src/editor/index.ts index e5dd7b3..31a569e 100644 --- a/src/editor/index.ts +++ b/src/editor/index.ts @@ -55,6 +55,7 @@ export default class Editor { defaultSize: 16, defaultRowMargin: 1, defaultBasicRowMarginHeight: 8, + defaultTabWidth: 32, width: 794, height: 1123, scale: 1, diff --git a/src/editor/interface/Editor.ts b/src/editor/interface/Editor.ts index fc9a2c3..d603717 100644 --- a/src/editor/interface/Editor.ts +++ b/src/editor/interface/Editor.ts @@ -12,6 +12,7 @@ export interface IEditorOption { defaultSize?: number; defaultBasicRowMarginHeight?: number; defaultRowMargin?: number; + defaultTabWidth?: number; width?: number; height?: number; scale?: number; diff --git a/src/mock.ts b/src/mock.ts index 3823964..7958818 100644 --- a/src/mock.ts +++ b/src/mock.ts @@ -281,6 +281,9 @@ elementList.push(...[{ // 模拟结尾文本 elementList.push(...[{ + value: '', + type: ElementType.TAB +}, { value: 'E', size: 16 }, {