Java Fx Demos

JAVA FX DEMOS A command line development of HelloWorld.fx 1 Introduction 2 Steps to follow 2.1 Download the JavaFX Shell 2.2 Include JavaFX Shell in the PATH 2.3 Create the JavaFX Program 2.4 Compile and execute Introduction JavaFX applications can be developed using the command line like any other Java application although it is highly recommended to use an IDE (such as NetBeans) or JavaFXPad. The Objective of this tutorial is to show that it's possible to develop JavaFX applications using command line and some of the caveats with using these tools. Download the JavaFX Shell Download the command line utilities from the zip file at https://openjfx.dev.java.net/servlets/ProjectDocumentList which will create a trunk/bin subdirectory containing the JavaFXShell that can be used to execute JavaFX programs. Include JavaFX Shell in the PATH Include the sub-directory that contains javafx.sh and javafx.bat which is in the trunk/bin sub-directory of the directory that was used to extract the zip file. On Windows systems You would do something which looks like PATH=%PATH%;C:\\javafx\trunk\binThere is an additional step that needs to be done on Windows to be able to include the current directory in the classpath. The initial part of the following line looks like: %java% %opts% %debug% %opengl% -classpath %~dp0../javafxrt/src/javafxneeds to be

changed to something like %java% %opts% %debug% %opengl% -classpath .;%~dp0../javafxrt/src/javafxto include the current directory(.). Create the JavaFX Program Use your favorite editor to create the HelloWorld.fx program HelloWorld.fx Code Preview import javafx.ui.*; Frame { title: "Hello World JavaFX" width: 200 height: 50 content: Label { text: "Hello World" } visible: true } On Windows systems javafx.bat HelloWorld.fx This should bring up the HelloWorld window as shown below. SCREEN SHOTS STEPS: ---------Choose the desired folder. Make directory E:\md ramya E:\cd ramya E:\ramya\md fxdemos E:\ramya\cd fxdemos E:\ramya\fxdemos>edit setpath.bat

< xml="true" ns="urn:schemas-microsoft-com:vml" prefix="v" namespace=""> Verify the path by typing E:\ramya\fxdemos>path In the same directory edit helloworld.fx

There is no need of compiling the fx file. Then move to f:\fx\trunk\bin In this folder, edit javafx.bat

We need not type any code in the javafx.bat file. We may see the sequence of codes which are already existing in the bat file as default. We see a series of files in f:\fx\trunk\bin directory. 1.javafxstart.bat 2.javafxstart.sh 3.javafx.sh 4.javafx.bat Return to parent folder: E:\ramya\fxdemos> Here type the following prompt: E:\ramya\fxdemos\javafx.bat helloworld.fx

When we close the helloworld window, we get returned to our parent folder e:\ramya\fxdeomos

