Abrindo e renderizando páginas WEB em uma aplicação JavaFX

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:

	import javafx.application.Application;
	import javafx.stage.Stage;
	import javafx.scene.web.WebView;
	import javafx.scene.Scene;
	/**
	*
	* @author william
	*/
	public class SimplesWEBView extends Application {
	@Override
	public void start(Stage s) {
	// O nó em sí, que será mostrado
	WebView webView = new WebView();
	// A engine é do tipo WebEngine
	webView.getEngine().load("http://aprendendo-javafx.blogspot.com");
	// criamos a cena e adicionamos no nosso stage
	s.setScene(new Scene(webView));
	// mostramos
	s.show();
	}
	}

view raw SimpleWEBView.java hosted with ❤ by GitHub

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:

	import javafx.application.Application;
	import javafx.stage.Stage;
	import javafx.scene.web.WebView;
	import javafx.scene.Scene;
	import javafx.scene.control.ListView;
	import javafx.scene.layout.HBox;
	import java.util.stream.Stream;
	import java.util.Optional;
	/**
	*
	* @author william
	*/
	public class NavegaSites extends Application {
	final String[] sites = {
	"aprendendo-javaee.blogspot.com",
	"aprendendo-javafx.blogspot.com",
	"aprendendo-javase.blogspot.com",
	"aprendendo-jboss.blogspot.com",
	"jugvale.com",
	"javafx.com",
	"java.com",
	"google.com"
	};
	@Override
	public void start(Stage s) {
	// criando uma lista visual de Strings, um webView e uma caixinha pra colocar as coisas
	ListView<String> listaSites = new ListView<>();
	WebView webView = new WebView();
	HBox raiz = new HBox(20);
	// Para cada site no array adicionamos na lista visual
	Stream.of(sites).forEach(listaSites.getItems()::add);
	// Quando o usuário seleciona um item, carregamos a página
	listaSites.getSelectionModel().selectedItemProperty().addListener(
	(obs, o, n) -> {
	if(n != null) webView.getEngine().load("http://www." + n);
	});
	// a lista não permite seleção de página quando uma página está sendo carregada
	listaSites.disableProperty().bind(webView.getEngine().getLoadWorker().runningProperty());
	// formalidades...
	raiz.getChildren().addAll(listaSites, webView);
	s.setScene(new Scene(raiz));
	s.show();
	}
	}

view raw NAvegaSites.java hosted with ❤ by GitHub

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!