Nessa postagem vamos fala sobre como retornar os filhos de um classe Node.
Como já falamos aqui, tudo que está em uma aplicação JavaFX é um Node (nó): botões, labels, tabelas, organizadores de leiaute e por aí vai. Alguns desses nodes têm filhos. É o caso do Group, VBox, HBox e outros organizadores de leiaute.
Uma dúvida comum, inclusive perguntada nessa postagem do JavaFree, é sobre como podemos buscar os elementos filhos sem sair fazendo for e ir lendo elemento por elemento, testar seus atributos e assim achar o que procura. Há outras formas! E a melhor forma é usando o método lookupelookupAll. Vamos falar sobre eles hoje!
Seletores CSS
Para usar os métodos acima, devemos usar seletores CSS através de uma String. Para entender melhor, vejam esse artigo do W3 Schools e a ferramenta que eles indicam para testar os seletores.
Basicamente os selectores são formas de buscar alguma coisa usando uma linguagem simples de representação dos elementos. Por exemplo, se quisermos buscar algum nó pelo seu ID, usamos #ID, onde ID é o ID que se pretende buscar. Há também possibilidades de buscar pela classe do elemento, por valores de seus atributos e por aí vai. Sugiro a leitura do artigo da W3 Schools para melhor entender ou buscar on google alguma fonte em português (o motivo de "linkar" W3 Schools é a confiabilidade e estabilidade do recurso).
O fato é que o seletor CSS muitas vezes retorna vários resultados, pois podemos usar coringas (símbolos especiais que representam um ou mais elementos, como o "*", que representa tudo) ou há vários Nodes que batem com aquela busca.
lookup e lookupAll
Esse são os dois métodos da classe node que podemos usar para buscar seus filhinhos. A principal diferença entre ele é que o lookup retorna sempre um resultado que corresponde aquela busca e o lookupAll retorna todos os elementos que correspondem a busca em um java.util.Set(uma collection do Java que não permite que os elementos se repitam, sendo sempre únicos). Se nenhum nó filho corresponde à busca usando lookup, o retorno é nulo, já com o lookupAll, o retorno é um Set vazio.
Muito papo né? Vamos fazer um código de exemplo!
Exemplo usando lookupAll
Agora vamos para o nosso código que é uma "aplicaçãozinha" que permite fazer a busca de Labels que estão em uma VBox. Se um ou mais labels correspondem a busca, eles ficam grande, se nenhum corresponder a busca, a gente informa usando um dialog. Vejam uma imagem da nossa APP:
Recentemente eu escrevi um artigo para o Master the Boss para mostrar o uso API remota do jBPM/BPM Suite. Para testar o que escrevi lá, eu também criei uma aplicação simples em JavaFX para lembrar os tempos antigos, onde eu criava aplicações em JavaFX diariamente :-)
A aplicação que eu criei foi realmente simples, seguem algumas imagens:
Essa aplicação simples permite um usuário seguir os passos de um process comercial usando a API remota, que são: iniciar um processo, gerenciar tarefas humanas, ler variáveis de um processo e o histórico de execução do processo. Segue o diagrama do process que eu estou mencionando:
Abaixo você pode ver um vídeo da aplicação acessando o JBoss jBPM:
Isso foi criado em menos de uma hora e você pode ver o código completo no github.
e Olá Pessoal! Inaugurando hoje o "rapidinhas", onde eu posto exemplos rápidos de código. Hoje eu vi essa postagem no JavaFree e quis criar um exemplo rapidinho. Assim, fiz o programinha abaixo que permite manipular um Stage (tamanho, maximizar e fechar). Um gist está incorporado abaixo, mas também coloquei no github.
Uma das maiores necessidades do JavaFX foi a adição de uma biblioteca consistente para termos acesso a diálogos. Aquelas janelinhas que aparecem em uma aplicação para entrarmos alguma informação. Nessa postagem vamos falar das classes que permitem a criação de diálogos, mas que foram adicionadas recentemente. Muitos da era Swing devem se lembrar do JOptionPane.
Os diálogos do JavaFX
Essa parte do JavaFX começam no Java 8 atualização 40. Ficam no pacote javax.scene.control e usando a classe Alert podemos criar diálogos de erro, avisos, confirmação, com mensagem de erro (stacktrace) e você ainda pode customizar e criar o seu próprio diálogo com botões que irão ter ações customizadas.
Exibindo mensagens de erro, aviso e informação
O mais simples dos diálogos permitem que você simplesmente mostra uma imagem em uma caixinha de texto. Esses diálogos aceitam a configuração de um título, um cabeçalho e a mensagem de aviso em sí. Os diálogos de informação e error são semelhantes, só temos que trocar o tipo de Alert para Error, Warning ou Information. O programa abaixo mostra como podemos usar ambos:
Percebam que as classes bases para criarmos diálogos são javafx.scene.control.Alert e javafx.scene.control.Alert.AlertType. Vejam o resultado de cada diálogo quando clicamos neles na aplicação acima:
Pegando entradas dos usuários
Um uso mais avançado dos diálogos são para pegarmos uma resposta do usuário. Podemos colocar neles perguntas para pegar a resposta do usuário, campos de texto e caixas de escolha. Veja abaixo um programa que mostra o uso mais simples de cada um deles:
O resultado é mostrado abaixo:
Outros tipos
Essa API demorou para sair, mas quando veio, veio completa! Podemos criar tipos customizados de diálogos de acordo com as necessidades do usuário. Cabe ao leitor explorar as mais diversas alternativas, mas um bom resumão pode ser encontrado nessa postagem em inglês.
Essa é a primeira postagem de uma pequena série sobre jogos em JavaFX. Mais informação no assunto pode ser encontrado no blog de Carl Dea e sua engine. Aqui vamos apresentar uma visão geral e pequenos jogos, no entanto, essa visão geral pode ser usada para que você crie seus próprios jogos!
Se você quer ficar especialista em jogos, há um recurso muito bom em português, o Ponto V, principalmente para Java. Há também o famoso livro gratuito Killer Game Programmin in Java. Lembrando que ambos recursos não cobrem JavaFX, por isso a necessidade dessa pequena séria básica. Por fim, tutorial bem didático que cobre os tópicos sobre programação de jogos, mas usa HTML 5 e Javascript, é esse do Indie Gamer Brasil.
Breve histórias sobre o mundo dos jogos
A história de programação de jogos é, para mim, umas das mais interessantes do mundo atual. Jogos eram para crianças, um mercado limitado e fechado. Com os anos, tivemos a saída dos fliperamas para arcades, dos arcades para portáteis e hoje jogos estão em todos os lugares. Afinal, qual celular não vem com jogos por padrão?
Outro ponto interessante foi com relação à interatividade. Por muitos anos tínhamos jogos de um, no máximo dois jogadores, usando controles. Isso mudou drasticamente, pois hoje podemos ter milhares de jogares usando a rede mundial e as formas de se jogar passaram a ser não somente o controle, mas sim seu próprio corpo com jogos que imitam quase perfeitamente a vida real.
Nessa séries vamos criar jogos simples, "retro", para diversão e para exercitar programação. Certamente jogos gigantes exigem muita experiência, conhecimento e até faculdades!
Para continuar lendo sobre a história dos jogos, recomendo esse artigo da Wikipédia e se realmente quiser sentir a experiência da evolução dos games, recomendo o livro 1001 jogos para jogar antes de morrer, que orgulhosamente tenho, mas li pouco mais de 20%. Nele você "sente" a evolução dos jogos e as revoluções que foram acontecendo desde o início até uns anos atrás.
O básico sobre programação de jogos
Mas o que precisamos para criar jogos? Não muito, essa é a verdade. Claro que jogos mais complexos irão necessitar de engines avançadas e especializadas, como a Unreal Engine. Se quer aprender isso, essa série não é para você! Sugiro que veja os vídeos do The New Boston sobre a engine do unreal. Mas o que precisamos de uma linguagem de programação para criar nossos jogos?
Com certeza o mais importante sobre criar jogos é ter a capacidade de desenhar na tela. Se você não tiver um toolkit que permita dinamicamente atualizar a tela, esqueça! Lógico que só desenhar não ajuda em nada, pois temos que atualizar a tela, assim, esse recurso deve vir acompanhado de uma ferramenta para termos controle sobre o desenho da tela de acordo com o tempo, ou seja, um loop, assim podemos redenhar a tela sempre.
Segundo é permitir uma forma de interatividade do jogador. Se você não pode redesenhar a tela atualizando mesma com informações da entrada do usuário, você não terá interatividade nenhuma! Um exemplo básico: mover o herói para a esquerda quando o usuário apertar a seta para a esquerda. Notem que uma boa ferramenta vai garantir a captura de eventos em diversos cenários e ambiente, como em celulares, onde não temos cliques, mas sim toques, ou seja, um outro paradigma de interação diferente do que é feito nos computadores tradicionais (com mouse e teclado).
O terceiro requisito é detectar colisões e tomar ações. Por exemplo, como você vai saber que o herói do jogo foi atingido por um tiro do inimigo? Para isso temos que aprender a detectar colisões.
Por fim, um requisito muito importante para jogos realmente emocionantes é a capacidade de tocar som. A "musiquinha" do jogo marca muito! Por exemplo, lembro na minha infância a gente saía correndo na rua e cantando a musiquinha do Lamborghini, um famoso jogo de SNES. Você com certeza tem a lembrança da musiquinha de algum jogo...
Um adicional seria uma ferramenta que permita de forma fácil realizar a transformação dos elementos do jogo (rotacionar, sprites, mover, etc). Mas isso não é crucial, assim podemos criar jogos sem depender de elementos e funções prontas, mas sim implementar as nossas.
Note que muitos jogos podem muito bem sobreviver somente usando os dois primeiros conceitos apresentados são cruciais para criarmos nosso joguinho, os outros não são necessariamente uma obrigação.
Tudo isso que digitei acima pode ser melhor definido pelo seguinte código que peguei na wikipedia sobre programação de jogos:
while( user doesn't exit )
check for user input
run AI
move enemies
resolve collisions
draw graphics
play sounds
end while
O loop do jogo e desenhando em JavaFX
É claro que a moderna plataforma gráfica do Java contém tudo que precisamos para criar jogos:
Para desenhar na tela podemos usar o Canvas e usar a classe Animation para criar o loop do game;
JavaFX tem suporte a quase todos eventos que você possa imaginar e isso inclui eventos de toque(onTouch). Para ter uma ideia disso, veja nosso artigo sobre a classe Node;
Como enfatizamos nos primeiros artigos desse blog, tocar aúdio em JavaFX é algo muito simples;
O suporte a qualquer tipo de transformação é possível na mais nova plataforma gráfica do Java, mas não vamos entrar em detalhes pois nossa abordagem será outra;
Nossa abordagem vai partir de um "mini framework", onde já temos o suporte ao loop e podemos implementar algumas classes e sair codificando o jogo em sí. Eu falo um pouco sobre esse "mini framework" no meu blog em inglês, mas segue aqui uma explicação breve (iremos explorar mais no futuro, não se preocupe):
A classe principal se chama Game e auxilia em uma interface para programar nosso jogo. Assim temos os métodos update e display, cujo objetivos são respectivamente atualizar os elementos do jogo (posição do herói após o usuário interagir com a aplicação) e mostrar as modificações (simplesmente desenhar na tela). Ele é composta de um canvas para desenharmos e sermos felizes;
Em seguida temos a classe GameEngine, que dá vida para nosso jogo. Ela chama os métodos update e display de acordo com o tempo passado. Por exemplo, podemos chamar esses métodos 10 vezes por segundo. Importante é não travar a engine nesses métodos! Por exemplo, não podemos fazer uma tarefa muito pesada ou o jogo "trava".
O código dessas classes podem ser encontrados nesse GIST. Um exemplo muito básico de uso é mostrado abaixo, onde nos baseamos no exemplo Bouncing Ball (vamos chamar de "Bolinha Viva") do livro Nature Of Code, onde uma bolinha vai ficar se movendo "eternamente" batendo nos cantos da aplicação. Não é um jogo, mas já um ponto inicial para começarmos a entender a natureza dos nossos joguinhos.
Conclusão
Falamos sobre o básico do básico sobre criação de jogos. Vamos voltar ao tema com joguinhos mais simples em breve!
O código está no github e é um projeto do Netbeans 8. Você deve simplesmente abrir o projeto no netbeans 8 e rodar!
Nessa postagem vamos falar sobre como carregar páginas WEB dentro de sua aplicação JavaFX. Mais uma vez: essa é uma tarefa muito fácil em JavaFX!
Um conto de duas classes: WebView e WebEngine
Vamos à parte teórica primeiramente e relembrar que tudo que é visual em uma aplicação JavaFX herda da classe Node, que abordamos anteriomente. O WebView é a classe que você vai usar para mostrar o conteúdo de uma página e ele herda de Node, ou seja, é passível de efeitos, animações, CSS, transformações, entre outros.
Já a classe WebEngine é onde manipulamos a DOM da página, executamos javascript, entre outros. É simplesmente o browser em sí, baseado no WebKit, o mesmo motor de navegadores famosos, como o Chrome.
A relação entre essas classes é simples: O WebView usa uma instância de WebEngine e cria a representação visual de um conteúdo HTML na sua aplicação JavaFX. Mas como usar os mesmo?
Usando WebView
O uso de WEBView consiste em três passos:
Instanciar a classe javafx.scene.web.WebView;
Acessar a WebEngine usando o método getEngine e usar o método load para carregar a página WEB;
Adicionar o WebView ao Scenegraph da sua aplicação.
Em código, isso fica assim:
O que resulta em:
Exatamente, meus caros amigos. Foram 3 linhas de código e uma página WEB na sua app JavaFX.
Uma aplicação um pouco mais elaborada
Agora vamos fazer uma aplicação que mostra alguns componentes JavaFX interagindo com a WEB Engine. Vamos fazer o básico, pois, como quase todos os componentes JavaFX, isso levaria algumas postagens.
Nessa aplicação temos uma lista de URLs no lado esquerdo e quando o usuário seleciona uma, temos a mesma carregada no lado direito no nosso WEB View , vejam:
O funcionamento é simples: a ListView e o WebView ficam em um gerenciador de layout do tipo HBox. Quando o usuário seleciona um elemento na lista, pegamos a URL selecionada e carregamos na WebEngine usando o WebView. Quando a WebEngine está carregando a página, nós desabilitamos a lista.
Fácil, não? Vejam o código inteiro:
Conclusão
Introduzimos o componente WebView e mostramos o uso básico do mesmo. Claro que as possibilidades são muitas, mas nos limitamos ao básico do básico, pois cadê ao leitor usar a documentação do JavaFX para ir mais a fundo!
