```typescript
import * as extended_text from '@candies/extended_text'
import { text } from "@kit.ArkGraphics2D"
import { DollarText } from './DollarText';
import { EmojiText } from './EmojiText';
import { LinkText } from './LinkText';
export class MySpecialTextSpanBuilder extends extended_text.SpecialTextSpanBuilder {
createSpecialText(flag: string, index: number, context: Context,
textStyle?: text.TextStyle | undefined): extended_text.SpecialText | null {
if (this.isStart(flag, EmojiText.flag)) {
return new EmojiText(context, index - (EmojiText.flag.length - 1), textStyle,);
} else if (this.isStart(flag, DollarText.flag)) {
return new DollarText(context, index - (DollarText.flag.length - 1), textStyle);
} else if (this.isStart(flag, LinkText.flag)) {
return new LinkText(context, index - (LinkText.flag.length - 1), textStyle);
}
return null;
}
}
```
### RegExpSpecialTextSpanBuilder
当然,也提供了通过正则的方式,创建特殊文本的方式。
#### RegExpSpecialText
下面的例子告诉你怎么创建一个 `$xxx$`
你只需要继承 `RegExpSpecialText` , 并且写出来对应的正则表达式即可。
```typescript
import * as extended_text from '@candies/extended_text'
import { TextSpan } from '@candies/extended_text';
import { text } from "@kit.ArkGraphics2D"
export class RegExpDollarText extends extended_text.RegExpSpecialText {
get regExp(): RegExp {
return new RegExp('\\$(.+?)\\$', 'g');
}
finishText(start: number,
match: RegExpExecArray,
context: Context,
textStyle?: text.TextStyle,): extended_text.InlineSpan {
let text = match[0];
return new TextSpan({
text: text.replaceAll('$', ''),
style: {
fontSize: vp2px(18), color: extended_text.ColorUtils.resourceColorTo2DColor(Color.Orange),
},
actualText: this.toString(),
start: start,
});
}
}
```
#### 特殊文本 Builder
将上一步创建的 `RegExpSpecialText`,放到 `regExps` 当中即可。
```typescript
import { RegExpSpecialTextSpanBuilder } from '@candies/extended_text';
import { RegExpEmojiText } from './EmojiText';
import { RegExpDollarText } from './DollarText';
import { RegExpLinkText } from './LinkText';
export class MyRegExpSpecialTextSpanBuilder extends RegExpSpecialTextSpanBuilder {
get regExps() {
return [
new RegExpDollarText(),
new RegExpEmojiText(),
new RegExpLinkText(),
];
}
}
```
let paragraph = this._paragraph!;
let rects = paragraph.getRectsForPlaceholders();
let index = 0;
for (; index < rects.length; index++) {
let rect = rects[index].rect;
rect = {
left: px2vp(rect.left),
right: px2vp(rect.right),
top: px2vp(rect.top),
bottom: px2vp(rect.bottom),
}
let child = children[index];
let margin = child.getMargin();
let x = rect.left - margin.start;
let y = rect.top - margin.top;
if ((this._overflowWidgetRect != null && RectUtils.hasIntersection(rect, this._overflowWidgetRect!)) ||
// hide widget
(rect.right == rect.left && rect.top == rect.bottom)
) {
// 不显示
x = Infinity;
y = Infinity;
}
child.layout({ x: x, y: y });
}
if (this.overflowWidget != null) {
// overflow widget
let child = children[children.length-1];
if (this._overflowWidgetRect != null) {
child.layout({
x: this._overflowWidgetRect.left,
y: this._overflowWidgetRect.top,
})
} else {
// move out the screen
child.layout({ x: Infinity, y: Infinity })
}
}
}
```