Você pode arrastar o componente Imagem da categoria Básico da Paleta para o Visual Designer a fim de adicionar uma imagem, tal como um arquivo JPEG, GIF ou PNG, a uma página JSF Visual Web. Ao soltar a imagem na página no Visual Designer, é exibida um quadro simples com a palavra Imagem nele.
Este é um componente JavaServer Faces 1.1. Você vê os componentes que usam essa
versão do JavaServer Faces quando o seu projeto usa J2EE 1.4 ou J2EE 1.3.
Se clicar com o botão direito do mouse neste quadro e escolher Definir imagem, é exibida uma caixa de diálogo que pode ser usada para especificar a imagem de três formas:
Escolher arquivo. Você pode ir até um arquivo do sistema de arquivos e clicar em OK. O arquivo de imagem é copiado para o projeto, e você pode vê-lo na janela Projetos em nome-do-projeto > Páginas da Web > recursos. A escolha desta opção define a propriedade url do componente Imagem como /resources/arquivo-de-imagem.
Inserir URL. Insere no arquivo um URL para um local da Web. Por exemplo, insere o seguinte URL:
.
A escolha desta opção define a propriedade url do componente Imagem como o URL inserido.
Definir ícone do tema. Exibe uma lista de ícones que estão no tema associado à aplicação. Selecione um nome de ícone na lista para exibi-lo na caixa de diálogo. A escolha desta opção define a propriedade icon do componente Imagem como o nome do ícone escolhido.
Se a propriedade url já estiver definida, a escolha de um ícone não altera a aparência do componente, pois a propriedade url tem prioridade sobre a propriedade icon. Para que o ícone esteja visível, a propriedade url não deve estar definida.
Outra forma de adicionar uma imagem à página é arrastar o nó do arquivo de uma caixa de diálogo do explorador de arquivos para a página. Por exemplo, se abrir o explorador de arquivos do Microsoft Windows e for até uma imagem GIF, você pode arrastar o seu nó para a página e soltar o arquivo de imagem onde quiser que ele seja exibido na página. O IDE adiciona o arquivo ao diretório resources, que pode ser visto na pasta nome-do-projeto > Páginas da Web na janela Projetos.
Depois de soltar o componente na página, você pode selecioná-lo e editar suas propriedades na janela Propriedades do componente Imagem. Se necessário, clique com o botão direito do mouse no componente e escolha Propriedades para exibir a janela Propriedades. Além das propriedades descritas acima que especificam a imagem que será exibida, algumas propriedades típicas que podem ser definidas são:
id. O nome do componente Imagem. No arquivo JSP, este nome é o valor do atributo id do componente. No bean de página, o valor desta propriedade é o nome do objeto Image.
alt. O texto alternativo da imagem. O texto alt descreve o elemento gráfico na página HTML, pode ser lido por leitores de tela, pode ser exibido como uma dica de ferramenta e é exibido quando o usuário tem a visualização de imagens desativada no navegador da Web. Equivale ao atributo HTML alt da marca <img>.
align. A posição da imagem em relação ao seu contexto na página. Selecione uma posição na lista suspensa para alinhar a imagem a outros componentes.
borda. Especifica a largura da borda da imagem em pixels. O valor padrão desta propriedade depende do navegador do cliente.
Você pode clicar com o botão direito do mouse no componente e selecionar uma destas opções:
Definir imagem. Abre uma caixa de diálogo que permite definir a imagem para um arquivo, url ou um ícone. Ao especificar a imagem nesta caixa de diálogo, as propriedades adequadas são definidas. A propriedade url especifica uma imagem em um arquivo ou em um URL na Web. A propriedade icon especifica um ícone no tema padrão.
Vincular aos dados. Abre a caixa de diálogo que permite vincular a propriedade url do componente a um objeto ou a um provedor de dados que fornece seu valor para que você possa atualizar dinamicamente a imagem. Para obter mais informações, consulte Caixa de diálogo Vincular aos dados.
Vinculações de propriedade. Abre a caixa de diálogo que permite vincular as propriedades dos componentes, além da propriedade url, a outros objetos ou propriedades que atualizam automaticamente estas propriedades do componente.
Adicionar atributo de vinculação. Essa opção adiciona um atributo de vinculação ao componente
Observação: se você planeja fazer o script do componente em código Java, deve adicionar um atributo de vinculação manualmente, que é vinculado usando uma expressão vinculadora de valor a uma propriedade do bean da página de backup.
Remover atributo de vinculação Essa opção remove o atributo de vinculação do componente.