JAVA FX TUTORIAL 1) Introduction The JavaFX Scripting Programming Language (JavaFX) is a new family of Sun products based on Java technology and targeted at the high impact, rich content market. JavaFX is a highly productive scripting language that enables content developers to create rich media and content for deployment on Java environments. JavaFX is a declarative, statically typed programming language. It has first-class functions, declarative syntax, list-comprehensions, and incremental dependency-based evaluation. It can make direct calls to Java APIs that are on the platform. Since JavaFX is statically typed, it has the same code structuring, reuse, and encapsulation features such as packages, classes, inheritance, and separate compilation and deployment units, that make it possible to create and maintain very large programs using Java technology. Using the JavaFX language it is possible to create GUI using swing GUI components. This document gives a description of the JavaFX programming language. 2) Some points to Consider JavaFX is specifically designed to optimize the creative process of building rich and compelling UI's.JavaFX was initially work with the NetBeans IDE, but it is expected to work with other IDEs as well. Sun is not replacing Swing with JavaFX; instead, JavaFX makes Swing much easier to use. With the new JavaFX language, the structure of the programmer's code closely matches the actual layout of the GUI, making it tangibly easier to understand and maintain. Performance is obviously an important issue. The architecture of JavaFX is meant to be highly performant. For example, the GUI components and back-end application objects are implemented in Java; JavaFX code is used only to create such components, configure , and wire them together. Since the JavaFX implementation handles event generation and dispatching, it can be optimized and all Swing applications built with JavaFX will benefit. Without JavaFX , programmers must effectively handcraft their own incremental evaluator for each new application -- adding property change listeners to and firing events from Java Beans, adding listeners to GUI components, and then determining what events need to fired and/or handled by each bean or component. These steps tend to be very error prone and difficult for programmers to optimize. Although JavaFX makes it very easy to create simple GUIs, it is designed to be capable of supporting GUIs of any size or complexity. In addition, JavaFX Script is intended to have the same level of IDE/tool support that Swing programmers are familiar with in Java: an editor with code completion, refactoring, a Javadoc-like documentation tool, a source-level debugger, a profiler, and ultimately a visual builder. JavaFX applications run on the Java Runtime Enviroment (JRE) on the desktop. JavaFX applications run on JavaFX Mobile also. Here after we will discuss about the Basic concepts relating to Syntax, Semantincs and Typical usage in JAVAFX and modifications comparedto JAVA. 3) Basics Concepts The JavaFX programming language provides four primitive data types: String, Boolean, Number, and Integer. The below example shows the typical usage of these data types. (->

means Result) var s = "JavaFX"; s.toUpperCase(); -> "JAVAFX"; s.substring(1); -> "avaFX"; var n = 1.5; n.intValue(); ->1 (1.5).intValue(); ->1 s.substring(n); -> "avaFX " var b = true; b instanceof Boolean; -> true Coercions are automatically performed on numeric types when passing arguments or return values to/from Java methods. In addition, implicit truncating coercions are performed when converting Numbers to Integers. In JavaFX, the var keyword introduces a new variable. we may specify the type of a variable in its declaration. However, that's optional in JavaFX. If we don't specify the type, the JavaFX interpreter infers the variable's type from its use. A variable declaration takes the form: var variableName : typeName [?,+,*] = initializer; where ? means optional or Null + means One or More * means Zero or More. Consider the following Example var nums:Number* = [1,2,3]; It declares a new variable named nums whose value is defined to consist of zero or more instances of type Number and whose initial value is [1,2,3].The :typeName, [?,+,*], and = initializer portions of the declaration are optional, so var nums = [1,2,3]; is equal to var nums:Number* = [1,2,3]; JavaFX functions represent a pure functional subset of the JavaFX programming language. The body of a function may only contain a series of variable declarations and a return statement. An example: function z(a,b) { var x = a + b; var y = a - b; return sq(x) / sq (y); } function sq(n) {return n * n;} function main() { return z(5, 10); } 4) Arrays The most commonly used data structure is the array, which in JavaFX is written with square brackets and commas, AN example: var week_days = ["Mon","Tue","Wed","Thur","Fri"]; var days = [week_days, ["Sat","Sun"]];

