Hvordan lage en layout manager med CodeIgniter

Denne Premium video- og følgesvennartikkelen vil lære deg hvordan du lager et enkelt, men kraftig bibliotek for å håndtere oppsett i den populære CodeIgniter Framework. Biblioteket du lager vil tillate deg å maksimere effektiviteten din, spare tid og kode, moduler visningene dine og til og med Javascript og CSS-filene dine.


Trinn 1 Last ned nødvendige filer

For denne opplæringen er alt du trenger, CodeIgniter 1.7.2-rammen. Du kan laste den ned fra deres hjemmeside på codeigniter.com/downloads/


Trinn 2 Hvordan gjør vi dette

Den grunnleggende funksjonaliteten til dette biblioteket vil være veldig enkelt. Vi tar innholdet i en visning, gjør dem med de riktige dataene, ta det gjengitte innholdet og tilordne det til en variabel. Nå lager vi selve oppsettet, og erstatter en del av oppsettet med innholdet i denne variabelen. Enkel, men kraftig nok.

Tanken er å etterligne samtalene til $ Dette-> last> view (). Når vi kaller denne metoden, sender vi navnet (og plasseringen) av visningen vår, og deretter en rekke data som er tilgjengelige fra visningen. Her er et eksempel:

 funksjonsmetode ($ url_param) $ this-> load-> view ('controller_views / method_view', array ('url_param' => $ url_param)); 

Ovenstående kode vil ta filen Systemet / applikasjon / visninger / controller_views / method_view.php, send det til url_param-variabelen, og send det til nettleseren. Her kommer vi inn. Vi vil ikke sende innholdet til nettleseren enda. I stedet sender vi det til oppsettet, og deretter til nettleseren. Men hvordan gjør vi det?

De utsikt() Metode vi nettopp ringte kan bestås en tredje (boolsk) parameter, som, hvis sant, vil komme tilbake den gjengitte visningen i stedet for å sende den til nettleseren. Vi kan lagre det innholdet, foreta et nytt anrop til samme metode, men denne gangen ringes en layoutfil som vil skrive ut dette innholdet (omgitt av alle overskrifter, sidebjelker og bunntekster).


Full Screencast



Trinn 3 Opprett et nytt bibliotek

Vi oppretter dette biblioteket trinnvis, med utgangspunkt i de mest grunnleggende. Først av, vil vi opprette et nytt bibliotek i vår system / program / bibliotek mappe og ring den oppsett.

Hvis du aldri har opprettet et CodeIgniter-bibliotek, er de bare klasser, som blir lastet av en samtale til $ Dette-> last> bibliotek ().

Så, la oss hoppe rett inn i koden:

  

La oss gå gjennom hver del av koden:

  1. Den aller første linjen er en kodingskonvensjon av CodeIgniter, det sikrer i det vesentlige at brukerne ikke direkte kan få tilgang til filen fra nettleserne, fordi CodeIgniter setter BASEPATH konstant i sin index.php fil.
  2. Klassen vil bare være PHP 5. Dette vil tillate oss å legge til metodekjede til klassen, noe som vil være nyttig senere når vi jobber med JS og CSS inkluderer.
  3. Klassekonstruktøren har ingenting for tiden. Dette er bare skjelettet til biblioteket vårt.

Så hva skjer hvis vi inkluderer dette fra a kontrolleren? Vel, ingenting. Klassen gjør absolutt ingenting for nå (ikke engang konstruktøren), så ingenting vil skje.


Trinn 4 Lag en layout

Vi lager et veldig enkelt oppsett for å forklare hvordan alt fungerer.

    Vår aller første layout!     

Som du kan se, er dette ekstremt grunnleggende; det er bare en tittel og en kropp. Nå er den viktige delen i PHP-koden der. Vi ekko en $ content_for_layout variabel. Tanken er å tilordne det gjengitte innholdet til denne variabelen. På denne måten blir det trykt der, omgitt av resten av kroppen, hodet osv.


Trinn 5 Skriv noen kode!

La oss skrive noen kode for å håndtere denne utformingen:

 CI = & get_instance ();  offentlig funksjonsvisning ($ view_name, $ params = array (), $ layout = 'default') // Last visningsinnholdet, med parametrene passert $ view_content = $ this-> CI-> load-> view view_name, $ params, TRUE); // Nå laster du oppsettet og sender visningen vi nettopp gjengitt $ this-> CI-> load-> view ('laytous /'. $ Layout, array ('content_for_layout' => $ view_content)); 

