Quicknavi |
|
«Vorherige Seite | Startseite | Nächste Seite »
Templates
1. Zweck von Templates
Templates sind in diesem Framework ein "Abfallprodukt" der unter Klassen
erläutert DOM-Struktur der GUI und dienen der Abstraktion und Trennung von Funktion und Darstellung
gemäß MVC-Pattern. Sie bieten die Möglichkeit, verschiedene Teil-Elemente oder Views
in XML- und HTML-Code zu definieren, mit dem anschließend ein Controller einen View erstellen
kann. Im Sprachgebrauch dieses Frameworks gibt es zwei Arten von Templates. Zu einen die Template-
Dateien, die zum Speichern der XML- und HTML-Fragmente, die den Inhalt eines DOM-Knotens repräsentieren,
gedacht sind, zum anderen HTML-Templates innerhalb dieser Dateien, die einen wiederverwendbaren
Bereich von XML- und HTML-Code definieren. Letzterer wird oft für die Darstellung von Listen
benötigt, in der ein Listenelement durch beliebige Iteration im Controller zu einer Liste
zusammengefügt wird.
2. Aufbau von Templates
Template-Dateien beinhalten drei Kategorien von Zeichenketten:
- TagLibTags
- HTML-Code
- Einfacher Text
TagLibTags sind dabei dem Tag-Parser bekannte XML-Tags der Form <prefix:class />,
wobei "prefix" und "class" durch jedes beliebige XML-konforme Präfix und jeden Klassenbezeichner
des Tags ersetzbar sind. Erlaubt sind hier die Zeichen [a-z]. Jedes Tag kann eine
beliebige Anzahl von Attributen und bei nicht selbstschließenden Tags einen Inhalt besitzen.
Diese haben die Form attribute="value". HTML-Code und einfacher Text sind sowohl als
Attribute von TagLibTags als auch als Inhalte verwendbar.
3. Typische Templates
Im Folgenden werden einige typische Templates aufgeführt und erläutert.
3.1. Template zur Darstellung dynamischer Inhalte
Ein Anwendungsbeispiel für die Darstellung dynamischer Inhalte ist das generische Befüllen
von Meta-Tag-Angaben. Dazu können in einem Template mehrere <html:placeholder />-
Tags eingesetzt werden. Die dynamischen Meta-Tags dieser Dokumentations-Seite haben folgende Gestalt:
[..]
<meta name="DC.Date" content="<html:placeholder name="Date" />" />
<meta name="DC.Type" content="Text" />
<meta name="DC.Format" content="text/html" />
<meta name="DC.Identifier" content="Dipl.-Ing. (FH) Christian W. Schäfer" />
<meta name="DC.Source" content="<html:placeholder name="URI" />" />
<meta name="DC.Language" content="de" />
<meta name="DC.Relation" content="<html:placeholder name="URI" />" />
[..]
<meta name="keywords" lang="de" content="PHP,Framework,PageController,FrontController,Pattern,[..]" />
<meta name="date" content="<html:placeholder name="Date" />" />
<meta name="robots" content="index,follow" />
<meta name="revisit-after" content="5 days" />
[..]
Hier stehen nun zwei unterschiedliche Platzhalter zur Verfügung, die in einem Controller mit
Inhalten gefüllt werden können. Die XML-Tags werden dann beim Transformieren der Seite durch
die im Controller eingesetzten Inhalten ersetzt.
3.2. HTML-Templates
HTML-Templates dienen - wie bereits angesprochen - zur Definition von wiederverwendbaren HTML-Fragmenten
zur Darstellung von Listen oder Tabellen. Hier werden zumeist je Element ein Template erstellt, das
vom Controller zum Aufbau eines Views oder eines View-Elements verwendet werden kann. HTML-Templates
werden nicht direkt am Platz ihrer Definition ausgegeben, sondern sind nur Struktur-Elemente die zur
Generierung von Elementen genutzt werden können. Im Folgenden soll eine Template-Datei zum
Aufbau einer einspaltigen Tabelle aufgeführt werden:
[..]
<html:placeholder name="List" />
<html:template name="ListHeader">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<strong>ExampleList</strong>
</td>
</tr>
<template:placeholder name="TableElements" />
</table>
</html:template>
<html:template name="ListItem">
<tr>
<td>
<template:placeholder name="ItemValue" />
</td>
</tr>
</html:template>
In der Template-Datei werden drei Elemente definiert:
-
HTML-Platzhalter:
Dieser dient der Darstellung der fertigen Liste. Er wird im Controller mit dem HTML-Code der
generierten Liste gefüllt.
-
HTML-Template "ListHeader":
Dieses HTML-Template definiert den Kopf der Liste. Es beinhaltet ebenso einen Platzhalter, in den
die Listenelemente eingesetzt werden können.
-
HTML-Template "ListItem":
Dieses HTML-Template repräsentiert ein Listen-Element. Es besitzt einen Platzhalter für
die Darstellung des Liste-Inhalts.
Die Implementierung des DocumentControllers würde in diesem Fall folgendem Schema genügen:
START
|
v
+--------------------------------+
| Laden der Listen-Einträge |
+--------------------------------+
|
v
+--------------------------------+
| Initialisieren Listenpuffer |
+--------------------------------+
|
v
+--------------------------------+
| Iterieren der Liste |
+--------------------------------+
|
v
+--------------------------------+
| Einsetzen des Listenwertes in |
| Template "ListItem" |
+--------------------------------+
|
v
+--------------------------------+
| Transformieren von "ListItem" |
| Hinzufügen des Puffers |
| zum Listenpuffer |
+--------------------------------+
|
v
+--------------------------------+
| Einsetzen des Listenpuffers in |
| Template "ListHeader" |
+--------------------------------+
|
v
+--------------------------------+
| Transform. von "ListHeader" |
| Einsetzen des Inhalts in den |
| Platzhalter "List" |
+--------------------------------+
|
v
ENDE
Tipp: Templates, die nicht für die Generierung von Listen oder anderen mehrfach
vorkommenden Strukturen eingesetzt werden, können direkt an der Stelle ausgegeben werden, an der
sie in der Template-Datei definiert wurde. Hierzu muss im DocumentController die Methode
transformOnPlace() aufgerufen werden. Möchte der Entwickler das HTML-Template
...
<html:template name="mein_template">
...
</html:template/>
...
direkt ausgeben, so muss im DocumentController folgendes notiert werden:
class mein_controller extends baseController { function transformContent(){ $Template = &$this->__getTemplate('mein_template'); $Template->transformOnPlace(); // end function } // end class }
3.3. Dynamische Einbindung von Views
Zur dynamischen Einbindung von Views besitzt der <core:importdesign />-Tag
ein generisches Tag-Konstrukt. Dieses bietet die Möglichkeit einen Standard-View zu definieren,
der mit einem definierten URL-Parameter beeinflusst werden kann:
<core:importdesign namespace="[..]" template="[pagepart = start]" />
Ist der URL-Parameter "pagepart" nicht gesetzt, so wird die Template-Datei "start" eingebunden, falls
der Parameter gesetzt ist, der dadurch definierte View. So ist es möglich einen Workflow mit einer
Serie an Views (z.B. ein mehrseitiges Formular) abzubilden oder dieses zur Darstellung unterschiedlicher
Teile eines Moduls zu nutzen. Da es bei Einbindung mehrere Module über den "pagepart"-Parameter
zu Überschneidungen kommen kann, ist der URL-Parameter über das Attribut incparam
manipulierbar. Die Einbindung gestaltet sich dann wie folgt:
<core:importdesign namespace="[..]" incparam="myurlparam" template="[myurlparam = start]" />
Ein konkretes Beispiel für die dynamischen View-Einbindung ist die Steuerung der angezeigten
Perspektive der vorliegenden Seite. Je nach Wunsch des Benutzers wird einer der verhandenen Views
(Normale Webseiten-Ansicht bzw. Print-Ansicht) ausgegeben. Dazu ist in der Template-Datei
website.html ein <core:importdesign />-Tag mit dem Inhalt
<core:importdesign
namespace="sites::demosite::pres::templates"
template="[perspective=site]"
incparam="perspective"
/>
definiert. Damit ist es auf einfache Weise möglich eine Druck-Funktion bereitszustellen. Ein
Klick auf den oben aufgeführten Print-Link demonstriert
die Funktion.
3.4. Weitere Tags
Alle im Lieferumfang des Frameworks enthaltenen Tags werden auf der Seite
Standard-TagLibs dokumentiert.
Weiterführende Template-Beispiele sind unter Gästebuch-Tutorial
und Kontaktformular-Tutorial
zu finden.
Kommentare
Möchten Sie den Artikel eine Anmerkung hinzufügen, oder haben Sie ergänzende Hinweise? Dann können Sie diese hier einfügen. Die bereits verfassten Anmerkungen und Kommentare finden Sie in der untenstehenden Liste.
Für diesen Artikel liegen aktuell keine Kommentare vor.
|