组件
GlowJS
建议将 实体
对象的某些 特定功能
封装到一个组件中,这样可以轻松实现组件 重用
。组件是一个类型,它继承自 Component 类型。 GlowJS
内置了一些常用组件,比如样式组件 Style 、动画组件 Animator 等。除此之外,你也可以实现自定义组件类型。
添加组件
添加组件,调用实体对象的 addComponent 方法。一个实体对象可以添加多个不同组件,一个组件也能添加到多个不同实体,但同一个组件只能在同一个实体添加一次。
typescript
entity.addComponent(GLOW.Style);
获取组件
获取组件,调用实体对象的 getComponent 方法。
typescript
let style: GLOW.Style = entity.getComponent(GLOW.Style);
所有组件
app
对象有一个 allComponents 属性,可以获取到已添加的所有组件对象。
自定义组件
创建一个继承自 Component 的类型,然后在类型内部实现功能,最后添加到实体。这里实现一个转圈自定义组件为例。 [自定义组件示例]
typescript
/**
* 转圈自定义组件
*/
class Rotation extends GLOW.Component {
/**
* 旋转速度
*/
public speed: number = 1;
/**
* 构造函数
*/
public constructor(entity: GLOW.Entity) {
super(entity);
entity.app.on(GLOW.EventType.Frame, this._update.bind(this));
}
private _update(): void {
let angles: GLOW.Point3D = this.entity.angles;
angles[1] += this.speed; //每帧旋转指定度数的角度
this.entity.angles = angles;
}
}