Este documento fornece uma introdução ao JavaFX e Visage. Resume o seguinte: 1) Apresenta William e sua experiência com JavaFX e ferramentas open source. 2) Explica o que é JavaFX e como ele permite criar aplicações ricas com Java de forma fácil. 3) Demonstra como criar uma aplicação básica em JavaFX e os principais elementos de interface. 4) Apresenta Visage como uma linguagem específica para criação de interfaces que roda no topo de plataformas como JavaFX.

1. Introdução ao
JavaFX e Visage

2. Quem é William
● Formado na FATEC SJC
● Trabalha na Red Hat com Suporte de
ferramentas JBoss
● Um dos organizadores do JUG Vale
● Fã do JavaFX desde a versão 1.0
● Fã de Open Source e programação
● Áreas de estudo atualmente incluem REST
(JAX-RS), Portais em Java(Portlet JSR 168
e 286), Servidores de Aplicação JEE(ou
RESTEasy, GateIn e JBoss AS)

3. Agenda
1. JAVAFX - PARTE TEÓRICA
2. JAVAFX - PARTE PRÁTICA
3. VISAGE E VISAGEFX

4. JAVAFX - PARTE TEÓRICA

5. O que é JavaFX 2
É uma moderna biblioteca Java que
dispõe de vários recursos para
criação de aplicações ricas.
Sua forma de programar facilita
muito a vida do desenvolvedor.
É o novo Swing

6. O que é JavaFX 2
Permite Criar Aplicações Ricas de
Forma Fácil Com Java

7. Era uma vez...
● JavaFX Script criado por Chris Oliver
● Novo JavaFX, compilado e nova engine
gráfica
● JavaFX 1.2.1 com novos controles
até que um dia...
JavaFX 2
fim do JavaFX Script, inicio de uma API Java

8. Principais Acontecimentos JavaFX 2
Desde então muita coisa aconteceu
● Altos investimentos da Oracle
● Open Source
● Linux, Mac e Windows
● Ferramentas visuais
● Demonstrado no iPad
● Novos projetos Open Source
JavaFX 2 se tornou uma plataforma madura
para criação de aplicações

9. 1001 Formas de Usar JavaFX
No JavaFX, quem manda é o freguês
● Linguagens de programação
○ VisageFX
○ ScalaFX
○ GroovyFX
● IDEs
○ Eclipse
○ Netbeans
● Formas de programar
○ Java Plano
○ Builders
○ FXML

10. Ótimas Ferramentas
DATAFX
ScalaFX

11. JavaFX é Cheio "das Modernidades"
Senta que lá vem história...
● "Tudo é um nó"
● Fácil tratamento de eventos
● Muitos controles de interface
● Navegador embutido
● Suporte a animação e efeitos
● Aceleração gráfica
● CSS
● Suporte a gráficos
● Suporte a vídeo e áudio

12. Demo da Aplicação
"JavaFX Ensemble"

13. E na prática...
Ceeeerrrtoo... MAS CADÊ O CÓDIGO??????

14. JAVAFX - PARTE PRÁTICA

15. Como criar uma aplicação em
JavaFX?
● Primeiramente você deve saber algumas
coisas importantes:
○ Abstração de teatro usa os conceitos Palco(Stage)
e Cena(Scene)
○ A classe principal sempre herda de javafx.
application.Application
○ Todos os atores(componentes da Cena) herdam de
javafx.scene.Node
○ As classes do JavaFX ficam no jar jfxrt.jar, presente
no JavaFX quando você baixa ele do site da Oracle

16. Como criar uma aplicação em
JavaFX?
● Esqueleto de uma aplicação JavaFX

17. Olá Mundo!

18. Elementos de Interface

19. Imagens, Sons e Vídeos

20. Estilo com CSS

21. Transições
● Transições mudam o estado de uma
propriedade de um nó em período de tempo.

22. FXML

23. Ligando valores
● *Property: Ligação direcional e bi-direcional

24. Ouvindo mudança em valores

25. Você pode usar Builders se quiser
Você pode usar praticamente tudo no
modelo de Builders

26. Tratar Eventos é Fácil
Trate simplesmente ações ou um evento mais
elaborado(mouse sobre, mouse entra)

27. E muito mais...
● HTML
● Muitos Controles de interface
● Efeitos
● Recursos para animação
● ....

28. Lembre-se sempre
...e mais uma coisa...
● Tudo é um Nó(Node). Sério, tudo!
● Leia sempre a JavaDoc para desenvolver;
● Use a aplicação Ensemble quando precisar
lembrar como faz alguma coisa

29. VISAGE

30. Visage
● Nasceu do JavaFX Script logo após o fim do
mesmo
● Totalmente OpenSource
● Roda sobre a Plataforma Java
● Muito fácil de programar

31. Por que Visage?
● Ok, Java tem várias opções, é maduro, etc,
mas as vezes você quer algo específico,
para criar interfaces.
● Visage é específica(DSL - Domain Specific
Language) para criação de interfaces. É fácil
e tem curva de aprendizado muito pequena.
● Visage é mais do JavaFX, roda no topo de
Android, Vaadin e há planos para mais

32. 5 Características Legais
5. Sintaxe declarativa
Class{
param: value
}
4. É funcional:
Button{
onclick: function(e:Event){
}
}

33. 5 Características Legais
3. Triggers
var a:String = "Init" on replace{
println("The var a has changed to "{a}"");
}
a = "a new value";
2. Sequences
var things = [["Java", "JavaFX"], ["Futebol",
"Ronaldo"], [1,3,5,7]];

34. 5 Características Legais
1. Bind
var a:Integer = 0;
var b:Integer = 0;
var c = bind a + b on replace{
println("a is {a}, b is {b} and c is {c}");
};
a = 5; //c = 5
b = 2; //c = 7
a = 1; //c = 3
b = 3; //c = 4

35. Uma DSL, Muitas Plataformas
Com Visage é possível criar interfaces para
diversas plataformas. Atualmente temos:
● Vaadin
● Android
● JavaFX (VisageFX)
A maior vantagem é aprender uma só
linguagem específica e reaproveitar o
conhecimento em outras plataformas.

36. VisageFX
Visage no topo de JavaFX
Adaptamos Visage para ocultar verbosidade
do Java com uma linguagem expressiva e
específica para Interfaces com o Usuário

37. VisageFX

38. Aprendendo Mais
http://bit.ly/grupo_javafx
http://javafx.com

39. Dúvidas