La oss forklare hvordan den nye koden ser ut:

  1. Vi har lagt til et nytt privat attributt i vårt bibliotek: $ CI. Fra våre biblioteker kan vi ikke få tilgang til CodeIgniter-forekomsten direkte. Den eneste måten er å få en referanse til den og få tilgang til den derfra. Så, i vår konstruktør (som blir kalt når biblioteket er lastet), får vi vår CI-forekomst, og tildeler den til vår lokale private $ CI attributt, så vi kan ringe det senere. Vi trenger det for å ringe last> visning () metode.
  2. Nå har vi lagt til en visningsmetode. Syntaxen er praktisk talt identisk med last> visning () metode. Vi får et visningsnavn, en rekke parametere (variablene som vil bli synlige fra visningen), og et layoutnavn, som som standard vil være (duh) 'standard'. Sistnevnte gjør at vi kan ha flere oppsett i vår søknad (kanskje en for påloggingsboksen uten menyer og ting).
  3. Nå, som vi snakket tidligere, kaller vi last> visning () metode, vi sender visningsnavnet, parametrene og en tredje parameter med verdien av EKTE. Dette sikrer at vi ikke vil sende utdata til nettleseren. I stedet vil det bli returnert til oss, og tildelt til variabelen $ view_content.
  4. Endelig laster vi opp layoutfilen (som vi vil lagre i system / applikasjon / visninger / oppsett mappe), og send innholdet til den nettopp lastede visningen som en parameter. Når oppsettet blir lastet, vil $ content_for_layout variabel vil bli erstattet med innholdet som er lastet inn, og vil bli sendt til nettleseren. (Merk den manglende endelige parameteren, vi overgår ikke EKTE denne gangen).

Trinn 6 Endre tittelens tittel

Det grunnleggende biblioteket er teknisk ferdig. Men det er et par ting vi kan legge til for å gjøre det enda bedre.

Som det er, er tittelen på oppsettet alltid det samme. Dette er ikke praktisk. Vi må kunne endre det enkelt fra våre kontrollører, uten å måtte lage en uendelig mengde oppsett med forskjellige titler (dette ville beseire formålet med denne opplæringen). Så, hvordan gjør vi dette? Vi antar at nettstedet har en permanent tittel, sier "Layouts Library". Etter det vil vi sette delen av nettstedet vi besøker. For eksempel, for innloggingssiden, ville tittelen lese "Layouts Library | Login".

Først, la oss omskrive layoutet litt.

    Layouts Library<?php echo $title_for_layout ?>     

Vi har nettopp lagt til en annen PHP ekko. Denne gangen skriver vi ut $ title_for_layout variabel, som vi skal finjustere i biblioteket vårt. Her er det omskrevne biblioteket:

 CI = & get_instance ();  offentlig funksjon set_title ($ title) $ this-> title_for_layout = $ title;  offentlig funksjonsvisning ($ view_name, $ params = array (), $ layout = 'default') // Håndter nettstedets tittel. Hvis NULL, ikke legg til noe. Hvis ikke, legg til en // separator og legg til tittelen. hvis ($ this-> title_for_layout! == NULL) $ separated_title_for_layout = $ this-> title_separator. $ Dette-> title_for_layout;  // Last inn visningsinnholdet, med parametrene passert $ view_content = $ this-> CI-> load-> vis ($ view_name, $ params, TRUE); // Last inn oppsettet, og pass visningen vi nettopp gjengitt $ this-> CI-> load-> view ('laytous /'. $ Layout, array ('content_for_layout' => $ view_content, 'title_for_layout' => $ separate_title_for_layout)); 

Hva gjorde vi her?

  1. Vi har lagt til to nye attributter til vårt bibliotek: $ title_for_layout og $ title_separator. Den første vil holde tittelen vår, og den andre vil definere strengen som vil skille tittelen på oppsettet fra tittelen satt av SET_TITLE () metode.
  2. Siden $ title_for_layout ble satt til privat, legger vi til en metode for å sette den fra våre kontrollører. Og dermed, SET_TITLE () vil sette verdien av $ title_for_layout til hva vi fortelle det til, f.eks. 'Logg Inn'.
  3. I utsikt() metode, vi la til en del kode for å håndtere det nye attributtet. Hvis brukeren aldri setter en tittel på siden, vil vi kunne "nedbryte grasiøst", dvs. Ikke legg separatoren til ingenting. Dermed kontrollerer vi først verdien av $ title_for_layout Egenskap. Hvis ikke NULL, så legger vi til den konfigurerte separatoren og tittelen satt av SET_TITLE () metode.
  4. Når du gjør oppsettet, sørger vi for at vi sender det nye attributtet (selv om NULL), slik at vi kan ekko det i tittelen.

Trinn 7 Legge til modulær CSS og JS

