Rut-etra-izer versi JavaFX

Pada tutorial kali ini saya akan mendemonstrasikan salah satu kegunaan dari JavaFX yakni dalam melakukan translate terhadap salah satu aplikasi berbasis javascript yakni  Rut-etra-izer  kedalam bahasa java. Kebetulan saya agak penasaran dengan kecanggihan aplikasi ini. Saya baru tahu soalnya  dan saya harap pembaca bisa mengambil manfaat dari tutorial ini. Adapun hasil mentahnya dapat dilihat pada gambar berikut:

package fjr.main.rutte.traizer;

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.canvas.Canvas;
import javafx.scene.canvas.GraphicsContext;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.image.PixelReader;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.scene.shape.LineTo;
import javafx.scene.shape.MoveTo;
import javafx.scene.shape.Path;
import javafx.scene.shape.PathBuilder;
import javafx.scene.shape.QuadCurve;
import javafx.scene.transform.Affine;
import javafx.scene.transform.Rotate;
import javafx.stage.Stage;

public class Rutte extends Application {

  static String main = Rutte.class.getResource("mami.jpg").toExternalForm();
 int step = 5;
 int stepY = 50; 
 double depth = 56;
 double width = 0 ;
 double  height = 0; 

 @Override
 public void start(Stage primaryStage) throws Exception {
  Group root = getEsembel();
  primaryStage.setScene(new Scene(root));
  primaryStage.setTitle("TUT WURI HANDAYANI");
  primaryStage.show();
 }

 public Group getEsembel() {
  Group root = new Group();
  Image image = new Image(main);
  width = image.getWidth();
  height = image.getHeight();

  PixelReader pixel = image.getPixelReader();

  double originX = 0;
  double destinyX = 0;
  double originY = 100;
  double destinyY = 0.0;

  Canvas canvas = new Canvas(width+50,height+50); 
  GraphicsContext gc = canvas.getGraphicsContext2D(); 
  double shifty  =0; 
  for(int y = 0 ; y < height; y+= step){
   for(int x = 0; x < width-step ;x+= step){
    Color color = pixel.getColor(x, y);
    Color color1 = pixel.getColor(x+step, y);
    double brightness = color.getBrightness();
    double brightness1 = color1.getBrightness(); 
    originX = x ; 
    destinyX = x+step; 
    originY = -  brightness*depth+brightness/2 + shifty;
    destinyY = -  brightness1*depth+brightness1/2+ shifty;
    gc.setStroke(color);
    this.rotateX(gc, -30);
    gc.strokeLine(originX,originY, destinyX, destinyY );
    originX  = destinyX ; 
    originY = destinyY; 
   }
   shifty+= 5;
  }
  root.setTranslateX(20); 
  root.setTranslateY(20);
  root.getChildren().add(canvas);
  
  return root;
 }
 
 /*
  * I'm not found the way to rotate GraphicContext with simple way like other node
  */
 static void rotateX(GraphicsContext gc , double angle){
  Affine affine = new Affine(); 
  double angleRadi = Math.toRadians(angle); 
  double sinus = Math.sin(angleRadi);
  double cosinus = Math.cos(angleRadi);
  affine.setMxx(1); 
  affine.setMxy(0); 
  affine.setMxz(0); 
  affine.setTx(0); 
  affine.setMyx(0); 
  affine.setMyy(cosinus);
  affine.setMyz(-sinus); 
  affine.setTy(0); 
  affine.setMzx(0); 
  affine.setMzy(sinus);
  affine.setMzz(cosinus);
  affine.setTz(0); 
  
  gc.setTransform(affine);
  
 }
 
 static void rotateY(GraphicsContext gc , double angle){
  Affine affine = new Affine(); 
  double angleRadi = Math.toRadians(angle); 
  double sinus = Math.sin(angleRadi);
  double cosinus = Math.cos(angleRadi);
  affine.setMxx(cosinus); 
  affine.setMxy(0); 
  affine.setMxz(sinus); 
  affine.setTx(0); 
  affine.setMyx(0); 
  affine.setMyy(1);
  affine.setMyz(0); 
  affine.setTy(0); 
  affine.setMzx(-sinus); 
  affine.setMzy(0);
  affine.setMzz(-cosinus);
  affine.setTz(0); 
  
  gc.setTransform(affine);
  
 }
 
 static void rotateZ(GraphicsContext gc , double angle){
  Affine affine = new Affine(); 
  double angleRadi = Math.toRadians(angle); 
  double sinus = Math.sin(angleRadi);
  double cosinus = Math.cos(angleRadi);
  affine.setMxx(cosinus); 
  affine.setMxy(-sinus); 
  affine.setMxz(0); 
  affine.setTx(0); 
  affine.setMyx(sinus); 
  affine.setMyy(cosinus);
  affine.setMyz(0); 
  affine.setTy(0); 
  affine.setMzx(0); 
  affine.setMzy(0);
  affine.setMzz(1);
  affine.setTz(0); 
  
  gc.setTransform(affine);
  
 }

 public Group getLine(double y) {
  Group root = new Group();

  return root;
 }

 public static void main(String[] args) {
  launch(args);
 }
}

Sebenarnya masih ada beberapa bagian yang ingin saya sempurnakan, misalnya respon terhadap mouse, drag n drop terhadap foto serta menyimpan hasil ke dalam gambar JPEG. Tapi  biar g terlalu basi, mendingan dipublish aja versi BETA-nya. Itupun kalo layak disebut BETA.

Maksud saya adalah saya pengen berbagi tutorial aja. Semoga bermanfaat!