JavaFX 2.0 Introduction by Example book

19 12 2011

I recently finished writing a book on the new release of the JavaFX 2.0 SDK and it has already been placed on the shelves at a bookstore (Amazon) near you. The book will walk you through, step-by-step, giving you the ins and outs of JavaFX 2.0. When you encounter a chapter you will be presented recipes which will pose a problem (use case scenario) that will have an associated solution. After a proposed solution you will be shown an example source code listing and its display output after the program has been executed. Lastly you will be shown a section called “How it works” which will explain and discuss the examples and their details. To see more about this book, such as the source code and errata, please visit Apress Publishing (http://www.apress.com/9781430242574).

In this blog entry I also want to give you a sneak preview of a Java Webstart example of chapter 3 recipe 3-1 (JavaFX 2.0 MP3 Player). To launch the JavaFX MP3 player just jump down to Chapter 3 below.

Below is a brief overview of the chapters in the book:

Chapter 1: JavaFX Fundamentals

I begin by instructing you on how to get your environment set-up to rapidly develop rich internet applications using Java and JavaFX.

JavaFX Swiss army knife

After reading this chapter you will be able to answer questions such as:

  • How do I create GUI applications?
  • What is the Scene graph?
  • How do I display text onto the scene graph?
  • How do I incorporate UI controls into my application?
  • How do I bind expressions?
  • How do I draw shapes?
  • How do I generate a background process?
  • How do I associate keyboard sequences to applications?

Chapter 2: Graphics with JavaFX
In chapter 2 there are recipe examples which delve into JavaFX’s graphics and animation capabilities. I begin by explaining some of the basics of JavaFX’s Graphics such as rendering images and animating nodes. I then go on to more advanced topics such as animating with transitions, manipulating layouts, and enhancing nodes using JavaFX CSS.
The following picture, taken from Recipe 2-2, depicts an image viewer application with a custom news ticker control at the bottom.

Photo Viewer and News Ticker application

Photo Viewer and News Ticker application

Chapter 3: Media with JavaFX
Chapter 3 covers all things media related. Here I reveal JavaFX’s media APIs which allows you to integrate audio and video into your applications. I begin by showing you how to create a JavaFX MP3 player and a video player. Then I will walk you through the different ways to enhance the video player with additional features to control media actions and events, mark positions in a video, and synchronize animations.

The illustration below, taken from Recipe 3-1, depicts a JavaFX 2.0 MP3 player with a graphical visualization (using the AudioSpectrumListener API). Before launching the example you will need to know the requirements and instructions to run the demo example.

JavaFX 2.0 MP3 Player

JavaFX MP3 Player

Simple requirements and instructions to run the JavaFX 2.0 MP3 Player:

Requirements

  • Java 6 update 24 JRE or greater (Java 7 is preferred)
  • JavaFX 2.0 or greater (JavaFX 2.0.2 is preferred)
  • Windows XP SP 3 or greater. (I will update the jnlp as JavaFX becomes available on other OSes)

Instructions

  1. Click the Webstart launch button below.
  2. By using your file explorer on your host operating system “drag and drop” a music mp3 file onto the surface of the application.
  3. Use the controls to the bottom right of the application to pause, play, and stop the music.
  4. You may use your mouse to drag the application around your desktop.
  5. To close the application click on the ‘X’ in the upper right hand corner.

To launch the application click on the Java Webstart button below:

Demo JavaFX 2.0 MP3 Player

Chapter 4: JavaFX on the Web
In chapter 4 you will be able to take advantage of the interoperability between JavaFX and HTML5.

For starters I will cover how to embed JavaFX applications into a Web page. I then will demonstrate JavaFX’s powerful WebView and WebEngine APIs. Below are the recipe examples from chapter 4 which utilize the  WebView and WebEngine APIs:

  • Displaying HTML5 Content (animated analog clock application)
  • Loading data from a Web service (weather application)
  • Handling Web events
  • Storing and displaying data using an embedded database (RSS reader application)

Depicted below is an animated analog clock application, taken from Recipe 4-2, demonstrating the ability to render HTML5 content.

JavaFX 2.0 Analog Clock

JavaFX 2.0 Analog Clock (HTML5)

I assume you know the Java programming language and some web development concepts. I hope you will enjoy these examples which can be used freely in your own projects. I’ve tested the examples with the latest Java 7 update 2 and JavaFX 2.0.2 runtime and SDK. If you have any questions or comments feel free to ask them here or on my Twitter account @carldea .

Thanks!

Carl





Does JavaFX have Multiple Inheritance?

29 06 2009

CatDog cartoon from Nickodean

CatDog cartoon from Nickelodeon

Introduction

Often when we learn about object oriented programming we try to find out if a particular language contains a dirty little phrase called multiple inheritance. Of course there are good reasons to try to avoid it (Diamond Problem) but sometimes you can’t.  I believe that it can be used in certain contexts which can be done safely (fearing and trembling from angry purists). In Java when asked if multiple inheritance is supported the answer is “Well, Sort of” or “Yes, but…“. Java has interfaces which follows the Design by Contract concept which forces the developer to implement the interface methods. Fundamentally when we think of abstraction we think of what behavior is common across classes. Abstract classes help but tend to get bloated and some folks resort to creating NOP (No operation performed) methods. One of the major principles of object oriented programming is re-use not un-re-use while rendering an object very coupled-ygoop. It would be wonderful if you could have method re-use from an abstract data type. Well, JavaFX has this ability to do this very thing! So, to ask the question again “Does JavaFX have multiple inheritance?“. I would answer it like this: “Yes, its similar to Java’s Interfaces but with implementation details“. JavaFX uses a concept called Mixin classes which allows the developer to inherit multiple classes. Sweet!

Example

I couldn’t help but think about all kinds of cats when thinking about multiple inheritance (not to be confused with these types of cats I Can Has Cheezburger ). In a nutshell there are Big cats and Small cats.

Requirements:

  • Some Big cats can roar, but all big cats can’t meow.
  • Similarly small cats can meow, but all small cats can’t roar.
  • All cats can purr.

In this example we will model reusable behavior as Mixins and we will also create the standard abstract classes such as “Animal” and “Cat“.

Step 1: Create Abstract Classes

abstract class Animal {
    public var name:String;
    public function eat(food:String){
        println("munchin on {food}");
    }
}

abstract public class Cat extends Animal {
    public function purr(volume:Integer){
        println("Purrrr...level({volume})");
    }
    public function scratch(){
        println("Scratching...")
    }

}

Step 2: Create Mixin Classes

public mixin class Roarer {
    public var bass:Integer = 20;
    public function roar(){
        println("Roar...");
    }
}

public mixin class Meower {
    public var pitch:Integer = 5;
    public function meow(){
        println("Meow...");
    }
}

Step 3: Create Derived Classes Inheriting Mixin Classes

// Cheetah's can't roar and can't meow
class Cheetah extends Cat {
}

class Lion extends Cat, Roarer{
    public override var bass = 50;
    public override function roar() {
        println("(ROAR) I'm King of the land!!!");
    }
}

class HouseCat extends Cat, Meower {
    public override var pitch = 10;
    public override function meow(){
        println("Meow...");
    }
}

Step 4: Create instances of the types of Cats

var fluffy:Cat = HouseCat{name:'fluffy'}; // regular house cat
var simba:Cat = Lion{name:'Simba'};      // Lion King cat
var chester:Cat = Cheetah{name:'Chester'}; // Cheetos' Chester

var cats:Cat[] = [fluffy, simba, chester]; // cat bus

Step 5: Create a script level function

Cat will ask to come into your house. Notice the down cast to Meower and Roarer type cats.

function letMeIntoHouse(cat:Cat){
        print("LET ME IN! ");
        if (cat instanceof Meower){
            var meower = (cat as Meower);
            meower.meow();
        }
        if (cat instanceof Roarer){
            var roarer = (cat as Roarer);
            roarer.roar();
        }
        cat.scratch();
}

Step 6: run() function like Java’s main()

This will loop through a sequence of cats by:

  • Cat asking in your house
  • Introduces cat
  • Feeds cat
  • Cat will purr
  • function run(){
        def food:String = "tender vittles";
        for (cat:Cat in cats){
            letMeIntoHouse(cat);
            print("The cat named {cat.name} is ");
            cat.eat(food);
            cat.purr(5);
        }
    }

    Output

    LET ME IN! Meow...
    Scratching...
    The cat named fluffy is munchin on tender vittles
    Purrrr...level(5)
    LET ME IN! (ROAR) I'm King of the land!!!
    Scratching...
    The cat named Simba is munchin on tender vittles
    Purrrr...level(5)
    LET ME IN! Scratching...
    The cat named Chester is munchin on tender vittles
    Purrrr...level(5)

    Conclusion

    Although this example doesn’t use Mixins in an RIA context, instead its used with simple domain objects to show multiple inheritance. Hopefully we can now answer the question when asked, “Does JavaFX have multiple inheritance?“. Is it ever a quick answer?

    References:








    Follow

    Get every new post delivered to your Inbox.

    Join 76 other followers