JavaFX - Um Hello World GUI (Graphical User Interface)

Após a instalação do seu JavaFX, via tutorial
"Instalando o JavaFX SDK e seus pré-requisitos (sem NetBeans)",
e a verificação desta instalação com um simples "Hello World" de console, via tutorial
"JavaFX - Um Hello World simples (console) para testar sua instalação",
podemos criar agora um "Hello World" gráfico (GUI), o qual já pode lhe dar a idéia da estrutura básica para um programa de Interface Gráfica do Usuário (Graphical User Interface).

1) Crie uma pasta em seu computador, de nome "HelloWorldGUI".





2) Na pasta "HelloWorldGUI", vamos criar nosso primeiro programa JavaFX gráfico (GUI), a partir do código apresentado abaixo, salvando o mesmo com o nome de "HelloWorld.fx".



Para você copiar e colar:

import javafx.stage.Stage;
import javafx.scene.Scene;
import javafx.scene.text.Text;
import javafx.scene.text.Font;
import javafx.scene.text.TextAlignment;
import javafx.scene.paint.Color;

Stage
{
title: "Hello World no JavaFX"
width: 400
height:200
scene: Scene
{
content:
[
Text
{
content: "Hello World !!!"
x:80 //coluna
y:90 //linha
font: Font
{
name: "Arial"
size: 36
}
fill: Color.NAVY
}
]
}
}

Observação:
Repare que a extensão do código fonte JavaFX é "
.fx", enquanto que de um código fonte Java seria ".java".
Repare também que o JavaFX não exige aquela estrutura rígida de classes e métodos do Java normal, pois o próprio JavaFX criará a estrutura necessária, de acordo com seus padrões internos.
Com apenas estas poucas linhas acima, você já tem montado um programa JavaFX, tipo GUI.
Tudo isso será melhor explicado em outros tutoriais.



3) Também na pasta "HelloWorldGUI", visando compilar o programa "HelloWorld.fx", vamos criar um arquivo de comandos, de nome "Compilar.bat", com as duas linhas a seguir:




Para você copiar e colar:

"C:/rogram Files/JavaFX/javafx-sdk1.1/bin/javafxc.exe" HelloWorld.fx
pause

Observação:
Repare que o compilador do JavaFX é "
javafxc.exe", enquanto que do Java é "javac.exe".
Observe que a versão do seu JavaFX SDK já pode ser superior à
javafx-sdk1.1.


4) Execute o arquivo "Compilar.bat", dando um duplo clique sobre ele, ou clicando o botão direito do mouse e selecionando a opção "Open" do menu apresentado.





4.1) A execução do "Compilar.bat" abrirá uma janela de "Command Prompt", mostrando o comando de compilação e possíveis erros de compilação, os quais espero que não ocorram.
Analise o resultado e pressione qualquer tecla para fechar a janela.




4.2) Se nenhum erro ocorreu na compilação, você verá que dois novos arquivos (
.class) terão sido criados na pasta "HelloWorldGUI", com os seguintes nomes "HelloWorld.class" e "HelloWorld$Intf.class".





5) Nesta mesma pasta "HelloWorldGUI", visando testar nosso programa, vamos criar agora um arquivo de comandos, de nome "Executar.bat", com os seguintes linhas de comando:



Para você copiar e colar:

"C:/Program Files/JavaFX/javafx-sdk1.1/bin/javafx.exe" HelloWorld
pause

Observação:
Repare que para executar programa JavaFX usa-se "
javafx.exe", enquanto que no Java usa-se "java.exe".
Observe que a versão do seu JavaFX SDK já pode ser superior à javafx-sdk1.1.


6) Execute o arquivo "Executar.bat", dando um duplo clique sobre ele, ou clicando o botão direito do mouse e selecionando a opção "Open" do menu apresentado.





6.1) A execução do "Executar.bat" abrirá uma janela de "Command Prompt", mostrando o comando de execução e também outra janela, tipo GUI, com a mensagem esperada, ou seja, o "Hello World !!!".






6.2) Tendo aparecido a mensagem "Hello World !!!" acima, indica que tudo está perfeito até aqui e você já fez e testou seu primeiro programa JavaFX gráfico (GUI).

Parabéns!!!

Eliseu Pfaffenseller
Analista de Sistemas
Porto Alegre, RS, Brasil

Observação:

O roteiro acima foi testado no Windows XP SP3.
A versão do JavaFX SDK (Software Development Kit) usada foi 1.1.1, de abril de 2009.
A versão do JDK (Java Development Kit) usada foi 1.6.0_12, de abril de 2009.
A versão do JRE (Java Runtime Environment) usada foi 1.6.0_12, de abril de 2009.


WindowWidth: WindowHeight: ContainerHeight: ScrollHeight:
Responsive Media Screen:
Family