Appearance

@fibbojs / 2d / FSprite

Class: FSprite ​

A simple sprite in Fibbo.

Example ​

ts
import { FScene, FSprite } from '@fibbojs/2d'

const scene = new FScene()

const sprite = new FSprite(scene, '/my-texture.png')
scene.addComponent(sprite)

Extends ​

Accessors ​

position ​

get position(): object

Setters & getters for transform properties

set position(p): void

Parameters ​

• p

• p.x: number

• p.y: number

Returns ​

object

x ​

x: number

y ​

y: number

Inherited from ​

FComponent.position

Defined in ​

2d/src/core/FComponent.ts:362

rotation ​

get rotation(): number

set rotation(r): void

Parameters ​

• r: number

Returns ​

number

Inherited from ​

FComponent.rotation

Defined in ​

2d/src/core/FComponent.ts:386

rotationDegree ​

get rotationDegree(): number

set rotationDegree(r): void

Parameters ​

• r: number

Returns ​

number

Inherited from ​

FComponent.rotationDegree

Defined in ​

2d/src/core/FComponent.ts:394

scale ​

get scale(): object

set scale(s): void

Parameters ​

• s

• s.x: number

• s.y: number

Returns ​

object

x ​

x: number

y ​

y: number

Inherited from ​

FComponent.scale

Defined in ​

2d/src/core/FComponent.ts:402

scaleX ​

get scaleX(): number

set scaleX(x): void

Parameters ​

• x: number

Returns ​

number

Inherited from ​

FComponent.scaleX

Defined in ​

2d/src/core/FComponent.ts:410

scaleY ​

get scaleY(): number

set scaleY(y): void

Parameters ​

• y: number

Returns ​

number

Inherited from ​

FComponent.scaleY

Defined in ​

2d/src/core/FComponent.ts:418

x ​

get x(): number

set x(x): void

Parameters ​

• x: number

Returns ​

number

Inherited from ​

FComponent.x

Defined in ​

2d/src/core/FComponent.ts:370

y ​

get y(): number

set y(y): void

Parameters ​

• y: number

Returns ​

number

Inherited from ​

FComponent.y

Defined in ​

2d/src/core/FComponent.ts:378

Constructors ​

new FSprite() ​

new FSprite(scene, options): FSprite

Parameters ​

• scene: FScene

• options: FSpriteOptions

Returns ​

FSprite

Overrides ​

FComponent.constructor

Defined in ​

2d/src/sprite/FSprite.ts:33

Methods ​

emitCollisionWith() ​

emitCollisionWith(options): void

Emit a collision event with a given class or object.

Parameters ​

• options

The options for the collision event.

• options.class?: any

The class to emit the collision event with.

• options.component?: FComponent

The component to emit the collision event with.

Returns ​

void

Examples ​

typescript
const player = new Player()
const enemy = new Enemy()
player.emitCollisionWith({
  class: Enemy
})
typescript
const player = new Player()
const enemy = new Enemy()
player.emitCollisionWith({
  object: enemy
})

Inherited from ​

FComponent.emitCollisionWith

Defined in ​

core/dist/index.d.ts:116

emitOnLoaded() ​

emitOnLoaded(): void

Emit the onLoaded callbacks.

Returns ​

void

Defined in ​

2d/src/sprite/FSprite.ts:119

initCollider() ​

initCollider(options?): void

Only init a collider for the component, without a rigid body. This is useful for static objects.

Parameters ​

• options?: FColliderOptions

The options for the collider.

Returns ​

void

Example ​

ts
component.initCollider({
  position: { x: 0, y: 0 },
  scale: { x: 1, y: 1 },
  rotation: 0,
  shape: FShapes.SQUARE
})

Inherited from ​

FComponent.initCollider

Defined in ​

2d/src/core/FComponent.ts:316

initRigidBody() ​

initRigidBody(options?): void

Init a rigid body for the model.

Parameters ​

• options?: FRigidBodyOptions

The options for the rigid body.

Returns ​

void

Example ​

ts
component.initRigidBody({
  position: { x: 0, y: 0 },
  scale: { x: 1, y: 1 },
  rotation: 0,
  shape: FShapes.SQUARE
})

Inherited from ​

FComponent.initRigidBody

Defined in ​

2d/src/core/FComponent.ts:289

initSensor() ​

initSensor(options?): void

Init a sensor for the component. This is useful for triggerings events when the component collides with other components.

Parameters ​

• options?: FColliderOptions

The options for the collider.

Returns ​

void

Example ​

ts
component.initSensor({
  position: { x: 0, y: 0 },
  scale: { x: 1, y: 1 },
  rotation: { x: 0, y: 0 },
  shape: FShapes.SQUARE
})

Inherited from ​

FComponent.initSensor

Defined in ​

2d/src/core/FComponent.ts:340

loadTexture() ​

loadTexture(texture): Promise<void>

Load a texture from a path.

Parameters ​

• texture: string

The path to the texture.

Returns ​

Promise<void>

Defined in ​

2d/src/sprite/FSprite.ts:52

onCollisionWith() ​

onCollisionWith(classOrObject, callback): () => void

Add a callback to be called when a collision occurs.

Parameters ​

• classOrObject: any

The class or object to add the callback to.

• callback

The callback to add.

Returns ​

Function

A function to remove the callback.

Returns ​

void

Examples ​

