flame-docs

[Flame] Flame engine quick reference. Component lifecycle, Collision, Effects, Camera and core API reference. (project)

$ 설치

git clone https://github.com/CANTAGESTUDIO/CosmicAtlasPacker /tmp/CosmicAtlasPacker && cp -r /tmp/CosmicAtlasPacker/.claude/skills/flame-docs ~/.claude/skills/CosmicAtlasPacker

// tip: Run this command in your terminal to install the skill


name: flame-docs description: "[Flame] Flame engine quick reference. Component lifecycle, Collision, Effects, Camera and core API reference. (project)"

Flame Engine Quick Reference

Component Lifecycle

onLoad() → onMount() → update(dt)/render(canvas) → onRemove()
MethodTimingPurpose
onLoad()Once, asyncResource loading, initialization
onMount()On tree additionSet parent/game references
update(dt)Every frameState update (dt = delta seconds)
render(canvas)Every frameDraw to screen
onRemove()On removalCleanup

Core Classes

ClassPurposeKey Properties/Methods
FlameGameGame rootpauseEngine(), resumeEngine(), overlays
WorldHosts game componentsadd(), children
ComponentBase componentadd(), remove(), children, parent
PositionComponentPosition/size/rotationposition, size, angle, anchor, scale
SpriteComponentStatic spritesprite, paint
SpriteAnimationComponentAnimationanimation, playing
CameraComponentCamera controlfollow(), moveTo(), setBounds(), viewport

Shape Components

  • RectangleComponent - Rectangle
  • CircleComponent - Circle
  • PolygonComponent - Polygon

Collision Detection

Enable

// Add to Game or World
class MyGame extends FlameGame with HasCollisionDetection {}

Hitbox Types

HitboxPurpose
RectangleHitboxRectangular collision area
CircleHitboxCircular collision area
PolygonHitboxPolygon (convex only)
ScreenHitboxScreen boundaries
CompositeHitboxComposite hitbox

Collision Callbacks

class MyComponent extends PositionComponent with CollisionCallbacks {
  @override
  void onCollisionStart(Set<Vector2> points, PositionComponent other) {}

  @override
  void onCollision(Set<Vector2> points, PositionComponent other) {}

  @override
  void onCollisionEnd(PositionComponent other) {}
}

Collision Type (Performance)

  • CollisionType.active - Checks against all hitboxes
  • CollisionType.passive - Only checked by active (better performance)
  • CollisionType.inactive - Ignored

Effects System

EffectPurposeExample
MoveEffect.to()Move to targetCharacter movement
MoveEffect.by()Move by offsetRelative movement
RotateEffect.to()Rotate to angleDirection change
ScaleEffect.to()Change sizeZoom in/out
ColorEffectColor/opacityHit effect
SequenceEffectSequential executionComplex animation
OpacityEffectOpacityFade in/out

Effect Controller

MoveEffect.to(
  Vector2(100, 100),
  EffectController(duration: 1.0, curve: Curves.easeInOut),
);

Camera & World

Camera Methods

MethodPurpose
follow(target)Follow target
moveTo(position)Move to coordinates
moveBy(offset)Move by offset
stop()Stop movement
setBounds(shape)Limit camera movement
canSee(component)Check visibility

Viewport Types

ViewportPurpose
MaxViewportExpand to max space (default)
FixedResolutionViewportFixed resolution + aspect ratio
FixedAspectRatioViewportFixed aspect ratio, scales
FixedSizeViewportFixed size

Bridge Packages

flame_riverpod (State Management)

// Game
class MyGame extends FlameGame with RiverpodGameMixin {}

// Component
class MyComponent extends Component with RiverpodComponentMixin {
  @override
  void onMount() {
    super.onMount();
    final state = ref.watch(myProvider);
  }
}

// Widget
RiverpodAwareGameWidget<MyGame>(
  game: game,
)

flame_forge2d (Physics Engine)

class MyGame extends Forge2DGame {}

class MyBody extends BodyComponent {
  @override
  Body createBody() {
    final shape = CircleShape()..radius = 10;
    final fixtureDef = FixtureDef(shape);
    final bodyDef = BodyDef(type: BodyType.dynamic);
    return world.createBody(bodyDef)..createFixture(fixtureDef);
  }
}

flame_audio (Audio)

// Sound effects
FlameAudio.play('explosion.mp3');

// BGM
FlameAudio.bgm.play('background.mp3');
FlameAudio.bgm.stop();
FlameAudio.bgm.pause();
FlameAudio.bgm.resume();

Common Patterns

Add Component

await add(MyComponent());  // In onLoad
add(MyComponent());        // In update

Remove Component

removeFromParent();  // Self
component.removeFromParent();  // Other component

Query Children

children.query<Enemy>();  // Find by type
componentsAtPoint(position);  // Find by position
findByKey(ComponentKey.named('player'));  // Find by key

Priority (Z-order)

class MyComponent extends PositionComponent {
  MyComponent() : super(priority: 10);  // Higher = rendered on top
}

Official Docs