In diesem Premium-Video- und Begleitartikel-Artikel erfahren Sie, wie Sie eine einfache, aber leistungsfähige Bibliothek erstellen, um Layouts im beliebten CodeIgniter Framework zu verarbeiten. Mit der von Ihnen erstellten Bibliothek können Sie Ihre Effizienz maximieren, Zeit und Code sparen, Ihre Ansichten und sogar Ihre Javascript- und CSS-Dateien modularisieren.
Für dieses Tutorial benötigen Sie lediglich das CodeIgniter 1.7.2-Framework. Sie können es von ihrer Website unter codeigniter.com/downloads/ herunterladen.
Die grundlegende Funktionalität dieser Bibliothek wird sehr einfach sein. Wir nehmen den Inhalt einer Ansicht, rendern sie mit den entsprechenden Daten, nehmen dann den gerenderten Inhalt und weisen ihn einer Variablen zu. Jetzt rendern wir das Layout selbst und ersetzen einen Teil des Layouts durch den Inhalt dieser Variablen. Einfach, aber stark genug.
Die Idee ist, die Anrufe zu imitieren $ this-> load-> view ().
Wenn wir diese Methode aufrufen, übergeben wir den Namen (und den Ort) unserer Ansicht und dann ein Datenfeld, auf das von der Ansicht aus zugegriffen werden kann. Hier ist ein Beispiel:
Funktionsmethode ($ url_param) $ this-> load-> view ('controller_views / method_view', array ('url_param' => $ url_param));
Der obige Code übernimmt die Datei system / application / views / controller_views / method_view.php
, Übergeben Sie die Variable url_param und senden Sie sie an den Browser. Hier kommen wir ins Spiel. Wir werden den Inhalt noch nicht an den Browser senden. Stattdessen senden wir es an das Layout und dann an den Browser. Aber wie machen wir das??
Das Aussicht()
Methode, die wir gerade aufgerufen haben, kann ein dritter (boolescher) Parameter übergeben werden, der, wenn er wahr ist, verwendet wird Rückkehr die gerenderte Ansicht, anstatt sie an den Browser zu senden. Wir können diesen Inhalt speichern und einen zweiten Aufruf derselben Methode ausführen, aber diesmal rufen Sie eine Layoutdatei auf, die diesen Inhalt druckt (umgeben von allen Kopfzeilen, Seitenleisten und Fußzeilen)..
Wir werden diese Bibliothek Schritt für Schritt erstellen, beginnend mit dem einfachsten. Zunächst erstellen wir eine neue Bibliothek in unserem System / Anwendung / Bibliotheken Ordner und nennen Sie es Layouts.
Wenn Sie noch nie eine CodeIgniter-Bibliothek erstellt haben, handelt es sich lediglich um Klassen, die durch einen Aufruf an geladen werden
$ this-> load-> library ()
.
Lass uns also direkt in den Code springen:
Gehen wir durch jeden Abschnitt des Codes:
- Die allererste Zeile ist eine Codierungskonvention von CodeIgniter. Sie stellt im Wesentlichen sicher, dass Benutzer nicht direkt über die Browser auf die Datei zugreifen können, da CodeIgniter die Einstellung setzt
BASEPATH
konstant in seinerindex.php
Datei.- Die Klasse wird nur PHP 5 sein. Auf diese Weise können wir der Klasse Methodenverkettung hinzufügen, die später nützlich sein wird, wenn wir mit JS und CSS-Includes arbeiten.
- Der Klassenkonstruktor hat vorerst nichts. Dies ist nur das Skelett unserer Bibliothek.
Was passiert also, wenn wir dies von a einschließen
Regler
? Naja nichts. Die Klasse macht absolut nichts (nicht einmal den Konstruktor), also passiert nichts.
Schritt 4 Erstellen Sie ein Layout
Wir erstellen ein sehr einfaches Layout, um zu erklären, wie alles funktioniert.
Unser allererstes Layout! Wie Sie sehen können, ist dies extrem einfach. Es ist nur ein Titel und ein Körper. Jetzt liegt der wichtige Teil im PHP-Code. Wir wiederholen ein
$ content_for_layout
Variable. Die Idee ist, den gerenderten Inhalt dieser Variablen zuzuweisen. Auf diese Weise wird es dort gedruckt, umgeben vom Rest des Körpers, Kopfes usw.
Schritt 5 Schreiben Sie etwas Code!
Schreiben wir etwas Code, um dieses Layout zu handhaben:
CI = & get_instance (); public function view ($ view_name, $ params = array (), $ layout = 'default') // Lade den Inhalt der Ansicht, wobei die Parameter $ view_content = $ this-> CI-> load-> view ($ view_name, $ params, TRUE); // Lade jetzt das Layout und übergebe die gerade gerenderte Ansicht. $ This-> CI-> load-> view ('laytous /'. $ Layout, array ('content_for_layout' => $ view_content));Lassen Sie uns erklären, wie der neue Code aussieht:
- Wir haben unserer Bibliothek ein neues privates Attribut hinzugefügt:
$ CI
. In unseren Bibliotheken können wir nicht direkt auf die CodeIgniter-Instanz zugreifen. Der einzige Weg ist, einen Verweis darauf zu bekommen und von dort aus darauf zuzugreifen. In unserem Konstruktor (der beim Laden der Bibliothek aufgerufen wird) rufen wir unsere CI-Instanz ab und weisen sie unserem lokalen privaten Benutzer zu$ CI
Attribut, so können wir es später aufrufen. Wir brauchen es, um das anzurufenLaden-> Ansicht ()
Methode.- Jetzt haben wir eine Ansichtsmethode hinzugefügt. Die Syntax ist praktisch identisch mit der
Laden-> Ansicht ()
Methode. Wir erhalten einen Ansichtsnamen, ein Array von Parametern (die Variablen, die in der Ansicht sichtbar sein werden) und einen Layoutnamen, der standardmäßig (duh) 'default' ist. Letzteres erlaubt es uns, mehrere Layouts in unserer Anwendung zu haben (vielleicht eines für die Login-Box ohne Menüs und Sachen).- Wie wir vorher gesprochen haben, nennen wir das
Laden-> Ansicht ()
Als Methode übergeben wir den Namen der Ansicht, die Parameter und einen dritten Parameter mit dem Wert vonWAHR
. Dadurch wird sichergestellt, dass die Ausgabe nicht an den Browser gesendet wird. Stattdessen wird es an uns zurückgegeben und der Variablen zugewiesen$ view_content
.- Zum Schluss laden wir die Layoutdatei (die wir im speichern werden)
System / Anwendung / Ansichten / Layouts
Ordner), und übergeben Sie den Inhalt der gerade geladenen Ansicht als Parameter. Wenn das Layout geladen wird, wird die$ content_for_layout
Die Variable wird durch den gerade geladenen Inhalt ersetzt und an den Browser gesendet (beachten Sie den fehlenden letzten Parameter, wir werden nicht übergebenWAHR
diesmal).
Schritt 6 Ändern Sie den Titel der Seite
Die Basisbibliothek ist technisch erstellt. Aber es gibt ein paar Dinge, die wir hinzufügen können, um es noch besser zu machen.
So ist der Titel des Layouts immer gleich. Das ist nicht praktisch. Wir müssen es leicht von unseren Controllern aus ändern können, ohne unendlich viele Layouts mit unterschiedlichen Titeln erstellen zu müssen (dies würde den Zweck dieses Tutorials zunichte machen). Wie machen wir das? Wir nehmen an, dass die Site einen permanenten Titel hat, beispielsweise "Layouts Library". Danach würden wir den Bereich der Website, den wir besuchen, einfügen. Für die Anmeldeseite lautet der Titel beispielsweise "Layouts Library | Login"..
Zuerst schreiben wir das Layout ein bisschen um.
Layouts-Bibliothek Wir haben gerade ein weiteres PHP hinzugefügt
Echo
. Diesmal drucken wir die$ title_for_layout
Variable, die wir in unserer Bibliothek optimieren werden. Hier ist die umgeschriebene Bibliothek:CI = & get_instance (); public function set_title ($ title) $ this-> title_for_layout = $ title; Öffentliche Funktionsansicht ($ view_name, $ params = array (), $ layout = 'default') // Behandelt den Titel der Site. Wenn NULL, füge nichts hinzu. Wenn nicht, fügen Sie ein // Trennzeichen hinzu und hängen den Titel an. if ($ this-> title_for_layout! == NULL) $ separates_title_for_layout = $ this-> title_separator. $ this-> title_for_layout; // Lade den Inhalt der Ansicht mit den übergebenen Parametern $ view_content = $ this-> CI-> load-> view ($ view_name, $ params, TRUE); // Laden Sie jetzt das Layout und übergeben Sie die gerade gerenderte Ansicht: $ this-> CI-> load-> view ('laytous /'. $ Layout, array ('content_for_layout' => $ view_content, 'title_for_layout' => $ separate_title_for_layout));Was haben wir hier gemacht??
- Wir haben unserer Bibliothek zwei neue Attribute hinzugefügt:
$ title_for_layout
und$ title_separator.
Der erste wird unseren Titel enthalten, und der zweite definiert die Zeichenfolge, die den Titel des Layouts von dem von der Gruppe festgelegten Titel trenntset_title ()
Methode.- Seit der
$ title_for_layout
wurde auf privat gesetzt, fügen wir eine Methode hinzu, um sie von unseren Controllern festzulegen. Somit,set_title ()
setzt den Wert von$ title_for_layout
zu was auch immer wir es sagen, z. 'Anmeldung'.- In dem
Aussicht()
Methode haben wir ein Stück Code hinzugefügt, um das neue Attribut zu behandeln. Wenn der Benutzer niemals einen Titel für die Seite festlegt, möchten wir "in der Lage sein, sich" grausam abzubauen ", dh. Das Trennzeichen nicht umsonst anhängen. Daher überprüfen wir zuerst den Wert von$ title_for_layout
Attribut. Wenn nichtNULL
, Dann hängen wir das konfigurierte Trennzeichen und den von der Gruppe festgelegten Titel anset_title ()
Methode.- Beim Rendern des Layouts stellen wir sicher, dass wir das neue Attribut übergeben (auch wenn NULL), damit wir es im Titel wiederholen können.
Schritt 7 Hinzufügen von modularem CSS und JS
Zum Schluss möchten wir CSS- und Javascript-Dateien modular hinzufügen können. Was bedeutet das? Angenommen, Sie möchten ein jQuery-Plugin verwenden, Sie möchten es jedoch nur für einen Teil der Website verwenden (möglicherweise ein Plugin für die Formularüberprüfung). Sie könnten es einfach in die Ansicht selbst einschließen, aber im endgültigen Code sieht das nicht sehr gut aus. Es ist immer vorzuziehen, alle Javascript- (und CSS-) Elemente in der
Header
. Wir werden eine Methode erstellen (also eigentlich zwei), mit der wir genau dies tun können.Fügen Sie der Bibliothek diese beiden Methoden hinzu:
öffentliche Funktion add_include ($ path, $ prepend_base_url = TRUE) if ($ prepend_base_url) $ this-> CI-> load-> helper ('url'); // Lade das nur um sicher zu gehen, dass $ this-> file_includes [] = base_url () ist. $ path; else $ this-> file_includes [] = $ path; $ this zurückgeben; // Dies erlaubt Kettenmethoden public function print_includes () // Eine Zeichenfolge initialisieren, die alle enthält. Include_includes = "; foreach ($ this-> umfasst als $ include) // Überprüfen Sie, ob es sich um eine JS oder eine CSS-Datei if (preg_match ('/ js $ /', $ include)) // Es handelt sich um eine JS-Datei $ final_includes. = ''; elseif (preg_match ('/ css $ /', $ include)) // Dies ist eine CSS-Datei $ final_includes. = ''; return $ final_includes;Stellen Sie sicher, dass Sie dieses neue Attribut auch über Ihrer Klasse in Ihre Klasse einfügen
Konstrukteur
:private $ Includes = array ();und dies zu deinem Layout, gleich nach dem Titel
layouts-> print_includes ()?>Eine kleine Erklärung:
- Das
add_include ()
Mit dieser Methode können wir mehrere JS - oder CSS - Dateien aus unsererRegler
. Es erlaubt sogar die Verkettung von Methoden, was bedeutet, dass wir etwas tun können$ this-> layouts-> add_include ('js / jquery.js') -> add_include ('js / jquery.plugin.js') -> add_include ('css / jquery.plugin.css');
was sehr bequem sein kann, wenn mehrere Sachen geladen werden. Diese Methode der Verkettung von Methoden ist der Grund, warum wir PHP 5 benötigen, da PHP 4 es nicht unterstützt.- Das
$ prepend_base_url
Parameter auf deradd_include ()
Bei dieser Methode wird standardmäßig die Basis-URL der CodeIgniter-Installation vorangestellt. Durch Aufruf dieser Methode mit der$ prepend_base_url
einstellenFALSCH
, Wir können entfernte Dateien einschließen (z. B. die jQuery lib aus dem CDN von Google)..- Das
print_includes ()
Methode ist selbsterklärend. Es iteriert durch alle mit dem Addiertenadd_include ()
prüft, ob es sich bei der Datei um eine Javascript- oder eine CSS-Datei handelt (keine anderen Dateien werden unterstützt), und hängt das Include an eine Zeichenfolge an, die schließlich im Layout wiedergegeben wird.
Fazit
Wir haben eine komplette und sehr praktische Layout-Manager-Bibliothek für CodeIgniter von Grund auf erstellt! Auf diese Weise können Sie Zeit sparen, unnötige Aufrufe von Kopfzeilen, Inhalten und Fußzeilen vermeiden und Ihre Javascript- und CSS-Dateien modularisieren.
Dies ist der endgültige Code für das Layout und die Bibliothek:
Layouts-Bibliothek layouts-> print_includes (); ?>CI = & get_instance (); public function set_title ($ title) $ this-> title_for_layout = $ title; Öffentliche Funktionsansicht ($ view_name, $ params = array (), $ layout = 'default') // Behandelt den Titel der Site. Wenn NULL, füge nichts hinzu. Wenn nicht, fügen Sie ein // Trennzeichen hinzu und hängen den Titel an. if ($ this-> title_for_layout! == NULL) $ separates_title_for_layout = $ this-> title_separator. $ this-> title_for_layout; // Lade den Inhalt der Ansicht mit den übergebenen Parametern $ view_content = $ this-> CI-> load-> view ($ view_name, $ params, TRUE); // Laden Sie jetzt das Layout und übergeben Sie die gerade gerenderte Ansicht: $ this-> CI-> load-> view ('laytous /'. $ Layout, array ('content_for_layout' => $ view_content, 'title_for_layout' => $ separate_title_for_layout)); public function add_include ($ path, $ prepend_base_url = TRUE) if ($ prepend_base_url) $ this-> CI-> load-> helper ('url'); // Lade das nur um sicher zu gehen, dass $ this-> file_includes [] = base_url () ist. $ path; else $ this-> file_includes [] = $ path; $ this zurückgeben; // Dies erlaubt Kettenmethoden public function print_includes () // Eine Zeichenfolge initialisieren, die alle enthält. Include_includes = "; foreach ($ this-> umfasst als $ include) // Überprüfen Sie, ob es sich um eine JS oder eine CSS-Datei if (preg_match ('/ js $ /', $ include)) // Es handelt sich um eine JS-Datei $ final_includes. = ''; elseif (preg_match ('/ css $ /', $ include)) // Dies ist eine CSS-Datei $ final_includes. = ''; return $ final_includes;Schauen Sie sich den Screencast an, um eine vollständige Übersicht und Kommentare zu erhalten!