Tuesday Mar 23, 2010

JavaFX - Wizard UI


This demonstrates implementation of simple wizard user interface using a combination of Container, Button and bind.

<script src="http://dl.javafx.com/1.2/dtfx.js"></script> <script src="http://javafxdemos.googlecode.com/hg/resource/JavaFXWizard/JavaFXWizard.js"></script>


To launch click on above image or

I have a main Container - Wizard. This has the navigation buttons and a sequence of Containers - WizardPanel, which contains the user interface for each panel. A variable selectedIndex in Wizard keeps track of currently shown panel. Variable selectedPanel holds the instance of selected panel. A new panel instance is set to this variable when index is updated. The node is bound to content so as to update UI when a new panel is set. Disabled state of "Back" and "Next" button is set dynamically using bind with selectedIndex.

The panels in demo uses a series of SVG images - Duke, Lamborghini and Tiger. Its converted into FXZ format using JavaFX Production Suite - SVG Converter and ofcourse the text is from wikipedia

Please try it out and let me know feedback..

About


The views expressed on this blog are my own and do not necessarily reflect that of my organization

Search

Categories
Archives
« April 2014
SunMonTueWedThuFriSat
  
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
   
       
Today