Sergey has posted 7 posts at DZone. You can read more from them at their website. View Full User Profile

JavaFX - Fullscreen, Animation, and Transparency

02.26.2008
| 16469 views |
  • submit to reddit

Sometimes we need to switch an application to full-screen mode. Let's examine an example of such an application...


The transparent window expands on all screen. You can draw and write down a note at this window. Control buttons appear at the top of the screen:

  • Hide - iconify a window
  • Clear - clears a window
  • Exit - exit from the application

How to create a window similar to this example

Here we have code for switching a window in an exclusive mode:
var w=frame.getWindow ();
GraphicsEnvironment.getLocalGraphicsEnvironment ().getDefaultScreenDevice()
.setFullScreenWindow (w);
Let's make a screenshot of the desktop and we shall place it on the form for imitation of transparency:
Canvas {
scaleToFit: true
content: me.imageView
}
How to create screenshot of the desktop:
var file=File.createTempFile ("fsmemo", ".jpg");
file.deleteOnExit ();
var background = robot.createScreenCapture (screenRectangle);
ImageIO.write (background, "jpg", file);
var image=new Image {preloadIfLocal: true};
image.url=file.toURL () .toString ();
imageView.image=image;
- a variable robot is a java.awt.Robot

Let's place this code in the trigger on frame attribute /iconified/ so that at each minimzing of the window, a new screenshot is taken.

Drawing on the screen

Let's create Canvas and place a Polyline on it:
curve: Polyline
curves: [Polyline]
...
Canvas {
content: bind me.curves
}

We shall add points in MouseDragged event:

onMouseDragged: operation (e: CanvasMouseEvent) {
insert [e.x, e.y] as last into me.curve.points;
}

We shall add this line in a array of lines in MousePressed event:

onMousePressed: operation (e: CanvasMouseEvent) {
me.curve = Polyline {
points: [e.x, e.y]
stroke: new Color (1,0,0,1)
strokeLineCap: ROUND
strokeWidth: 5
};
insert me.curve as last into me.curves;
}

How to store lines

Let's use standard class Properties for a data storage

    operation save (curves:Polyline *) {
var s = "";
for (all in curves) {
for (one in all) {
var c = "/y ";
for (p in one.points) {
if (c.equals ("/y")) {
c = ", x ";
} else {
c = "/y ";
}
s = " {s} {c} {p} ";
}
s = " {s}; ";
}
}
var properties=new Properties ();
properties.setProperty ("curves", s);
properties.store (new FileOutputStream (propertiesFileName(), "FxMemo");
}

The code above will save data about the drawn lines in a user home folder

Animation

Let's create an animation at start of the application. Let the picture from last session appear not at once but in parts. We shall create the trigger for this purpose:

trigger on FSFrame.tick [oldTick] =nextTick {
var numberFormat=NumberFormat.getInstance ();
for (i in [oldTick.. nextTick-1]) {
var one=lastSession [i];
if (one.trim () .length ()> 0) {
var tcurve = Polyline {
stroke: new Color (1,0,0,1)
strokeLineCap: ROUND
strokeWidth: 5
};
var xyArray=one.split (",");
for (xy in xyArray) {
if (xy.trim () .length ()> 0) {
var points=xy.split ("/");
var x=numberFormat.parse (points [0] .substring (1));
var y=numberFormat.parse (points [1] .substring (1));
insert [x, y] as last into tcurve.points;
}
}
insert tcurve as last into curves;
}
}
}

We shall change attribute /tick/ in a following code:

if (count> 0) {
var time=250*count;
frame.tick = [1.. count] dur time linear;
}

Loading of data will looks approximately so:

Source

fsmemo.zip - 2.5 Mb

- The source, the compiled application and JavaFx runtime.

For start of the application it is necessary to click a file dist/JavaFXFullScreen.jar.

Drawing is saved before exit in a user home folder in a file fxmemo.properties.txt and loaded at next start.

 

5
Your rating: None Average: 5 (1 vote)
Published at DZone with permission of its author, Sergey Surikov.

(Note: Opinions expressed in this article and its replies are the opinions of their respective authors and not those of DZone, Inc.)