Mini Curso JavaFX/OpenJFX

  • View
    9.258

  • Download
    0

Embed Size (px)

DESCRIPTION

Um mini-curso apresentado no Just Java 2013 apresentando as maiores características do JavaFX e o respectivo projeto Open Source: OpenJFX

Text of Mini Curso JavaFX/OpenJFX

  • 1. OpenJFX/JavaFX Introduo nova API grfica do Java
  • 2. Quem William
  • 3. Objetivo do Mini-Curso Apresentar o JavaFX, a nova API grfica da plataforma Java Histria e conceitos bsicos Apresentao das principais classes da API Ferramentas e projetos Open Source Criao de uma aplicao
  • 4. Contedo Parte I: Bsico e teoria Parte II: Conhecendo a API Parte III: Criando aplicaes
  • 5. Parte I - Introduo e Teoria
  • 6. O que OpenJFX? O JavaFX uma API nova para criao de aplicaes grficas para a plataforma Java; OpenJFX o projeto Open Source do JavaFX que ainda est em processo de abertura de cdigo...
  • 7. Histria F3 - Chris Oliver JavaFX Script 1.0 - 2008 Oracle compra Sun e anuncia investimentos pesados no JavaFX - 2010 JavaFX 2 se torna puro Java - Incio 2011 Projeto OpenJFX - Fim 2011 JavaFX ser parte do Java no Java 8 - Futuro Java 9 no ter mais Java Swing...
  • 8. Viso geral A API contm recursos para criar interface grfica com o usurio, animaes, contedo multmidia, mostrar pginas WEB, contedo 3D, estilizar com CSS, usar XML para a interface... possvel tambm executar JavaFX "embebbed", como em um Raspberry PI, por exemplo; Com a verso 2 possvel fazer aplicaes 3D, mas isso ir se consolidadar na verso 3; JavaFX pode ser distribudo como JAR, empacotamento nativo (exe, rpm, etc), applet ou JNLP
  • 9. Demonstraes Ensemble e outros exemplos do livro Exemplos do livro Pro JavaFX Platform 2
  • 10. Parte II - Prtica
  • 11. JDK 6+, JavaFX e Scene Builder disponveis em: http://www.oracle.com/technetwork/pt/java/index.html Netbeans 7.3 Pr requisitos
  • 12. Cdigos de Exemplo + aprendendo-javafx.blogspot.com docs.oracle.com/javafx
  • 13. Criando projetos JavaFX no Netbeans File -> New Project
  • 14. "Ol Mundo" Crie o projeto ola-mundo-javafx Dentro da classe start, use o seguinte cdigo: Text txt = new Text("Ol Mundo"); StackPane root = new StackPane(); root.getChildren().add(txt); Scene scene = new Scene(root, 300, 250); primaryStage.setTitle("Hello World!"); primaryStage.setScene(scene); primaryStage.show();
  • 15. Stage e Scene Abstrao de teatro: usa os conceitos Palco(Stage) e Cena(Scene) A classe principal sempre herda de javafx. application.Application Seu cdigo vai no mtodo start(Stage) Todos os atores(componentes da Cena) herdam de javafx.scene.Node As classes do JavaFX ficam no jar jfxrt.jar
  • 16. Java Plano X Builders Usando Java Plano: Text txt = new Text("Ol Mundo"); txt.setTranslateX(10); txt.setTranslateY(50); txt.setRotate(30); Usando Builders Text txt = TextBuilder.create() .text("Hello World") .translateX(10) .translateY(50) .rotate(30).build();
  • 17. Uma viso geral da API Scene Graph - Elementos hierrquicos do mesmo tipo: Node
  • 18. A classe Node Todos elementos na tela so um javafx. scene.Node Propriedades importantes do Node: Effect: Permitir adicionar um efeito ao node (veremos mais a frente) Rotation: Permitir rotacionar o Node visible layoutX e layoutY: Posicionamento on* e
  • 19. A classe Node: Prtica 1. Crie um projeto JavaFX simples e chame de classe-node 2. Adicione um javafx.scene.layout.Pane Scene e um javafx.scene.text.Text 3. Text um __________? 4. Mude as propriedades do Text, brinque com as propriedades, explore a API
  • 20. A classe Node: Prtica
  • 21. Imagens e formas geomtricas Temos diversas formas geomtricas no pacote javafx.scene.shape. H diversas formas geomtricas que podem ser usadas e todas herdam de javafx.scene. shape.Shape No JavaFX tambm muito fcil mostrar imagens atravs das classes javafx.scene. image.ImageView e javafx.scene.image. Image
  • 22. Imagens e formas geomtricas: Prtica Crie um novo projeto JavaFX chamado formas-geometricas Crie diversas figuras geomtricas explorando o pacote javafx.scene.shape e adicione imagens javafx.scene.image Exemplos de classes de figuras geomtricas: Rectangle, Circle...
  • 23. Imagens e formas geomtricas: Prtica
  • 24. Multimdia As classes para lidar com vdeo e udio esto no pacote javafx.scene.media e voc precisar s conhecer Media, MediaView e MediaPlayer para tocar um vdeo. O udio ainda mais fcil, pois voc s precisa de duas linhas de cdigo usando a classe AudioClip A classe que representa um n do vdeo a MediaView, ou seja, voc pode rotacionar, adicionar efeito, mover, entre outros, somente usando essa classe
  • 25. Multmidia: Prtica
  • 26. Mostrar Pginas WEB JavaFX traz o navegado WebKit e as possibilidades de trabalhar com pginas nessa plataforma so muitas! A API para web, no entanto, muito simples. Precisamos das classes que esto no pacote javafx.scene.web, principalmente a classe WebView Vamos nos limitar a mostrar uma pgina simples, pois esse assunto bastante extenso. Os tpicos vo alm de simplesmente mostrar uma pgina, mas tambm cobrem manipulao da DOM da pgina, execuo de scripts JavaScript, eventos da pginas, entre muitos outros... Explorem a API aps o curso!
  • 27. Mostrar pginas: Prtica WebView webView = WebViewBuilder.create().prefHeight(450).prefWidth(1000).build(); webView.getEngine().load("http://www.redhat.com");
  • 28. O Canvas O Canvas do JavaFX bastante semelhante ao Canvas do HTML 5. Basicamente um n com uma rea para desenharmos dentro. As classes do Canvas esto no pacote javafx.scene.canvas e as principais classes so o prprio Canvas, que o n a ser adicionado, e o GraphicsContext, onde voc vai poder desenhar e manipular o canvas...
  • 29. O Canvas: prtica 1. Crie um projeto chamado desenhando- canvas 2. Na classe principal, crie um Canvas e adicione ele a um elemento da Scene, assim podemos ver ele na aplicao 3. Pegue o GraphicContext e faa coisas randmicas no canvas, como desenhar retngulos, crculos, etc
  • 30. O Canvas: prtica