benoitletondor / levelup

2D game framework in Dart for personal use

2D Dart game framework

This is an early work in progress to build a custom and light 2D game framework using Dart. This is built for my personal usage, so it's probably not suitable for all cases.

Idea

I wanted to make a game framework for a long time after participating to some LudumDare hackatons using other frameworks made by great people. And since I also wanted to check what Dart could offer as a programming language I decided to create Level Up.

This is a 2D game framework that offers simple APIs and includes Box2d as a physics engine and Pixi.js (using my own Dart port) as a WebGL/Canvas renderer.

Work in progress

I created this for my own needs and it's far from final. Current APIs includes:

• Stage as a container for all your display objects
• A rendering manager offering easy access to animation frames
• Box2D wrapper for display object to easily implement physics
• Pixi renderer
• Camera management to easily implement a viewport
• Drag&Drop API for both mouse and touch

How to use

Here's how to use Level Up:

• Clone this repo (A pub package isn't available yet)
• Clone pixi2dart repo into the same folder (a pub package isn't available yet)
• Add dependency to your pubspec.yaml:

dependencies:
  levelup:
    version: any
    path: ../levelup/

• Import the library and dependencies:

import 'package:levelup/levelup.dart' as LevelUp;
import 'package:pixi2dart/pixi2dart.dart' as PIXI;
import 'package:box2d/box2d.dart';
import 'package:box2d/box2d_browser.dart';

• Import the Pixi.js file into your html:

<script src="packages/pixi2dart/js/pixi.min.js"></script>

That's it, you're ready to use LevelUp APIs to build your game.

Sample

void main() {
  // Init stage
  LevelUp.GameStage stage = new LevelUp.GameStage(new LevelUp.PixiRenderer(PIXI.autoDetectRenderer(600, 400)), 
  	new _ContactListener(),
  	new Camera(0, 0, 600, 400, 1000, 500, LevelUp.CameraAxis.BOTH))
    	..gravity = new Vector2(0.0, 500.0);

  document.body.append(stage.view);

  // Activate Box2D debug if you need
  CanvasElement canvas = (new Element.tag('canvas') as CanvasElement)
    ..width = 600
    ..height = 400;

  document.body.append.append(canvas);
  stage.debugInCanvas(canvas);

  // Create physics wrapper for your display objects classes (those are physics enabled items, you can use _LevelUp.PixiItem_ if you don't want physics)
  // Note that you can still access directly your class: Bunny bunnySprite = bunny.item
  LevelUp.PixiPhysicsItem bunny = new LevelUp.PixiPhysicsItem(new Bunny()); 
  LevelUp.PixiPhysicsItem ground = new LevelUp.PixiPhysicsItem(new Ground());

  // Set their position on the stage
  bunny.position = new PIXI.Point.fromValues(100, 200);
  ground.position = new PIXI.Point.fromValues(0, 375);

  // Add them to display
  stage.addChild(ground);
  stage.addChild(bunny);
  
  // Set camera to follow the bunny with half height and width as camera deadzone
  stage.setCameraFocus(bunny, 300, 200);

  // If you want to make an item draggable, just use the drag&drop manager
  stage.dragNDropManager.addDragNDropableItem(bunny);
}

class Ground extends PIXI.Graphics implements LevelUp.PhysicsItem {
  Body body;

  Ground() : super() {
    beginFill(0xFF00FF);
    drawRect(0, 0, 400, 25);
  }

  FixtureDef buildFixtureDef() {
    PolygonShape shape = new PolygonShape()
      ..setAsBox(200.0, 12.5, new Vector2(200.0, 12.5), 0.0);

    return new FixtureDef()
      ..shape = shape
      ..density = 0.0
      ..restitution = 0.0
      ..friction = 0.0;
  }

  BodyDef get bodyDef => new BodyDef()..type = BodyType.KINEMATIC;
}

class Bunny extends PIXI.Sprite implements LevelUp.PhysicsItem {
  Body body;

  Bunny() : super(new PIXI.Texture.fromImage("bunny.gif"));

  FixtureDef buildFixtureDef() {
    PolygonShape shape = new PolygonShape()
      ..setAsBox(25.0, 25.0, new Vector2(25.0, 25.0), 0.0);

    return new FixtureDef()
      ..shape = shape
      ..friction = 0.2
      ..density = 0.5
      ..restitution = 0.2;
  }

  BodyDef get bodyDef => new BodyDef()
    ..type = BodyType.DYNAMIC
    ..allowSleep = false;
}

class _ContactListener implements LevelUp.StageContactListener {
  void onContactBegin(LevelUp.Item spriteA, LevelUp.Item spriteB, Contact contact) {
  	// Manage box2d contacts here
  }

  void onContactEnd(LevelUp.Item spriteA, LevelUp.Item spriteB, Contact contact) {
  	// Manage box2d contacts here
  }
}