AdvancedAdds 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.
The child to add
The index where the child will be placed
The child that was added
// Add at specific index
container.addChildAt(sprite, 0); // Add to front
// Move existing child
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');
}
Returns the child at the specified index.
The index to get the child from
The child at the given index
// 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');
}
Returns the index position of a child Container instance.
The Container instance to identify
The index position of the child container
// 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');
}
Removes a child from the specified index position.
The index to remove the child from
The child that was removed
// 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');
}
Removes all children from this container that are within the begin and end indexes.
OptionalbeginIndex: numberThe beginning position
OptionalendIndex: numberThe ending position. Default is container size
List of removed children
// 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);
Remove the Container from its parent Container. If the Container has no parent, do nothing.
// Basic removal
sprite.removeFromParent();
// With validation
if (sprite.parent) {
sprite.removeFromParent();
}
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.
The child or children to reparent
The first child that was reparented
// 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);
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.
The child to reparent
The index to reparent the child to
The reparented child
// Basic index-specific reparenting
const sprite = new Sprite(texture);
oldContainer.addChild(sprite);
// Move to new parent at index 0 (front)
newContainer.reparentChildAt(sprite, 0);
Changes the position of an existing child in the container.
The child Container instance to reposition
The resulting index number for the child
// 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');
}
Swaps the position of 2 Containers within this container.
// 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');
}
Mixin interface for containers that allows them to manage children. It provides methods for adding, removing, and manipulating child containers.