Giter Site home page Giter Site logo

interactivecanvas's Introduction

InteractiveCanvas

The library distributes canvas animation over set of devices.

How it works

The library is based on pretty dumb method: Picture class has writeToStream and createFromStream methods which serializes and deserializes Picture object respectively. After serialization byte array sends to a client device as UDP packet. On a client device the packet is deserialized back into Picture object and finaly rendered on a Canvas. That's all.

Advantages

  • It's quite easy to distribute regular Canvas animation over almost any number of devices. You could develop and test your game (or just animation) on one device and then launch it on a set of Android TV-sets for instance.
  • Picture represents a frame of animation. Size of serialized Picture object is relatively small: could be 100 to 300 bytes - it depends on comlexity of your animation. So there is no need to have wide bandwidth to send 30 or 60 packets(frames) per second.
  • Serialization of frames and game logic execution could be performed on a separate device or even on a separate computer(with Android emulator/virtual machine). It could be useful when you need to perform heavy computations to prepare Picture frames or handle lots of users MotionEvents.

Limitations

  • The library uses deprecated methods. So some day it could just stop working. Though it could be used for some interactive installations or presentations where you have particular set of devices.
  • Initally the libray was designed for relatively simple animation. Complex animation could overflow maximum size of udp packet. In this case you could either try to compress frames or send frames over tcp.

Usage

  1. Host side should extend InteractiveCanvas.java and override onDraw method:
@Override protected void onDraw(Canvas canvas) {
	//...draw on canvas
	super.onDraw(canvas);// at the end of animation `super` method must be called
}
  1. Then your canvas shoud be configured with array of Screens. Screen represents client device where animation should be displayed.
hostCanvas.config(screens, PICTURES_PORT, TOUCH_EVENTS_PORT);
hostCanvas.start();
  1. Client should create PictureReceviver instance and configure it with ReceiverView instance:
pictureReceiver = new PictureReceiver(clientId);
pictureReceiver.config(PICTURES_PORT, HOST_ADDRESS, TOUCH_EVENTS_PORT);
pictureReceiver.setReceiverView(receiverView);
pictureReceiver.start();

Samples

Ther're two samples: PingPongActivity and MirrorActivity. Both of the classes contain similar two static fields:

  private static final InetAddress HOST_ADDRESS = Utils.getAddress("192.168.56.101");
  private static final InetAddress[] CLIENT_ADDRESSES = new InetAddress[]{
  		HOST_ADDRESS,
  		Utils.getAddress("192.168.56.102"),
  		Utils.getAddress("192.168.56.103"),
  		Utils.getAddress("192.168.56.104")
  };

Change this ip adresses to id adresses of your devices and launch app on all devices.

Download

repositories {
    maven { url "https://jitpack.io" }
}
//...
dependencies {
    //...
    compile 'com.github.elevenetc:interactivecanvas:0.9.0'
}

Licence

http://www.apache.org/licenses/LICENSE-2.0

interactivecanvas's People

Contributors

elevenetc avatar

Watchers

Michael jentsch avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.