JSF - h: graphicImage

Il tag h: graphicImage restituisce un elemento HTML del tipo "img".

Tag JSF

<h:graphicImage  
   value = "http://www.tutorialspoint.com/images/jsf-mini-logo.png"/>

Output renderizzato

<img src = "http://www.tutorialspoint.com/images/jsf-mini-logo.png" />

Attributi dei tag

S.No	Attributo e descrizione
1	id Identificatore di un componente
2	binding Riferimento al componente che può essere utilizzato in un backing bean
3	rendered Un booleano; false sopprime il rendering
4	styleClass Nome della classe CSS (Cascading stylesheet)
5	value Il valore di un componente, in genere un'associazione di valori
6	alt Testo alternativo per elementi non testuali come immagini o applet
7	dir Direzione per il testo. I valori validi sonoltr (da sinistra a destra) e rtl (da destra a sinistra)
8	lang Lingua di base degli attributi e del testo di un elemento
9	style Informazioni sullo stile in linea
10	tabindex Valore numerico che specifica un indice di tabulazione
11	target Il nome di un frame in cui viene aperto un documento
12	title Un titolo, utilizzato per l'accessibilità, che descrive un elemento. I browser visivi in genere creano suggerimenti per il valore del titolo
13	usemap Mappa d'uso di un elemento
14	url Url dell'immagine
15	width Larghezza di un elemento
16	onblur L'elemento perde la concentrazione
17	onchange Il valore dell'elemento cambia
18	onclick Si fa clic sul pulsante del mouse sull'elemento
19	ondblclick Si fa doppio clic sul pulsante del mouse sull'elemento
20	onfocus L'elemento riceve il fuoco
21	onkeydown Viene premuto il tasto
22	onkeypress Il tasto viene premuto e successivamente rilasciato
23	onkeyup La chiave viene rilasciata
24	onmousedown Il pulsante del mouse viene premuto sull'elemento
25	onmousemove Il mouse si sposta sull'elemento
26	onmouseout Il mouse lascia l'area dell'elemento
27	onmouseover Il mouse si sposta su un elemento
28	onmouseup Il pulsante del mouse viene rilasciato

Applicazione di esempio

Creiamo un'applicazione JSF di prova per testare il tag precedente.

Passo	Descrizione
1	Creare un progetto con un nome helloworld sotto un pacchetto com.tutorialspoint.test come spiegato nel capitolo JSF - Prima applicazione .
2	Modifica home.xhtml come spiegato di seguito. Mantieni invariato il resto dei file.
3	Compilare ed eseguire l'applicazione per assicurarsi che la logica aziendale funzioni secondo i requisiti.
4	Infine, crea l'applicazione sotto forma di file war e distribuiscila in Apache Tomcat Webserver.
5	Avvia la tua applicazione web utilizzando l'URL appropriato come spiegato di seguito nell'ultimo passaggio.

home.xhtml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns = "http://www.w3.org/1999/xhtml">
   <head>
      <title>JSF Tutorial!</title>
   </head>
   
   <body>
      <h2>h:graphicImage example</h2>
      <hr />
      
      <h:form>      
         <h3>Image</h3>
         <h:graphicImage value = "/images/jsf-mini-logo.png"/>
      </h:form>
   </body>
</html>

Una volta che sei pronto con tutte le modifiche apportate, compiliamo ed eseguiamo l'applicazione come abbiamo fatto nel capitolo JSF - Prima applicazione. Se tutto va bene con la tua applicazione, questo produrrà il seguente risultato.