Piccolo2D @ JUGM

ein Referat von Marcus Rohrmoser
bei der Java User Group München am 27. April 2009

Anmerkung zu dieser Wiki Seite:

Manches hier sieht in Layout und Farbe ein wenig seltsam aus, da es in erster Linie bei der Präsentation passen muß.

Als Präsentationswerkzeug habe ich das Dokuwiki S5 Plugin gewählt, da's mir am einfachsten schien und komplett ohne Flash/Office/etc. auskommt. Ein moderner Web-Browser genügt.

Was ist Piccolo2D?

  • 2D Scenegraph API für Java und .Net,
  • Spezialitäten:
    • Zooming,
    • Animation,
    • Mehransichtigkeit – z.B. gleichzeitige Detailansicht und Vogelperspektive,
  • sehr kompakt – wenige Klassen, jar ~80 KB.
  • benutzt intensiv java2d (ohne Compositing) und v.a. AffineTransform,
  • ist recht alt und wurde in 2 1/2 Sprachen (Java/C#/C# Mobile) implementiert ⇒ konzeptionell sehr ausgereift,

Exkurs: Scenegraph

  • Datenmodell von Zeichnungsbausteinen („universe“)
  • meist als Baum repräsentiert,
  • reine Lehre:
  • in 3D üblich, 2D eher selten.

Wobei hilft mir Piccolo2D?

  • zur Laufzeit synthetisierte (komplexe) 2D Graphiken,
  • veränderliche Bildinhalte,
  • veränderliche Bildausschnitte und Effekte.
  • Bildelemente finden (z.B. mit der Maus klicken) aka. „Object Picking“

Wie benutze ich Piccolo2D?

  • jar einbinden (ideal per Maven Dependency)
  • PCanvas in eine Komponente (JFrame) einfügen
  • Scenegraph aufbauen und in PCanvas einhängen
  • Controller als Event Handler in PCanvas einhängen

Bsp: Hampelmann Treiber

public static void main(final String[] args) {
  final JFrame frame = new JFrame();
  frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
 
  final PCanvas canvas = new PCanvas();
  frame.add(canvas);
  // Scenegraph:
  final Model model = new Model();
  final PNode world = createScene(model);
  canvas.getLayer().addChild(world);
  // Controller:
  canvas.addInputEventListener(new Controller(model, world));
 
  frame.setSize(600, 700);
  frame.setVisible(true);
}

Bsp: Hampelmann Scenegraph

private static final PNode createScene(final Model m) {
  final PNode torso;
  PNode tmp;
  final PNode universe = new PNode();
  universe.addChild(torso = load("/torso.png"));
  universe.addChild(load("/hand.png"));
  torso.addChild(load("/kopf.png"));
  torso.addChild(load("/linker_arm.png"));
  torso.addChild(tmp = load("/linkes_bein.png"));
  tmp.addChild(load("/linker_fuss.png"));
  torso.addChild(load("/rechter_arm.png"));
  torso.addChild(tmp = load("/rechtes_bein.png"));
  tmp.addChild(load("/rechter_fuss.png"));
  return universe;
}

Bsp: Hampelmann Controller

public void mousePressed(final PInputEvent arg0) {
  p0.setLocation(arg0.getPosition());
  pull0 = pull;
  // super.mousePressed(arg0);
}
 
public void mouseDragged(final PInputEvent arg0) {
  arg0.setHandled(true);
  final double _dy = arg0.getPosition().getY() - p0.getY();
  setPull(pull0 + _dy / dy);
}

Exkurs: Design Patterns & MVC

Woher kommt Piccolo2D?

als SVG Bild, ergo sinnvoll klickbar.

Wer benutzt Piccolo2D?

unter anderem:

Eine umfassendere Liste:

Vielen Dank

für Eure Aufmerksamkeit.

Feedback willkommmen an Marcus Rohrmoser

Die Folien zum Nachlesen gibt's hier:

http://mro.name/go/jugm-p2d

Lizenz

Creative Commons by-sa
, , , ,