在HTML5画布上使用字体样式 [英] Use Font Style on HTML5 Canvas

问题描述

我正在尝试使用动态JS库在画布上添加文本. Kinetic JS提供setFontStyle()方法来支持字体样式.

I am trying to add text on a canvas using kinetic JS library. Kinetic JS Provides the setFontStyle() method to support the styles on fonts.

http://kineticjs.com/docs/symbols/Kinetic.Text. php#setFontStyle

根据文档，它支持正常"，斜体"或粗体". 但是，如果我想一次应用粗体和斜体，该怎么办.我也想在文本下划线.我该如何使用动态JS.

According to the documentation It supports 'normal', 'italic', or 'bold'. But what I do if I want to apply bold and Italic at once. Also I want to underline the text. How I can do in kinetic JS.

没有人告诉我:'(

推荐答案

就像已经提到的EliteOctagon一样，KineticJS还不支持带下划线的文本.这主要是由于html canvas元素不支持文本修饰(包括下划线).

Like EliteOctagon already mentioned, KineticJS does not support underlining text yet. This is mainly due to the fact that text-decoration (including underlining) isn't supported in the html canvas element.

添加(多种)字体样式相对容易. 推荐的方法是在启动时进行定义，如下所示:

To add (multiple) font styles, is relatively easy. The most recommended way is by defining it at the initiation, like this:

var text = new Kinetic.Text({
    x: 0,
    y: 0,
    fontSize: 20,
    fontStyle: 'bold italic'
    fill: 'black',
});

如果需要在启动后的其他时间设置不同的字体样式，则可以使用上述的setFontStyle()方法.例如这样的

If you need to set the font style differently at another time then initiation, you can use the method setFontStyle() like you mentioned. For instance like this:

var text = new Kinetic.Text();
text.setFontStyle('bold italic');

这篇关于在HTML5画布上使用字体样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！