typescript
const player = new Player()
const enemy = new Enemy()
player.onCollisionWith(Enemy, () => {
  console.log('Player collided with an Enemy!')
})
typescript
const player = new Player()
const enemy = new Enemy()
player.onCollisionWith(enemy, () => {
  console.log('Player collided with the enemy!')
})

Inherited from ​

FComponent.onCollisionWith

Defined in ​

2d/src/core/FComponent.ts:349

onFrame() ​

onFrame(delta): void

Update the component. Should be called every frame. The purpose of onFrame on FComponent is really to render the component, its mesh/sprite and its properties. Any changes on its transform should be done on the controller, not here.

Parameters ​

• delta: number

Returns ​

void

Overrides ​

FComponent.onFrame

Defined in ​

2d/src/sprite/FSprite.ts:104

onLoaded() ​

onLoaded(callback): void

Add a callback to be called when the texture is loaded.

Parameters ​

• callback

The callback function.

Returns ​

void

Defined in ​

2d/src/sprite/FSprite.ts:112

setPosition() ​

setPosition(options): void

Set the position of the component.

Parameters ​

• options

The options for the position.

• options.x: number

The x position.

• options.y: number

The y position.

Returns ​

void

Example ​

ts
component.setPosition({ x: 0, y: 0 })

Inherited from ​

FComponent.setPosition

Defined in ​

2d/src/core/FComponent.ts:195

setRotation() ​

setRotation(r): void

Set the rotation of the component in radians.

Parameters ​

• r: number

The rotation in radians.

Returns ​

void

Example ​

ts
component.setRotation(Math.PI / 2)

Inherited from ​

FComponent.setRotation

Defined in ​

2d/src/core/FComponent.ts:244

setRotationDegree() ​

setRotationDegree(r): void

Set the rotation of the component in degrees.

Parameters ​

• r: number

The rotation in degrees.

Returns ​

void

Example ​

ts
component.setRotationDegree(90)

Inherited from ​

FComponent.setRotationDegree

Defined in ​

2d/src/core/FComponent.ts:263

setScale() ​

setScale(options): void

Set the scale of the component.

Parameters ​

• options

The options for the scale.

• options.x: number

The x scale.

• options.y: number

The y scale.

Returns ​

void

Example ​

ts
component.setScale({ x: 1, y: 1 })

Inherited from ​

FComponent.setScale

Defined in ​

2d/src/core/FComponent.ts:216

setScaleHeight() ​

setScaleHeight(height): void

Set the scale of the sprite to a specific height. The width will be calculated according to the aspect ratio of the texture.

Parameters ​

• height: number

The height of the sprite.

Returns ​

void

Defined in ​

2d/src/sprite/FSprite.ts:100

setScaleWidth() ​

setScaleWidth(width): void

Set the scale of the sprite to a specific width. The height will be calculated according to the aspect ratio of the texture.

Parameters ​

• width: number

The width of the sprite.

Returns ​

void

Defined in ​

2d/src/sprite/FSprite.ts:91

Properties ​

__CALLBACKS_ON_COLLISION__ ​

__CALLBACKS_ON_COLLISION__: object

Callbacks for when a collision occurs with a given class or object. It is a dictionary where the key is the class name or object id and the value is an array of callbacks.

Index Signature ​

[key: string]: (data) => void[]

Inherited from ​

FComponent.__CALLBACKS_ON_COLLISION__

Defined in ​

core/dist/index.d.ts:56

__CALLBACKS_ON_LOADED__ ​

__CALLBACKS_ON_LOADED__: () => void[] = []

Callbacks for when the texture is loaded

Defined in ​

2d/src/sprite/FSprite.ts:31

__ID__ ​

__ID__: number

Unique identifier for the component. It is generated automatically.

Inherited from ​

FComponent.__ID__

Defined in ​

core/dist/index.d.ts:51

__IS_2D__ ​

__IS_2D__: boolean = true

Internal flags

Inherited from ​

FComponent.__IS_2D__

Defined in ​

2d/src/core/FComponent.ts:28

__IS_3D__ ​

__IS_3D__: boolean

Internal flags

Inherited from ​

FComponent.__IS_3D__

Defined in ​

core/dist/index.d.ts:45

collider? ​

optional collider: FCollider

RAPIER Collider

Inherited from ​

FComponent.collider

Defined in ​

2d/src/core/FComponent.ts:57

container ​

container: Container<ContainerChild>

PIXI container

Inherited from ​

FComponent.container

Defined in ​

2d/src/core/FComponent.ts:42

controller? ​

optional controller: FController

The controller attached to the component.

Inherited from ​

FComponent.controller

Defined in ​

2d/src/core/FComponent.ts:37

rigidBody? ​

optional rigidBody: FRigidBody

RAPIER RigidBody

Inherited from ​

FComponent.rigidBody

Defined in ​

2d/src/core/FComponent.ts:53

scene ​

scene: FScene

The scene which the component is in.

Inherited from ​

FComponent.scene

Defined in ​

2d/src/core/FComponent.ts:33

sensor? ​

optional sensor: FRigidBody

Sensor (a collider that doesn't collide with other colliders, but still triggers events)

Inherited from ​

FComponent.sensor

Defined in ​

2d/src/core/FComponent.ts:61

texture ​

texture: Texture

The texture of the sprite.

Defined in ​

2d/src/sprite/FSprite.ts:27

transform ​

transform: FTransform

Transforms

Inherited from ​

FComponent.transform

Defined in ​

2d/src/core/FComponent.ts:47