RSS

Splash Screen

23 nov

Introdução

Neste simples artigo iremos ver como criar uma tela Splash. Um splash é aquela imagem que geralmente aparece enquanto o programa principal esta sendo carregado na memória, sendo bastante útil para mostrar ao usuário que o sistema não esta travado, muito pelo contrário. Além de tudo, uma tela Splash deixa seu programa com uma cara mais profissional.

Splash it!

Não há misterio em fazer tal tela, o funcionamento baseia-se na idéia de mostrar uma imagem em um JFrame enquanto a JVM encarrega-se de abrir a tela principal do programa. A classe que implementa a tela de Splash do nosso exemplo chama-se "Splash", e é declarada da seguinte forma:

 

  1. public class Splash extends Window 

public class Splash extends Window
Temos apenas 5 propriedades, que são:

 

  1. // Mensagem a ser mostrada junto com a imagem
  2. private final String message = "Splash Screen"; 
  3.  
  4. // Imagem que ira aparecer no Splash
  5. private final String imgName = "splash_guj.jpg"; 
  6. Image splashImage; 
  7. Toolkit toolkit; 
  8. private static Splash splash; 

// Mensagem a ser mostrada junto com a imagem private final String message = "Splash Screen"; // Imagem que ira aparecer no Splash private final String imgName = "splash_guj.jpg"; Image splashImage; Toolkit toolkit; private static Splash splash;
Note que temos uma propriedade chamada da própria classe Splash, que é utilizada para garantir que apenas uma instância estará na memória por ClassLoader(Singleton). O método que executa o trabalho grosso é o initSplash, que é mostrado abaixo:

 

  1. private void initSplash() { 
  2. // Carrega a imagem na memoria
  3.     MediaTracker media = new MediaTracker(this); 
  4.     splashImage = toolkit.getImage(imgName); 
  5.  
  6. if (splashImage != null) { 
  7.         media.addImage(splashImage, 0); 
  8.  
  9. try { 
  10.             media.waitForID(0); 
  11.         } 
  12. catch (InterruptedException ie) {} 
  13.     } 
  14.  
  15. // Configura o tamanho do splash e a posicao na tela
  16.     setSize(splashImage.getWidth(this), splashImage.getHeight(this)); 
  17.  
  18.     Dimension screenSize = Toolkit.getDefaultToolkit().getScreenSize(); 
  19.     Dimension size = getSize(); 
  20.  
  21. if (size.width > screenSize.width) 
  22.         size.width = screenSize.width; 
  23.  
  24. if (size.height > screenSize.height) 
  25.         size.height = screenSize.height; 
  26.  
  27.     setLocation((screenSize.width – size.width) / 2, (screenSize.height – size.height) / 2); 
  28.     setVisible(true);        

private void initSplash() { // Carrega a imagem na memoria MediaTracker media = new MediaTracker(this); splashImage = toolkit.getImage(imgName); if (splashImage != null) { media.addImage(splashImage, 0); try { media.waitForID(0); } catch (InterruptedException ie) {} } // Configura o tamanho do splash e a posicao na tela setSize(splashImage.getWidth(this), splashImage.getHeight(this)); Dimension screenSize = Toolkit.getDefaultToolkit().getScreenSize(); Dimension size = getSize(); if (size.width > screenSize.width) size.width = screenSize.width; if (size.height > screenSize.height) size.height = screenSize.height; setLocation((screenSize.width – size.width) / 2, (screenSize.height – size.height) / 2); setVisible(true); }
Para desenhar a imagem na tela precisamos implementar o método paint, como mostrado abaixo:

 

  1. public void paint(Graphics g) { 
  2. // Apenas desenha a nossa mensagem em cima da imagem
  3.     g.drawImage(splashImage, 0, 0, getBackground(), this); 
  4.     g.setFont(new Font("Arial", Font.BOLD, 26)); 
  5.     g.drawString(message, (int)(splashImage.getWidth(this) / 2) – 80, 30); 

public void paint(Graphics g) { // Apenas desenha a nossa mensagem em cima da imagem g.drawImage(splashImage, 0, 0, getBackground(), this); g.setFont(new Font("Arial", Font.BOLD, 26)); g.drawString(message, (int)(splashImage.getWidth(this) / 2) – 80, 30); }
O código fonte completo você encontra no arquivo que acompanha este tutorial.

Classe para simular o programa real

Com a classe que irá mostrar o Splash pronta, vamos fazer uma outra classe para "simular" um programa real, pesado. Para fazer tal ação simplemente é colocado um laço for() no construtor da classe, assim é possível analisar o funcionamento do Splash. Se fosse um Thread.sleep(), estaríamos perdendo o tempo que a splash fica aberta! O código é o seguinte:

 

  1. class Botoes extends JFrame { 
  2.     JButton botao; 
  3.     JFrame frame; 
  4.     JPanel panel; 
  5.  
  6. /**
  7.      * Construtor da aplicacao principal.
  8.      * Simula um load demorado com um loop, para mostrar que
  9.      * a tela Splash realmente aparece enquanto a aplicacao
  10.      * principal eh carregada.
  11.      * */
  12. public Botoes() { 
  13. for (int i = 0; i < 50000; i++) 
  14.             System.out.println(i); 
  15.  
  16.         frame = new JFrame("Botoes"); 
  17.         panel = new JPanel(); 
  18.  
  19.         panel.setLayout(new GridLayout(4, 1)); 
  20.  
  21.         botao = new JButton("Aplicação inicializada"); 
  22.         botao.addActionListener(new ActionListener() { 
  23. public void actionPerformed(ActionEvent e) { 
  24.                 System.exit(0); 
  25.             } 
  26.         }); 
  27.  
  28.         panel.add(botao); 
  29.  
  30.         frame.getContentPane().add(panel, BorderLayout.CENTER); 
  31.         frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); 
  32.     } 
  33.  
  34. public void initApplication() { 
  35.         frame.pack(); 
  36.         frame.setVisible(true); 
  37.  
  38.         Splash.getInstance().finish(); 
  39.     } 

class Botoes extends JFrame { JButton botao; JFrame frame; JPanel panel; /** * Construtor da aplicacao principal. * Simula um load demorado com um loop, para mostrar que * a tela Splash realmente aparece enquanto a aplicacao * principal eh carregada. * */ public Botoes() { for (int i = 0; i < 50000; i++) System.out.println(i); frame = new JFrame("Botoes"); panel = new JPanel(); panel.setLayout(new GridLayout(4, 1)); botao = new JButton("Aplicação inicializada"); botao.addActionListener(new ActionListener() { public void actionPerformed(ActionEvent e) { System.exit(0); } }); panel.add(botao); frame.getContentPane().add(panel, BorderLayout.CENTER); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); } public void initApplication() { frame.pack(); frame.setVisible(true); Splash.getInstance().finish(); } }

Finalizando

Construindo a classe que implementa main(): Para testar nossa tela Splash basta fazer um programinha extremamente simples, como o mostrado abaixo:

 

  1. public class TestSplash { 
  2. public static void main(String[] args) {         
  3. // Faz o splash aparecer na tela
  4.         Splash.getInstance().openSplash(); 
  5.  
  6. // Chama a nossa aplicacao principal
  7.         Botoes b = new Botoes(); 
  8.         b.initApplication(); 
  9.     } 

public class TestSplash { public static void main(String[] args) { // Faz o splash aparecer na tela Splash.getInstance().openSplash(); // Chama a nossa aplicacao principal Botoes b = new Botoes(); b.initApplication(); } }
Pronto, agora basta compilar e visualizar o exemplo. Se tudo ocorrer direito, o Splash com o logo do GUJ irá aparecer na tela do monitor, e prestando atenção na tela do terminal você irá ver um contador sendo incrementado. Este contador é o que foi criado na classe Botao. O Splash irá sumir da tela assim que o contador terminar. É isso, um exemplo bastante simples mas que faz algo bem legal. Com algumas linhas de código a mais da para fazer coisas bem legais, como mostrar o status do programa sendo carregado direto na tela Splash, por exemplo. Claro que ainda existem milhares de outras abordagens para uma SplashScreen ser criada!

Anúncios
 
Deixe um comentário

Publicado por em 23/11/2009 em Estudos Java

 

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s

 
%d blogueiros gostam disto: