Reading Twitter with JavaFX

twitter bird

Twitter is a social network and micro-blogging service that allow you to create and read tweets, 140 characters text-based posts. It’s becoming a popular tool to keep in touch with your friends, coworkers, bloggers, etc. Here we’ll create a very simple application that show us tweets related with a given word.

Twitter offers a very simple and powerfull REST API which supports XML, JSON, and the RSS and Atom formats. As we are aiming just to read tweets we’ll use just the Search API.

We do that in three steps:

  1. Query Tweets
  2. Parser the Atom result
  3. Show tweets into a GUI

Let’s see them in the order of dependence beetween them.

Displaying a Tweet

var gradient = LinearGradient {
    startX: 0.0,
    startY: 0.0,
    endX: 0.0,
    endY: 150.0
    proportional: false
    stops: [Stop {offset: 0.0 color: Color.DARKGRAY },
        Stop { offset: 1.0 color: Color.BLACK }]
}
 
public class Tweet extends CustomNode {
    public var image: Image;
    public var username: String;
    public var message: String;
    public override function create(): Node {
        var txt = Text {
            x: 65  y: 35 wrappingWidth: 150 fill: Color.WHITE
            content: "{message}"
        }
        return Group {
            content: [
                Rectangle {
                    width: 220 height: txt.boundsInLocal.height + 40
                    arcHeight: 10 arcWidth: 10 fill: gradient
                },
                ImageView {
                    x: 5 y: 20 image: image
                },
                Text {
                    x: 65  y: 20 fill: Color.BLACK content: "{username} said"
                },
                txt
            ]
        };
    }
}

For example, this tweet would become:

tweet example

Parsing ATOM result

In my last post about JavaFX I showed how to parse XML documents (and make sandwiches) with JavaFX. Here we’ll use the Atom format, but use any other would be almost the same. Parsing XML or JSON documents with JavaFX is both very simple using the javafx.data.pull.PullParser class.

A query output is a Atom XML document with several information. We are interested only in the fields that holds the avatar image, the message and the user name.

var tweets = VBox {}
def parser = PullParser {
    var avatar;
    var firstname;
    var text;
    documentType: PullParser.XML;
 
    onEvent: function(event: Event) {
        if(event.type == PullParser.START_ELEMENT){
            if(event.qname.name.equals("link")){
                if(event.getAttributeValue(QName{name: "rel"}) == "image"){
                    avatar = event.getAttributeValue(QName{name:"href"});
                }
            }
        }
 
        if(event.type == PullParser.END_ELEMENT) {
            if(event.qname.name == "title"){
                    text = event.text;
            }
            if((event.qname.name == "name")and(event.level==3)){
                var names: String[] = event.text.split(" ");
                firstname = names[0];
                insert Tweet {
                        image: Image {
                            url: avatar
                        }
                        message: text
                        username: firstname
                    } into tweets.content;
            }
        }
    }
}

Querying Tweets

We can get Atom results through url queries like that:

Notice that queries should be URL encoded. We will use a additional parameters &rpp=4 to receive only 4 results per page. To know more about search queries read the Search API Documentation. We get these results as InputStreams making asynchronous HTTP requests using the javafx.io.http.HttpRequest class, which it’s perfect to invoke RESTful Web Services.

word = "Beatles";
var request = HttpRequest {
    location: "http://search.twitter.com/search.atom?q={word}&rpp=4";
    onInput: function(stream: java.io.InputStream) {
        parser.input = stream;
        parser.parse();
    }
}
request.enqueue();

Conclusion

Here is the application running for the word “House”.

twitter with javafx

Is not a complete Twitter client, as it’s not intended to be, but can show you how to handle a simple asynchronous call and handle Twitter documents. There’s already a few beta JavaFX Twitter clients like Tweetbox and Twitterfx and certanly others will appears.

Download

Sources and Netbeans project, fxtwitter.tar.bz2.

6 thoughts on “Reading Twitter with JavaFX

  1. Hi….
    i need to the following…
    on clicking one image i need to show another image…that is wen u give an onclick event the 2nd image will appear.i have done till here..but wen i move the mouse even slightly the 2nd image disappears, now i don’t want the 2nd image to be disappeared on mouse movement..how do i do this..

  2. hi….
    one more thing i wud like to know is..wen i click on am image a textbox shud appear..it shud be invisible at the begining….

  3. Hey there, I ran across your website by means of The search engines whilst seeking a related subject, your website showed up, it appears good. I’ve got saved as a favorite it inside my google bookmark

Leave a Reply

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

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>