Arrays represent sequences of objects. In JavaFX arrays are not themselves objects, however, and do not nest. Expressions that produce nested arrays are automaticallly flattened. days == ["Mon","Tue","Wed","Thur","Fri","Sat","Sun"]; -> returns true The size of an array may be determined with the JavaFX sizeof operator: var n = sizeof days; -> n = 7 There is a shorthand notation using ".." for arrays whose elements form an arithmetic series. An Example: function fac(n) {return product([1..n]);} var result = sum([1,3..100]); The elements of an array must all be of the same type. Arrays may be indexed as in Java: var wednesday = days[2]; 4.1) Data Modification Operators In addition to the assignment operator, JavaFX provides data modification operators. 1. insert 2. delete 4.1.1) insert The insert statement can take any of the following forms: insert Expression1 [as first as last] into Expression2 insert Expression1 before Expression2 insert Expression1 after Expression2 The insert statement inserts the items returned by evaluating Expression1 into the location indicated by remainder of the statement as follows: 4.1.2) into Expression2 must refer to an attribute or variable. If Expression2 refers to a single valued attribute then the effect of the insert is the same as if the assignment operator were used. If as first is specified, the insertion location is before the first element of the list indicated by Expression2. If as last is specified, the insertion location is after the last element of the list indicated by Expression2.Here are some Examples: var x = [1,2,3]; insert 12 into x; -> [1,2,3,12] insert 10 as first into x; -> [10,1,2,3,12] insert [88,100] as last into x; -> [10,1,2,3,12,88,100] If neither specified, by default it is last. 4.1.3) before, after Expression2 must be a selection expression over an attribute or variable. If before is specified, the insertion location is before the selected elements. If after is specified the insertion location is after the selected elements. Here are some Examples: var x = [1,2,3]; insert 10 after x[. == 10]; -> [1,2,3,10] insert 12 before x[1]; -> [1,12,2,3,10] insert 13 after x[. == 2]; -> [1, 12, 2, 13, 3, 10]; 4.1.4) delete The delete statement takes one of the following forms: delete variable -> 1 delete Expression.attribute -> 2 delete variable[predicate} -> 3

delete Expression.attribute[predicate] -> 4 1 & 2 remove all elements from a variable or attribute - which is equivalent to assigning [] or null to the variable or attribute. 3 & 4 remove only those elements that match the predicate. Here are some Examples: var x = [1,2,3]; insert 10 into x; -> [1,2,3,10] insert 12 before x[1]; -> [1,12,2,3,10] delete x[. == 12]; -> [1,2,3,10] delete x[. >= 3]; -> [1,2] insert 5 after x[. == 1]; -> [1,5,2]; insert 13 as first into x; -> [13, 1, 5, 2]; delete x; -> [] 4.2) select & foreach operators JavaFX supports list comprehensions with a familiar syntax that should be easily understood by Java programmers using select and foreach operators. These operators are used for querying the arrays. Here are some Examples: class Album { attribute title: String; attribute artist: String; attribute tracks: String*; } var albums = [Album { title: "AAAAAAA" artist: "BBBBBBB" tracks: [" First line", " Second line"….] }, Album { title: "CCCCCCC" artist: "DDDDDDD" tracks: [" First line", " Second line"….] }]; -> Get the track numbers of the albums' title tracks -> using the select operator: var titleTracks = select indexof track + 1 from album in albums, track in album.tracks where track == album.title; -> [1,4] -> the same expressed using the foreach operator: titleTracks = foreach (album in albums,

track in album.tracks where track == album.title) indexof track + 1; -> also [1,4] A list comprehension consists of one or more input lists, an optional filter and a generator expression. Each source list is associated with a variable. The result of the list comprehension is a new list which is the result of applying the generator to the subset of the cartesian product of the source lists' elements that satisfy the filter. List comprehensions give a concise syntax for a rather general class of iterations over lists. Another simple example of a list comprehension is: select n*n from n in [1..100] This is a list containing the squares of all the numbers from 1 to 100. Note that "n" is a local variable of the above expression. The use of a filter is shown by the following definition of a function which takes a number and returns a list of all its factors, function factors(n) { return select i from i in [1..n/2] where n % i == 0; } 5)Strings and Its Operations In JavaFX, a literal character string is specified with single quotes, An Example var s = 'Hello'; or with double quotes: var s = "Hello"; 5.1) Number, and Date Formatting JavaFX has a built-in String formatting operator (format as), which has the following syntax: expr format as directive The format as operator supports java.text.DecimalFormat, java.text.SimpleDateFormat, and java.util.Formatter formatting directives. If the formatting directive starts with %, then java.util.Formatter is used, otherwise if expr is of type Number then java.text.DecimalFormat is used, otherwise if expr is of type java.util.Date then java.text.SimpleDateFormat is used. The directive operand is syntactically an identifier, not an expression. This allows the content of directive to be statically checked for correctness at compile time. Here is an Example import java.util.Date; 100.886 format as <