flame_camera_tools 2.0.0

Intuitive tools for creating immersive and dynamic camera behaviors in Flame-based games.

flame_camera_tools

flame_camera_tools is a Flutter package that enhances camera functionality for games built with Flame. It provides a intuitive way to manage camera behavior, making it easier to create dynamic and immersive experiences in 2D game worlds.

Features

• Smooth Follow: The camera smoothly follows a target component, adjusting the speed based on the distance. In addition, you can specify a dead zone in which the camera does not follow the target.
• Shake Effect: Apply a shake effect to any PositionProvider.
• Zooming: Zoom in/out.
• Rotating: Rotate the camera by an angle.
• Move Along Path: Move the camera sequentially through a series of points.
• Focus Effects: Focus the camera on a position or component.
• Customizable Effects: Modify the duration and curve of each effect.
• Chaining Effects: Seamlessly chain multiple effects using Futures.

Usage

You can either instantiate your own CameraComponent directly or use the camera provided by the FlameGame class:

// Directly instantiate the CameraComponent
final camera = CameraComponent();

copied to clipboard

// Accessing the camera from FlameGame
final camera = game.camera;

copied to clipboard

Follow a Component

Use smoothFollow() to make the camera smoothly follow a component with adjustable stiffness:

camera.smoothFollow(component, stiffness: 1.5);

copied to clipboard

You can also specify a deadZone in which the camera does not follow the target:

camera.smoothFollow(component, stiffness: 5, deadZone: const Rect.fromLTRB(100, 100, 100, 100));

copied to clipboard

Make sure to use the Rect.fromLTRB() constructor to get the desired results.

Apply a Shake Effect

Create a shake effect with a specific duration, intensity, and curve:

camera.shake(intensity: 10, duration: 5, curve: Curves.linear);

copied to clipboard

The shaking effect is automatically weakened over time. If you do not want such behavior, set the weakenOverTime parameter to false.

Zooming in/out

Zoom in/out with optional duration and curve:

camera.zoomTo(0.5, duration: 3, curve: Curves.easeInOut);

copied to clipboard

Rotating

Rotate the camera by an angle with optional duration and curve:

// Rotates the camera by 45 degrees
camera.rotateBy(45, duration: 3, curve: Curves.easeInOut);

copied to clipboard

Focusing the Camera

Move the camera to focus on a position, with optional duration and curve:

camera.focusOn(Vector2(200, 200), duration: 3, curve: Curves.easeInOut);

copied to clipboard

Move the camera to focus on a component, with optional duration and curve:

camera.focusOnComponent(component, duration: 3, curve: Curves.easeInOut);

copied to clipboard

Move Along a Path

Move the camera sequentially along a series of points:

camera.moveAlongPath(
  [Vector2(100, 100), Vector2(200, 0), Vector2(300, 100)],
  durationPerPoint: 0.5,
  curve: Curves.easeInOut,
);

copied to clipboard

Chaining Multiple Effects

You can chain multiple effects together for a sequence of camera movements:

camera
    .shake(intensity: 10, duration: 4)
    .then((_) => camera.zoomTo(0.25, duration: 3))
    .then((_) => camera.focusOnComponent(component, duration: 3))
    .then((_) => camera.rotateBy(45, duration: 2));

copied to clipboard

Applying Multiple Effects at Once

You can also apply multiple effects simultaneously for more dynamic interactions:

camera
  ..shake(intensity: 7, duration: 4)
  ..zoomTo(0.75, duration: 2)
  ..rotateBy(90, duration: 2, curve: Curves.easeInOut);

copied to clipboard

Why Use This Package?

This package allows for easy and smooth camera transitions, such as when you want to zoom in on an action, create a shake effect for a hit or explosion, or follow a character smoothly as they move through a level. The effects are customizable and can be chained to create complex camera behaviors that enhance your game's dynamic visuals.