Login | Register   
Twitter
RSS Feed
Download our iPhone app
TODAY'S HEADLINES  |   ARTICLE ARCHIVE  |   FORUMS  |   TIP BANK
Browse DevX
Sign up for e-mail newsletters from DevX


Tip of the Day
Language: JavaFX
Expertise: Advanced
Aug 5, 2008

Create a Menu Bar with JavaFX

Here's a JavaFX example that creates a nice menu bar. All you need is a set of images named: home_1.bmp (unpressed), home_2.bmp (pressed), news_1.bmp, news_2.bmp,contact_1.bmp, contact_2.bmp, photos_1.bmp and photos_2.bmp:

import javafx.ui.*;
import javafx.ui.canvas.*;
import javafx.ui.filter.*;
import java.lang.System;

class NiceMenu extends CompositeNode{
attribute home: String;
attribute news: String;
attribute contact: String;
attribute photos: String;
}

attribute NiceMenu.home = ".//images//home_1.bmp";
attribute NiceMenu.news = ".//images//news_1.bmp";
attribute NiceMenu.contact = ".//images//contact_1.bmp";
attribute NiceMenu.photos = ".//images//photos_1.bmp";

function NiceMenu.composeNode() = 

Group {
    transform: []     
    content: [ImageView {
        transform: translate(180,72)
        image: Image { url: bind home }
        onMouseEntered: operation(e:CanvasMouseEvent) {              
               home=".//images//home_2.bmp";
               }
        onMouseExited: operation(e:CanvasMouseEvent) {              
               home=".//images//home_1.bmp";
               }
    },
    ImageView {
        transform: translate(240,73)
        image: Image { url: bind news }
        onMouseEntered: operation(e:CanvasMouseEvent) {              
               news=".//images//news_2.bmp";
               }
        onMouseExited: operation(e:CanvasMouseEvent) {              
               news=".//images//news_1.bmp";
               }
    },
    ImageView {
        transform: translate(295,73)
        image: Image { url: bind contact }
        onMouseEntered: operation(e:CanvasMouseEvent) {              
               contact=".//images//contact_2.bmp";
               }
        onMouseExited: operation(e:CanvasMouseEvent) {              
               contact=".//images//contact_1.bmp";
               }
    },    
    ImageView {
        transform: translate(473,73)
        image: Image { url: bind photos }
        onMouseEntered: operation(e:CanvasMouseEvent) {              
               photos=".//images//photos_2.bmp";
               }
        onMouseExited: operation(e:CanvasMouseEvent) {              
               photos=".//images//photos_1.bmp";
               }    
    }]
};

//Afisarea meniului se poate face astfel
Frame {
    centerOnScreen: true
    visible: true
    height: 200
    width: 1100  
    title: "Nice Menu"
    onClose: operation() {System.exit(0);}
    content: ScrollPane {        
        var color=Color{
            red:64
            green:64
            blue:74
        }
        background: color
        view: Canvas {
            background: black
            cursor: DEFAULT
            content: NiceMenu
        }
    }
}
Leonard Anghel
 
Comment and Contribute

 

 

 

 

 


(Maximum characters: 1200). You have 1200 characters left.

 

 

Sitemap