In Swing, an image button is possible by setting the background color of the JButton to transparent and the image will still show its pressed and normal state effect when clicked.
In Java FX 2 however, when you add an image to the Button control and set the background to transparent using -fx-background-color: transparent, you are left with a static image that does not move whenever you click on it.
There is no ready made class in Java FX 2 that does this so the only solution left is to make one. What I did is extend from Button class and simulate the pressed and released effect by changing the padding values whenever a mouse event occurs.
There was a previous post about this where you add round corners on an ImageView widget. That code can only be used programmatically so to be able to do the same thing within an XML file, a custom class has to be made in order for this to work.
User Devunwired of StackOverflow had made a custom class that works seamlessly and easily incorporate it in your XML.
I actually forgot where I got this but if you Google it, there should be a ton of them scattered across forums posting the same method such as the one below.
While some of you may want the implementation as a custom ImageView class widget so it can be used in XML (this will be in another post), this piece of code aims to help users attain the same result through code.
Considering that widgets do not accept custom views, this method simply did the trick.