Simple example of Scroll Bar - JavaFX 1.2

Tuesday Jul 28, 2009

ScrollBar - UI Control feature of JavaFX 1.2 .

It has been used in lot of samples but if you are finding it tough to grab out the code from sample to use. Here is a simple(simplest actually :) ) code to use scrollBar. I have create array of rectangle and associated scroll bar with it. Something like this :

And here is the code :

  
package simplescrolluse;

import javafx.scene.control.ScrollBar;
import javafx.scene.Group;
import javafx.scene.paint.Color;
import javafx.scene.paint.LinearGradient;
import javafx.scene.paint.Stop;
import javafx.scene.Scene;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;
import javafx.stage.StageStyle;

var rect: Rectangle[];

for(i in [0..20]) {
    var re = Rectangle {
            x: 0
            y: 35 *i  + 28
            width: 220, height: 34
             fill: LinearGradient {
                startX : 0.0
                startY : 0.0
                endX : 0.0
                endY : 1.0
                stops: [
                    Stop {
                        color : Color.web("#0174DF")
                        offset: 0.0
                    },
                    Stop {
                        color : Color.web("#58ACFA")
                        offset: 0.5
                    },
                    Stop {
                        color : Color.web("#0174DF")
                        offset: 1.0
                    },

                ]
            }
            opacity: 0.9
            stroke: Color.BLACK
             strokeWidth: 1
           } insert re into rect;
}

var scroll = ScrollBar {
        translateX: bind 240 - 10
        translateY: 44
        height: 320 - 65
        scaleX: 0.5
        blockIncrement: 16
        clickToPosition: false
        min: 0
        max: 5
        vertical: true
    };

    var rect_height: Integer = 35;
    var contactList: Group = Group {
        translateY: bind 0 - scroll.value * rect_height
        content: [ rect ]
    } ;

Stage {
    title: "Simple ScrollBar Use"
    width: 240
    height: 320
    style: StageStyle.UNDECORATED
    scene: Scene {
        content: [
            scroll, contactList
        ]
    }
} 
Please let me know if you stuck in any complication with ScrollBar. Actually it looks easy but scroll bar is a complicated thing. Have fun !
 

Like this post? | | | |

Posted at 03:28PM Jul 28, 2009 by vaibhavc in JavaFX
Tags: api code javafx sample