Olá desenvolvedores, hoje trabalharemos com o Graphic Image, tag que renderiza um elemento de imagem. E dessa forma estilizaremos ainda mais o pequeno formulário que desenvolvemos ao longo desses dois últimos módulos.

Seria interessante que o formulário exibisse também um logo, atribuindo, dessa forma, uma identidade a ele. A imagem cumpriria também a função de auxiliar o usuário, sobre onde ele se encontra.

INSERINDO A GRAPHIC IMAGE

Assim, iremos inserir a imagem como parte do cabeçalho, desse modo, logo abaixo Da tag h1 insira a tag h:graphicimage. Na tag, o caminho da imagem poderá ser apontado por meio do atributo “value”, passando para ele um localizador uniforme de recursos ou como é mais comumente conhecido, URL – Uniform Resource Locator. As propriedades height e width poderão ser utilizadas para redefinir as dimensões da imagem.

Mas e se você quisesse exibir a imagem a partir do seu projeto, isto é, a partir de um arquivo de imagem localizado no diretório do próprio projeto, como seria? O procedimento é bem simples, crie na raiz da pasta WebContent uma pasta e atribua a ela o nome de resources.

Dando a pasta o nome de resources possibilitará que o JavaServer Faces procure pelo arquivo dentro da pasta de forma automática. Dentro da pasta resources crie uma subpasta e atribua a ela o nome de img. Salve a imagem da sua preferência dentro da subpasta.

Feito isso ainda precisaremos do caminho da imagem, e a forma de obtê-lo é também bem simples. Clique com o botão direito do mouse sobre a imagem >> Properties. Na tela que se abrirá o caminho da imagem poderá ser encontrado em Path ou Location.

E igualmente tal como no primeiro método o caminho da imagem será passado a propriedade “value”. No entanto, como criamos a pasta resources e inserimos a subpasta da imagem dentro dela, não precisaremos mais do value.

Poderemos então utilizar a propriedade library que receberá o nome da pasta onde a imagem se encontra e o atributo name que receberá o nome da imagem.

EM POUCAS PALAVRAS

Neste tutorial exemplificamos três métodos de inserir imagens em uma aplicação JSF – JavaServer Faces utilizando a h:graphicimage.