Apache Tapestry - Componenti integrati
Questo capitolo spiega i componenti incorporati di Tapestry con esempi appropriati. Tapestry supporta più di 65 componenti integrati. Puoi anche creare componenti personalizzati. Cerchiamo di coprire alcuni dei componenti notevoli in dettaglio.
Se Component
Il componente if viene utilizzato per eseguire il rendering di un blocco in modo condizionale. La condizione è verificata da un parametro di prova.
Crea una pagina IfSample.java come mostrato di seguito -
package com.example.MyFirstApplication.pages;
public class Ifsample {
public String getUser() {
return "user1";
}
}
Ora, crea un file modello corrispondente come segue:
<html t:type = "newlayout" title = "About MyFirstApplication"
xmlns:t = "http://tapestry.apache.org/schema/tapestry_5_4.xsd"
xmlns:p = "tapestry:parameter">
<h3>If-else component example </h3>
<t:if test = "user">
Hello ${user}
<p:else>
<h4> You are not a Tapestry user </h4>
</p:else>
</t:if>
</html>
La richiesta della pagina renderà il risultato come mostrato di seguito.
Result - http: // localhost: 8080 / MyFirstApplication / ifsample
A meno che e Delegate Component
Il unless componentè esattamente l'opposto del componente if discusso sopra. Mentre ildelegate componentnon esegue alcun rendering da solo. Invece, normalmente delega il markup a block element. A meno che e se i componenti possono utilizzare delegato e blocco per scambiare in modo condizionale il contenuto dinamico.
Crea una pagina Unless.java come segue.
package com.example.MyFirstApplication.pages;
import org.apache.tapestry5.Block;
import org.apache.tapestry5.annotations.Property;
import org.apache.tapestry5.ioc.annotations.Inject;
import org.apache.tapestry5.PersistenceConstants;
import org.apache.tapestry5.annotations.Persist;
public class Unless {
@Property
@Persist(PersistenceConstants.FLASH)
private String value;
@Property
private Boolean bool;
@Inject
Block t, f, n;
public Block getCase() {
if (bool == Boolean.TRUE ) {
return t;
} else {
return f;
}
}
}
Ora, crea un file modello corrispondente come segue:
<html t:type = "newlayout" title = "About MyFirstApplication"
xmlns:t = "http://tapestry.apache.org/schema/tapestry_5_4.xsd"
xmlns:p = "tapestry:parameter">
<h4> Delegate component </h4>
<div class = "div1">
<t:delegate to = "case"/>
</div>
<h4> If-Unless component </h4>
<div class = "div1">
<t:if test = "bool">
<t:delegate to = "block:t"/>
</t:if>
<t:unless test = "bool">
<t:delegate to = "block:notT"/>
</t:unless>
</div>
<t:block id = "t">
bool == Boolean.TRUE.
</t:block>
<t:block id = "notT">
bool = Boolean.FALSE.
</t:block>
<t:block id = "f">
bool == Boolean.FALSE.
</t:block>
</html>
La richiesta della pagina renderà il risultato come mostrato di seguito.
Result - http: // localhost: 8080 / MyFirstApplication / a meno che
Componente loop
Il componente loop è il componente di base per eseguire il loop degli elementi di una raccolta e renderizzare il corpo per ogni valore / iterazione.
Crea una pagina Loop come mostrato di seguito -
Loop.java
package com.example.MyFirstApplication.pages;
import org.apache.tapestry5.annotations.Property;
public class Loop {
@Property
private int i;
}
Quindi, crea il modello corrispondente Loop.tml
Loop.tml
<html t:type = "newlayout" title = "About MyFirstApplication"
xmlns:t = "http://tapestry.apache.org/schema/tapestry_5_4.xsd"
xmlns:p = "tapestry:parameter">
<p>This is sample parameter rendering example...</p>
<ol>
<li t:type = "loop" source = "1..5" value = "var:i">${var:i}</li>
</ol>
</html>
Il componente Loop ha i seguenti due parametri:
source- Fonte della raccolta. 1… 5 è un'espansione di proprietà utilizzata per creare un array con un intervallo specificato.
var- Variabile di rendering. Utilizzato per eseguire il rendering del valore corrente nel corpo del modello.
La richiesta della pagina renderà il risultato come mostrato di seguito:
Componente PageLink
Un componente PageLink viene utilizzato per collegare una pagina da una pagina a un'altra pagina. Crea una pagina di test PageLink come di seguito:PageLink.java.
package com.example.MyFirstApplication.pages;
public class PageLink {
}
Quindi, crea un file modello corrispondente come mostrato di seguito:
PageLink.tml
<html t:type = "newlayout" title = "About MyFirstApplication"
xmlns:t = "http://tapestry.apache.org/schema/tapestry_5_4.xsd"
xmlns:p = "tapestry:parameter">
<body>
<h3><u>Page Link</u> </h3>
<div class = "page">
<t:pagelink page = "Index">Click here to navigate Index page</t:pagelink>
<br/>
</div>
</body>
</html>
Il componente PageLink ha un parametro di pagina che dovrebbe fare riferimento alla pagina dell'arazzo di destinazione.
Result - http: // localhost: 8080 / myFirstApplication / pagelink
Componente EventLink
Il componente EventLink invia il nome dell'evento e il parametro corrispondente tramite l'URL. Crea una classe di pagina EventsLink come mostrato di seguito.
EventsLink.java
package com.example.MyFirstApplication.pages;
import org.apache.tapestry5.annotations.Property;
public class EventsLink {
@Property
private int x;
void onActivate(int count) {
this.x = x;
}
int onPassivate() {
return x;
}
void onAdd(int value) {
x += value;
}
}
Quindi, crea un file modello "EventsLink" corrispondente come segue:
EventsLink.tml
<html t:type = "newlayout" title = "About MyFirstApplication"
xmlns:t = "http://tapestry.apache.org/schema/tapestry_5_4.xsd"
xmlns:p = "tapestry:parameter">
<h3> Event link example </h3>
AddedCount = ${x}. <br/>
<t:eventlink t:event = "add" t:context = "literal:1">
Click here to add count
</t:eventlink><br/>
</html>
EventLink ha i seguenti due parametri:
Event- Il nome dell'evento da attivare nel componente EventLink. Per impostazione predefinita, punta all'ID del componente.
Context- È un parametro opzionale. Definisce il contesto per il collegamento.
Result - http: // localhost: 8080 / myFirstApplication / EventsLink
Dopo aver fatto clic sul valore del conteggio, la pagina visualizzerà il nome dell'evento nell'URL come mostrato nella seguente schermata di output.
Componente ActionLink
Il componente ActionLink è simile al componente EventLink, ma invia solo l'ID del componente di destinazione. Il nome dell'evento predefinito è action.
Crea una pagina "ActivationLinks.java" come mostrato di seguito,
ActivationLinks.java
package com.example.MyFirstApplication.pages;
import org.apache.tapestry5.annotations.Property;
public class ActivationLinks {
@Property
private int x;
void onActivate(int count) {
this.x = x;
}
int onPassivate() {
return x;
}
void onActionFromsub(int value) {
x -= value;
}
}
Ora, crea un file modello corrispondente come mostrato di seguito -
ActivationLinks.tml
<html t:type = "Newlayout" title = "About MyFirstApplication"
xmlns:t = "http://tapestry.apache.org/schema/tapestry_5_4.xsd"
xmlns:p = "tapestry:parameter">
<div class = "div1">
Count = ${count}. <br/>
<t:actionlink t:id = "sub" t:context = "literal:1">
Decrement
</t:actionlink><br/>
</div>
</html>
Qui, il OnActionFromSub verrà chiamato quando si fa clic sul componente ActionLink.
Result - http: // localhost: 8080 / myFirstApplication / ActivationsLink
Componente di avviso
Una finestra di dialogo di avviso viene utilizzata principalmente per fornire un messaggio di avviso agli utenti. Ad esempio, se il campo di input richiede del testo obbligatorio ma l'utente non fornisce alcun input, come parte della convalida, è possibile utilizzare una casella di avviso per fornire un messaggio di avviso.
Creare una pagina "Avvisi" come mostrato nel seguente programma.
Alerts.java
package com.example.MyFirstApplication.pages;
public class Alerts {
public String getUser() {
return "user1";
}
}
Quindi, crea un file modello corrispondente come segue:
Alerts.tml
<html t:type = "Newlayout" title = "About MyFirstApplication"
xmlns:t = "http://tapestry.apache.org/schema/tapestry_5_4.xsd"
xmlns:p = "tapestry:parameter">
<h3>Alerts</h3>
<div class = "alert alert-info">
<h5> Welcome ${user} </h5>
</div>
</html>
Un avviso ha tre livelli di gravità, che sono:
- Info
- Warn
- Error
Il modello sopra viene creato utilizzando un avviso informativo. È definito comealert-info. È possibile creare altri livelli di gravità a seconda delle necessità.
La richiesta della pagina produrrà il seguente risultato:
http://localhost:8080/myFirstApplication/Alerts