Nå, for sist, ønsker vi å kunne legge til CSS og Javascript-filer modulært. Hva betyr dette? Si at du vil bruke et jQuery-plugin, men du vil bare bruke det på en enkelt del av nettstedet (kanskje et skjema validering plugin). Du kan bare inkludere det på utsikten selv, men det ser ikke bra ut på den endelige koden. Det er alltid å foretrekke at alle Javascript (og CSS) er inkludert i Overskrift. Vi skal lage en metode (vel, to faktisk) som vil tillate oss å gjøre nettopp dette.

Gå videre og legg til disse to metodene i biblioteket ditt:

 offentlig funksjon add_include ($ path, $ prepend_base_url = TRUE) hvis ($ prepend_base_url) $ this-> CI-> load-> hjelper ('url'); // Last dette bare for å være sikker på $ this-> file_includes [] = base_url (). $ Banen;  ellers $ this-> file_includes [] = $ path;  returner $ dette; // Dette tillater kjedemetoder offentlig funksjon print_includes () // Initialiser en streng som vil holde alt inkludert $ final_includes = "; foreach ($ this-> inkluderer som $ include) // Sjekk om det er en JS eller en CSS-fil hvis (preg_match ('/ js $ /', $ include)) // Det er en JS-fil $ final_includes. = '';  elseif (preg_match ('/ css $ /', $ include)) // Det er en CSS-fil $ final_includes. = '';  returnere $ final_includes; 

Pass på at du også legger til dette nye attributtet til klassen din, like over konstruktør:

 privat $ inkluderer = array ();

og dette til oppsettet ditt, like etter tittelen

 layouts-> print_includes ()?>

En liten forklaring:

  1. De add_include () Metoden tillater oss å legge til flere JS- eller CSS-filer fra vår kontrolleren. Det tillater også metodekjetting, noe som betyr at vi kan gjøre noe sånt $ Dette-> layouts-> add_include ( 'JS / jquery.js') -> (add_include 'JS / jquery.plugin.js') -> add_include ( 'css / jquery.plugin.css'); som kan være veldig behagelig når du laster flere ting. Denne metoden kjetting funksjonen er grunnen til at vi trenger PHP 5, fordi PHP 4 ikke støtter det.
  2. De $ prepend_base_url parameter på add_include () Metode, vil som standard legge ut basisadressen til CodeIgniter-installasjonen. Ved å ringe denne metoden med $ prepend_base_url satt til FALSK, vi kan inkludere eksterne filer (for eksempel jQuery lib fra Googles CDN).
  3. De print_includes () Metoden er selvforklarende. Den itererer gjennom alle de som er lagt til med add_include () metode, kontrollerer om filen er en Javascript- eller en CSS-fil (ingen andre filer støttes), og legger til inkluderingen til en streng som til slutt vil bli ekko i layoutet.

Konklusjon

Vi har laget et komplett og veldig praktisk layoutsjefbibliotek for CodeIgniter fra bunnen av! Dette vil tillate deg å spare tid, unngå unødvendige samtaler for å inkludere overskrifter, innhold og bunntekst hele tiden, og moduler Javascript og CSS-filene dine.

Dette er den endelige koden for oppsettet og biblioteket:

    Layouts Library<?php echo $title_for_layout ?> layouts-> print_includes (); ?>     
 CI = & get_instance ();  offentlig funksjon set_title ($ title) $ this-> title_for_layout = $ title;  offentlig funksjonsvisning ($ view_name, $ params = array (), $ layout = 'default') // Håndter nettstedets tittel. Hvis NULL, ikke legg til noe. Hvis ikke, legg til en // separator og legg til tittelen. hvis ($ this-> title_for_layout! == NULL) $ separated_title_for_layout = $ this-> title_separator. $ Dette-> title_for_layout;  // Last inn visningsinnholdet, med parametrene passert $ view_content = $ this-> CI-> load-> vis ($ view_name, $ params, TRUE); // Last inn oppsettet, og pass visningen vi nettopp gjengitt $ this-> CI-> load-> view ('laytous /'. $ Layout, array ('content_for_layout' => $ view_content, 'title_for_layout' => $ separate_title_for_layout));  offentlig funksjon add_include ($ path, $ prepend_base_url = TRUE) if ($ prepend_base_url) $ this-> CI-> load-> hjelper ('url'); // Last dette bare for å være sikker på $ this-> file_includes [] = base_url (). $ Banen;  ellers $ this-> file_includes [] = $ path;  returner $ dette; // Dette tillater kjedemetoder offentlig funksjon print_includes () // Initialiser en streng som vil holde alt inkludert $ final_includes = "; foreach ($ this-> inkluderer som $ include) // Sjekk om det er en JS eller en CSS-fil hvis (preg_match ('/ js $ /', $ include)) // Det er en JS-fil $ final_includes. = '';  elseif (preg_match ('/ css $ /', $ include)) // Det er en CSS-fil $ final_includes. = '';  returnere $ final_includes; 

Pass på å se skjermbildet for hele oversikten og kommentaren!