Apache Tapestry - Composants intégrés

Ce chapitre explique les composants intégrés de Tapestry avec des exemples appropriés. Tapestry prend en charge plus de 65 composants intégrés. Vous pouvez également créer des composants personnalisés. Laissez-nous couvrir certains des composants notables en détail.

Si composant

Le composant if est utilisé pour rendre un bloc de manière conditionnelle. La condition est vérifiée par un paramètre de test.

Créer une page IfSample.java comme indiqué ci-dessous -

package com.example.MyFirstApplication.pages;  

public class Ifsample {
   public String getUser() { 
      return "user1"; 
   } 
}

Maintenant, créez un fichier modèle correspondant comme suit -

<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 demande de la page rendra le résultat comme indiqué ci-dessous.

Result - http: // localhost: 8080 / MyFirstApplication / ifsample

Sauf et déléguer le composant

le unless componentest juste l'opposé du composant if qui a été discuté ci-dessus. Tandis que ledelegate componentne fait aucun rendu seul. Au lieu de cela, il délègue normalement le balisage à l'élément de bloc. À moins et si les composants peuvent utiliser déléguer et bloquer pour permuter conditionnellement le contenu dynamique.

Créer une page Unless.java comme suit.

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; 
      } 
   }   
}

Maintenant, créez un fichier modèle correspondant comme suit -

<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 demande de la page rendra le résultat comme indiqué ci-dessous.

Result - http: // localhost: 8080 / MyFirstApplication / sauf

Composant de boucle

Le composant de boucle est le composant de base pour boucler sur des éléments de collection et rendre le corps pour chaque valeur / itération.

Créez une page de boucle comme indiqué ci-dessous -

Loop.java

package com.example.MyFirstApplication.pages;  

import org.apache.tapestry5.annotations.Property;  
public class Loop { 
   @Property 
   private int i; 
}

Ensuite, créez le modèle Loop.tml correspondant

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>

Le composant Loop a les deux paramètres suivants -

source- Source de la collection. 1… 5 est une extension de propriété utilisée pour créer un tableau avec une plage spécifiée.
var- Variable de rendu. Utilisé pour rendre la valeur actuelle dans le corps du modèle.

Demander la page rendra le résultat comme indiqué ci-dessous -

Composant PageLink

Un composant PageLink est utilisé pour lier une page d'une page à une autre page. Créez une page de test PageLink comme ci-dessous -PageLink.java.

package com.example.MyFirstApplication.pages;  
   public class PageLink { 
}

Ensuite, créez un fichier modèle correspondant comme indiqué ci-dessous -

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>

Le composant PageLink a un paramètre de page qui doit faire référence à la page de tapisserie cible.

Result - http: // localhost: 8080 / myFirstApplication / pagelink

Composant EventLink

Le composant EventLink envoie le nom de l'événement et le paramètre correspondant via l'URL. Créez une classe de page EventsLink comme indiqué ci-dessous.

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; 
   }   
}

Ensuite, créez un fichier modèle «EventsLink» correspondant comme suit -

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 a les deux paramètres suivants -

Event- Le nom de l'événement à déclencher dans le composant EventLink. Par défaut, il pointe vers l'id du composant.
Context- C'est un paramètre facultatif. Il définit le contexte du lien.

Result - http: // localhost: 8080 / myFirstApplication / EventsLink

Après avoir cliqué sur la valeur de comptage, la page affichera le nom de l'événement dans l'URL, comme indiqué dans la capture d'écran de sortie suivante.

Composant ActionLink

Le composant ActionLink est similaire au composant EventLink, mais il n'envoie que l'ID du composant cible. Le nom d'événement par défaut est action.

Créez une page «ActivationLinks.java» comme indiqué ci-dessous,

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; 
   } 
}

Maintenant, créez un fichier modèle correspondant comme indiqué ci-dessous -

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>

Ici le OnActionFromSub sera appelée en cliquant sur le composant ActionLink.

Result - http: // localhost: 8080 / myFirstApplication / ActivationsLink

Composant d'alerte

Une boîte de dialogue d'alerte est principalement utilisée pour donner un message d'avertissement aux utilisateurs. Par exemple, si le champ de saisie nécessite du texte obligatoire mais que l'utilisateur ne fournit aucune entrée, dans le cadre de la validation, vous pouvez utiliser une boîte d'alerte pour donner un message d'avertissement.

Créez une page «Alertes» comme indiqué dans le programme suivant.

Alerts.java

package com.example.MyFirstApplication.pages;  

public class Alerts { 
   public String getUser() { 
      return "user1"; 
   } 
}

Ensuite, créez un fichier modèle correspondant comme suit -

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>

Une alerte a trois niveaux de gravité, qui sont -

Info
Warn
Error

Le modèle ci-dessus est créé à l'aide d'une alerte info. Il est défini commealert-info. Vous pouvez créer d'autres gravités en fonction des besoins.

La demande de la page produira le résultat suivant -

http://localhost:8080/myFirstApplication/Alerts

↰ Previous page Next page ↱