Fabricjs 2.0 如何为文本框的子字符串设置下划线

Question

我有一个带有文本 "This is test textbox" 的文本框，我想将下划线设置为仅单词 "test" 而不是整个文本框文本。如何为子字符串设置下划线？

var canvas = new fabric.Canvas('c');

var underlineText = new fabric.Textbox("This is test textbox", {
  underline: true,
});

canvas.add(underlineText);

canvas {
    border: 1px solid #999;
}

<script src="https://rawgit.com/kangax/fabric.js/master/dist/fabric.js"></script>
<canvas id="c" width="1000" height="500"></canvas>

由于 2.0 还没有为文档和示例准备好，改变的一件事是 textDecoration 已被删除。在适当的地方我们有：.underline, .overline, .linetrought 他们每个人都有一个 true 或 false。问题

谢谢。任何帮助将不胜感激。

Answer 1

我不同意 2.0 还没有为文档和示例做好准备。来自 1.0 的文档和示例已被转换并添加了一些。

这么说，我知道这与问题无关，fabricJS 中的所有文本类都有一个 setSelectionStyle 方法，该方法采用样式对象和开始和结束索引作为参数.

http://fabricjs.com/docs/fabric.Text.html#setSelectionStyles

所以调用：

myText.setSelectionStyles({ underline: true }, 2, 4);

应在位置 2、3 和 4 的文本字符中设置下划线。

Fabricjs 2.0 如何为文本框的子字符串设置下划线

Fabricjs 2.0 How to set underline to substring of the Textbox

fabricjs

fabricjs2