Well, this tutorial is intended to help AC Seigi start using JavaFX for all your needs for UI.
An introduction pequeninos: diseniada JavaFX is a platform for everything related to user interface, 2D, 3D, multimedia, forms, etc ...
Unlike other (. NET, Flex, JavaFX etc ...), not based on XML, but that is another programming language, but much less strict than Java in terms of syntax, and more flexible in terms of functionality. If you "click" with JavaFX'll be able to do amazing things very easy in no time. Best of all is that both Eclipse and NetBeans JavaFX lets you combine Java in the same project, and the interaction between them is clear ... Both are java!
Well, for starters, download the SDK:
http://java.sun.com/javafx/
JavaFX Once you have installed, download the plugin for Eclipse or NetBeans . If you download the Eclipse, just be sure to put your eclipse in a directory without spaces, because the plugin has an error.
Now, let's just beginning.
The extension of a JavaFX script is. Fx, and basically we have two ways to make a script, the first component is to enter directly, and the second component is declaring a "Custom" ... Vamonos entry focusing on the first guy to go slow ...
We write some code:
javafx.scene.text.Text import, import
javafx.scene.text.Font;
Text {font: Font {
size: 24}
and: 20
content: "Hello World!"
}
To begin, as in all Java, go Imports. But before that you can also put them in a package, as in Java. After taking the import, comes the declaration of components, in our case we are creating a text that says "Hello World." Deploy Hello World.
As you can see, the Text class is an anonymous object, which means? we do not know the subject matter, so I simply put it: Text {... If we wanted to manipulate it in some way then we assign to a variable:
var text: Text = Text {....
}
As you can see, the policy "var" is used to declare a variable, followed the variable name, followed by the colon, which in this case means "type", and finally the equalization ... JavaFX does not require the "new" simply declare the object.
Within Text have 3 properties, "font", "y" and "content." With "font" assign a font to allocate put the two points while the class you want to assign, in this case create a new anonymous object that we attach to the font property ... in Java would do something like this:
texto.setFont (new Font ());
course, we would fail to assign the s size, and that is why JavaFX makes it easier, because we do not occupy first assign a variable to fill their values, but in the same statement can do it.
Property "and" is to tell the vertical position of text, and "content" is what is deployed. JavaFX has standardized the property "content", as this always serve to display on screen.
Now, let's do something more interesting ... Let's put a text box.
javafx.scene.text.Text import, import
javafx.scene.text.Font;
javafx.scene.control.TextBox import, import
javafx.scene.layout.VBox;
{VBox
content: [Text
{font: Font {
size: 24}
content: "Hello World!"
}
TextBox {text: "Enter something here"
columns: 30
}]}
use VBox to say that distribute our components vertically, this means to deploy "Hello World" and then down a box to enter text. Also notice that no longer needed and the Text property as a VBox layout, is well positioned to take charge of everything.
This was not interesting ... I know, but now if we move to Binding, something I love about JavaFX, what we do is that when you change the text of the TextBox, will be deployed in the text that is above ...
javafx.scene.text.Text import, import
javafx.scene.text.Font;
javafx.scene.control.TextBox import, import
javafx.scene.layout.VBox;
var text: TextBox;
VBox {content: [Text
{font: Font
{size: 24}
content: bind texto.text
}
{TextBox text =
text: "Enter something here"
columns: 30}
]}
To begin, we declare a variable of type TextBox called text, and content of the Text we say it will be equal to "bind" of "texto.text", this means that when recognize a new value of the box "text" automatically update the content of Text. Then, as I had mentioned, we create the TextBox assigning the object to the variable "text." We run our example and we can see that when you press Enter to modify the text above as we enter.
The bind function not only allows you to "Binder" values, but you can also enter formulas and code.
But we are doing something a little more interesting, another feature that fascinates me when I saw ... Ready! Let's make an arrangement of strings, and when you enter a new value in a TextBox and press a button generate a new String ... Easy:
javafx.scene.text.Text import, import
javafx.scene.text.Font;
javafx.scene.control.TextBox import;
import javafx.scene.control.Button;
import javafx.scene.layout.VBox;
var texto : TextBox;
var estrings : Text[];
VBox {
content: [
texto = TextBox {
columns: 30
},
Button {
text: "Agregar"
action: function() {
insert Text { content: "{texto.text}" } into estrings;
texto.text = "";
}
}
VBox {
content: bind estrings
}]}
are we doing? We declare as our text object, then declare a list of "estrings" which simply contain a list of estrings ... Then add a button that when pressed will add a new Text object to the arrangement estrings. Now, down in the section of VBox, we binder list of strings to the contents of a VBox, so as soon as we insert a new item to the list, it will deploy ...
Well, I hope this intro has you interested, gotta make another tutorial again, but I recommend the following reading:
http://java.sun.com/javafx/ 1/tutorials/core /
Salu'2
Immortal "No Religion Higher Than Truth"
