Macca Blog

My life experiences with code and design


Posted on by Mark

I have recently been playing around with the JavaFX preview SDK released earlier this year and although it has been receiving mixed reviews, I personally like it. Its simple, clean and fun to work with.

A lot of the new RIA frameworks like Flex and Silverlight are also fun to use, but I feel like the Java community really need a winner in the UI space, and JavaFX looks like it could be that winner.

The JavaFX scripting language FX script, it very easy to read, is very flexible and no doubt with the 1.0 release of the SDK, will only get better.

I have been messing around with the language, making up quick little fun projects using netbeans, and I intend to post the examples that I have developed as I go. Starting today!

Introducing, the:

Mouse Orientation JavaFX application

I should start with why I made this app, I have been a long time server side enterprise developer using Java, .NET, php, etc… and have always wanted to get into gaming. So I looked into it, and what a different world that is! So many different mind sets to learn and techniques, gotchas, maths, etc… I really enjoyed it.

So I thought I would start to get my head around the different fundamentals of gaming by writing small components that could get used in games later on in my JavaFX/(any gaming venture that I come across) life time.

This one simply implements a mouse direction/orientation based approach where a small circle “follows” the mouse’s location on screen, but is bound by an outer circle.

This could be used in any targeting system in a game where something needs to track/follow/aim at, etc… and was very simple to implement in JavaFX.

Here is a screen shot: (note that the mouse cursor is not shown, stupid print screen, however, just imagine that its in the top right corner, in line with the red circle and the center of the larger circle)

The code follows:

package mouseorientation;

import javafx.application.Frame;
import javafx.application.Stage;
import javafx.scene.geometry.Rectangle;
import javafx.scene.paint.Color;
import javafx.scene.geometry.Circle;
import javafx.input.MouseEvent;

import java.lang.*;
import javafx.scene.geometry.Line;

* @author Mark Macumber
var screenWidth:Integer = 500;
var screenHeight:Integer = 500;

var center_pos_x:Number = screenWidth / 2;
var center_pos_y:Number = screenHeight / 2;

var moving_circ_xpos = center_pos_x;
var moving_circ_ypos = center_pos_y;

var movingCirc:Circle = Circle {
centerX: bind moving_circ_xpos,
centerY: bind moving_circ_ypos
radius: 4
stroke: Color.RED

var outlineCircle:Circle = Circle {
centerX: center_pos_x, centerY: center_pos_y
radius: 50
stroke: Color.BLACK
opacity: 0.5

Frame {
title: "Mouse Orientation"
width: screenWidth
height: screenHeight
closeAction: function() {
java.lang.System.exit( 0 );
visible: true

stage: Stage {
content: [
//Main Rectangle
Rectangle {
x: 0, y: 0
width: screenWidth, height: screenHeight
fill: Color.WHITE

onMouseMoved: function( e: MouseEvent ):Void {
var xpos:Number = e.getX();
var ypos:Number = e.getY();

if (not outlineCircle.contains(xpos, ypos)){
var vec_y = ypos - center_pos_y;
var vec_x = xpos - center_pos_x;

var angle_deg = Math.toDegrees(Math.atan2(vec_y, vec_x));

if (angle_deg < 0)
angle_deg += 360;

var angle_rad = Math.toRadians(angle_deg);

//new x/y points:
var radius = 50;
moving_circ_xpos = (radius * Math.cos(angle_rad)) + center_pos_x;
moving_circ_ypos = (radius * Math.sin(angle_rad)) + center_pos_y;

//outlining circle

//moving circle that will follow the mouse

Here is a link to the webstart deployment of this JavaFX app.

As you can see, there is very little code to accomplish this, and I think it gives a simple effect.

More JavaFX to come…

Note: as a small disclaimer, I know this can be done easily in other languages, and stuff, this is just my own implementation in JavaFX, and also criticism is welcome as I want to learn as I go too.

This entry was posted in games programming, JavaFX. Bookmark the permalink.

Leave a Comment

Your email address will not be published. Required fields are marked *