LogoPixi’VN
pixi-jsInterfaces

Interface: ChildrenHelperMixin<C>

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:8

Mixin interface for containers that allows them to manage children. It provides methods for adding, removing, and manipulating child containers.

Advanced

Type Parameters

C

C = ContainerChild

Properties

allowChildren

> allowChildren: boolean

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:10

Internal

Methods

addChild()

> addChild<U>(...children): U[0]

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:11

Type Parameters

U

U extends C[]

Parameters

children

...U

Returns

U[0]


addChildAt()

> addChildAt<U>(child, index): U

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:161

Adds a child to the container at a specified index. If the index is out of bounds an error will be thrown. If the child is already in this container, it will be moved to the specified index.

When moving a child within the same container, childAdded and added events are not emitted because the parent-child relationship hasn't changed. Events only fire when a child is added from a different parent (or from no parent).

Type Parameters

U

U

Parameters

child

U

The child to add

index

number

The index where the child will be placed

Returns

U

The child that was added

Example

// Add at specific index
container.addChildAt(sprite, 0); // Add to front

// Move existing child (no events emitted)
const index = container.children.length - 1;
container.addChildAt(existingChild, index); // Move to back

// With error handling
try {
    container.addChildAt(sprite, 1000);
} catch (e) {
    console.warn('Index out of bounds');
}

Throws

If index is out of bounds

See


getChildAt()

> getChildAt<U>(index): U

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:85

Returns the child at the specified index.

Type Parameters

U

U

Parameters

index

number

The index to get the child from

Returns

U

The child at the given index

Example

// Get first child
const first = container.getChildAt(0);

// Type-safe access
const sprite = container.getChildAt<Sprite>(1);

// With error handling
try {
    const child = container.getChildAt(10);
} catch (e) {
    console.warn('Index out of bounds');
}

Throws

If index is out of bounds

See


getChildIndex()

> getChildIndex(child): number

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:130

Returns the index position of a child Container instance.

Parameters

child

C

The Container instance to identify

Returns

number

The index position of the child container

Example

// Basic index lookup
const index = container.getChildIndex(sprite);
console.log(`Sprite is at index ${index}`);

// With error handling
try {
    const index = container.getChildIndex(sprite);
} catch (e) {
    console.warn('Child not found in container');
}

Throws

If child is not in this container

See


removeChild()

> removeChild<U>(...children): U[0]

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:12

Type Parameters

U

U extends C[]

Parameters

children

...U

Returns

U[0]


removeChildAt()

> removeChildAt<U>(index): U

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:61

Removes a child from the specified index position.

Type Parameters

U

U

Parameters

index

number

The index to remove the child from

Returns

U

The child that was removed

Example

// Remove first child
const removed = container.removeChildAt(0);

// type safe access
const sprite = container.removeChildAt<Sprite>(1);

// With error handling
try {
    const child = container.removeChildAt(10);
} catch (e) {
    console.warn('Index out of bounds');
}

Throws

If index is out of bounds

See


removeChildren()

> removeChildren(beginIndex?, endIndex?): C[]

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:37

Removes all children from this container that are within the begin and end indexes.

Parameters

beginIndex?

number

The beginning position

endIndex?

number

The ending position. Default is container size

Returns

C[]

List of removed children

Example

// Remove all children
container.removeChildren();

// Remove first 3 children
const removed = container.removeChildren(0, 3);
console.log('Removed:', removed.length); // 3

// Remove children from index 2 onwards
container.removeChildren(2);

// Remove specific range
const middle = container.removeChildren(1, 4);

Throws

If begin/end indexes are invalid

See


removeFromParent()

> removeFromParent(): void

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:203

Remove the Container from its parent Container. If the Container has no parent, do nothing.

Returns

void

Example

// Basic removal
sprite.removeFromParent();

// With validation
if (sprite.parent) {
    sprite.removeFromParent();
}

See


reparentChild()

> reparentChild<U>(...child): U[0]

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:224

Reparent a child or multiple children to this container while preserving their world transform. This ensures that the visual position and rotation of the children remain the same even when changing parents.

Type Parameters

U

U extends C[]

Parameters

child

...U

The child or children to reparent

Returns

U[0]

The first child that was reparented

Example

// Basic reparenting
const sprite = new Sprite(texture);
oldContainer.addChild(sprite);
// Move to new parent, keeping visual position
newContainer.reparentChild(sprite);

// Reparent multiple children
const batch = [sprite1, sprite2, sprite3];
newContainer.reparentChild(...batch);

See


reparentChildAt()

> reparentChildAt<U>(child, index): U

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:243

Reparent the child to this container at the specified index while preserving its world transform. This ensures that the visual position and rotation of the child remain the same even when changing parents.

Type Parameters

U

U

Parameters

child

U

The child to reparent

index

number

The index to reparent the child to

Returns

U

The reparented child

Example

// Basic index-specific reparenting
const sprite = new Sprite(texture);
oldContainer.addChild(sprite);
// Move to new parent at index 0 (front)
newContainer.reparentChildAt(sprite, 0);

Throws

If index is out of bounds

See


replaceChild()

> replaceChild<U, T>(oldChild, newChild): void

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:249

Replace a child in the container with a new child. Copying the local transform from the old child to the new one.

Type Parameters

U

U

T

T

Parameters

oldChild

U

The child to replace.

newChild

T

The new child to add.

Returns

void


setChildIndex()

> setChildIndex(child, index): void

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:108

Changes the position of an existing child in the container.

Parameters

child

C

The child Container instance to reposition

index

number

The resulting index number for the child

Returns

void

Example

// Basic index change
container.setChildIndex(sprite, 0); // Move to front
container.setChildIndex(sprite, container.children.length - 1); // Move to back

// With error handling
try {
    container.setChildIndex(sprite, 5);
} catch (e) {
    console.warn('Invalid index or child not found');
}

Throws

If index is out of bounds

Throws

If child is not in container

See


swapChildren()

> swapChildren<U>(child, child2): void

Defined in: node_modules/pixi.js/lib/scene/container/container-mixins/childrenHelperMixin.d.ts:187

Swaps the position of 2 Containers within this container.

Type Parameters

U

U

Parameters

child

U

First container to swap

child2

U

Second container to swap

Returns

void

Example

// Basic swap
container.swapChildren(sprite1, sprite2);

// With error handling
try {
    container.swapChildren(sprite1, sprite2);
} catch (e) {
    console.warn('One or both children not found in container');
}

Remarks

  • Updates render groups
  • No effect if same child
  • Triggers container changes
  • Common in z-ordering

Throws

If either child is not in container

See