开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

CraftyJS 学习

共 5 篇文章

1

CraftyJS 学习五 -- Text

2

CraftyJS 学习四 -- 2D Graphics

3

CraftyJS 学习三 -- Component

4

CraftyJS 学习二 -- Event

5

CraftyJS 学习一 -- Entity

清单首页CraftyJS 学习文章详情

清单「CraftyJS 学习」 01/05

CraftyJS 学习五 -- Text

文本

创建 "Text":

var helloWorldText = Crafty.e('2D, DOM, Text')
  .attr({
    x: 10,
    y: 10
  });

显示文本:

helloWorldText.text('Hello World');

样式

使用 .textColor() 方法修改文本颜色:

helloWorldText.textColor('red');

使用.textFont() 方法调整字体样式:

helloWorldText.textFont({
  size: '20px',
  weight: 'bold'});

支持的类型包括:

type
weight
size
family
lineHeight
variant

2D 属性

注意:

文本可在 Canvas 和 DOM 层上. 但是 DOM 的渲染能力更强。
Canvas 上的文本会自动设定高度及宽度.

举报