Return to See main Page
Key FeaturesWeb Services Graphics API Animation Skill LevelbeginnerLast UpdatedApril 23, 2009
Share
Yahoo Buzz
Facebook
Myspace
Digg
Reddit
Delicious
Newsvine
View Source Code
ImageButton.fx
Main.fx
Photo.fx
PhotoPullParser.fx
ThumbImage.fx
Download Source Code

Profile

Rakesh Menon

JavaFX Flickr Client

By Rakesh Menon, April 23, 2009

Mosaic is a client for Flickr. It uses Flickr's REST API (flickr.photos.search) to search and obtain pictures from Flickr based on its tags.

By default the images obtained from Flickr are scattered around the border of window. Image will be zoomed when its dragged from border towards center. If mouse is moved out of Image, size is restored and image is moved towards border of window.

Do not use the api-key used by this sample. Obtain your own key from flickr.com

Understanding the Code

HttpRequest is used to search for specified tag and fetch image metadata using flickr.photos.search API. The information is obtained in XML format which is parsed using PhotoPullParser.

The image is rotated and translated at the same time using TranslateTransition and RotateTransition animation APIs. These two animations are executed at the same time using ParallelTransition API.

When the image is dragged towards the center, scale factor of image node is calculated based on the distance from border towards the center. Scale is increased as the distance between center and image location is reduced.

If you are using proxy-server for connecting to internet, please follow setup as specified in "Java Networking and Proxies".

Customizing Progress Bar

This sample demonstrates how to customize the default progress bar. You can add the custom progress bar with the different background color, the animation icon, the size and location of progress bar or icon.

The detault progress bar can be customized with the following attributes;

  • Background color: progress.background.color
  • Animated icon: progress.icon.url
  • Location of an icon image: progress.icon.x, progress.icon.y
  • Location of the progressbar: progress.bar.x, progress.bar.y
  • Size of the progressbar: progress.bar.width, progress.bar.height

In this example, the background is black (0x000000). The custom icon is added to the relative directory ../desc-resources/mosaic_animation.gif, and the Y coordinate of the custom icon is set to "38". The location of progress bar is set to the coordinate (350, 90) , and the size of progress bar is modified by setting "progress.bar.width": "300" .

Source Code
    javafx(
        {
            archive: "webstart/Mosaic.jar,",
            width: 800,
            height: 600,
            code: "mosaic.Main",
            name: "appl"
        } , { 
            "progress.background.color": "0x000000", 
            "progress.icon.url": "../desc-resources/mosaic_animation.gif", 
            "progress.icon.x": "350", 
            "progress.icon.y": "90", 
            "progress.bar.y": "38", 
            "progress.bar.width": "300"
        } 
    );

References