步骤一:将已经下载好的ttf文件放置在h5目录下

步骤二:在html标签下以CSS格式嵌入TTF字体

font-family为字体名称
在项目中设置字体的font

编译后效果如下:

问题补充:
以上方法在canvas模式下正常,webGL模式下无效,这个是因为在用到该字体样式的时候,ttf字体包还未加载完成。html下字体是否加载完成,没有办法抛出事件,laya也无法监听判断。
替代方案:
在字体正式使用前,提前加载一个字体,该字体的主要功能是用于提前启动被加载字体的加载,保证在项目中正式使用该字体样式的时候,字体包已经加载完成
示例参考代码如下
参考代码如下:
package
{
import laya.display.Sprite;
import laya.display.Text;
import laya.ui.Image;
import laya.webgl.WebGL;
public class TTFTest
{
public function TTFTest()
{
Laya.init(550,400);
var sp:Image=new Image();
sp.loadImage("2.png");
Laya.stage.addChild(sp);
var text:Text=new Text();
text.fontSize=40;
text.color="#FF00FF";
text.text="哈哈哈哈哈哈哈哈哈哈哈哈哈哈";
text.font="hu"
text.pos(600,600);
Laya.stage.addChild(text);
Laya.timer.once(1000,this,onLoop);
}
private function onLoop():void
{
var text:Text=new Text();
text.fontSize=40;
text.color="#FF00FF";
text.text="嘻嘻嘻嘻嘻";
text.font="hu"
Laya.stage.addChild(text);
}
}
}
注意:
首次用到的(哈)字将会报废,下次再用到同样字的时候 无ttf样式效果,请谨慎选择生僻字做为首次加载字体的text文本,将该字体显示到可视区域外即可。
LayaNative(app)端使用ttf请参考:
LayaNative端使用.ttf字体