# 2D Transform Stack for Sprites

Use local space, parent transforms, rotation, scale, and pivot checks to place sprite attachments without dragging things by eye.

## Outcome
Place one child sprite from a local offset, predict its world position, and explain why parent rotation or scale moved it.

## Safe first step
Create one parent marker and one child sprite, then write the child's local offset before changing the parent transform.

## Ladder steps
### 1. Name the parent
Choose the node that should carry the child sprite.

Check: The child has a clear anchor instead of floating in world space.

### 2. Write the local offset
The child position should make sense before the parent moves.

Check: The offset can be stated as a small x/y pair from the parent.

### 3. Apply parent transform
Move, rotate, or scale one parent value at a time.

Check: The world result changes for a reason you can explain.

### 4. Check the pivot
Rotation should happen around the intended anchor.

Check: The parent origin and sprite pivot are named separately.

## Examples
### Set local offset
```sh
child.position = Vector2(4, 1)
```
Expected signal: The sprite is attached relative to the parent

### Rotate the parent
```sh
parent.rotation_degrees = 30
```
Expected signal: The child offset turns with the parent axes

### Compare local and world
```sh
print(child.position, child.global_position)
```
Expected signal: The stored offset and visible result are checked separately

## Common traps
- Moving the child by eye instead of naming the parent and local offset.
- Changing parent position, rotation, scale, and pivot all at once.
- Treating a pivot problem as a texture problem.
- Logging only global position when the local offset is the broken value.

## Practice task
Use the widget to choose a parent transform and child local offset. Copy the note, then build one parent marker and child sprite in Godot.

## Next steps
- Save the Obsidian note with [[Godot]], [[Node2D]], [[Transform2D]], [[Local Space]], [[World Space]], [[Rotation]], [[Scale]], [[Pivot]], and [[Scene Tree]] backlinks.
- Use vectors when the attachment needs to face or chase a target.
- Use trigonometry when a sprite must orbit, aim, or rotate by an angle.
- Use collision normal bounce math when the transformed object needs contact response.
- Use the sprite game loop lesson when the placed sprite needs animation states.

## Related
- [Build a first Godot game loop](/projects/build-first-godot-game-loop/)
- [Sprite-animated 2D game loop](/learn/games/sprite-animated-2d-game-loop/)
- [Tilemap level layout math](/learn/games/tilemap-level-layout-math/)
- [Collision normal bounce math](/learn/games/collision-normal-bounce-math/)
- [Vectors for maker projects](/learn/vectors-for-maker-projects/)
- [Trigonometry for rotation and layout](/learn/trigonometry-for-rotation-and-layout/)
- [Calculus for game motion](/learn/math/calculus-for-game-motion/)
- [Turn source videos into notes](/video-notes/)
- [Review Anki-compatible decks](/decks/)

## Obsidian backlinks

Use these wiki links to connect this note inside a local maker vault:

- [[TopicLadder]]
- [[Maker Learning]]
- [[2D Transform Stack for Sprites]]
- [[Games and Interactive Tools]]
- [[game-dev]]
- [[project-path]]
- [[Name the parent]]
- [[Write the local offset]]
- [[Apply parent transform]]
- [[Check the pivot]]
- [[Build a first Godot game loop]]
- [[Sprite-animated 2D game loop]]

## Source and next routes

Source: https://topicladder.com/learn/games/2d-transform-stack-for-sprites/

- [Build a first Godot game loop](/projects/build-first-godot-game-loop/)
- [Sprite-animated 2D game loop](/learn/games/sprite-animated-2d-game-loop/)
- [Tilemap level layout math](/learn/games/tilemap-level-layout-math/)
- [Collision normal bounce math](/learn/games/collision-normal-bounce-math/)
- [Vectors for maker projects](/learn/vectors-for-maker-projects/)
- [Trigonometry for rotation and layout](/learn/trigonometry-for-rotation-and-layout/)
- [Calculus for game motion](/learn/math/calculus-for-game-motion/)
- [Turn source videos into notes](/video-notes/)
