Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. PHP
Code

An Introduction to Views & Templating in CodeIgniter

by
Difficulty:BeginnerLength:LongLanguages:

Polish (Polski) translation by Władysław Łucyszyn (you can also view the original English article)

Widoki są kluczowym składnikiem każdej aplikacji MVC, a aplikacje CodeIgniter nie są niczym innym. Dzisiaj dowiemy się, czym jest widok, i odkryjemy, w jaki sposób można je wykorzystać do stworzenia rozwiązania do tworzenia szablonów dla projektów CodeIgniter.

Pierwsza część tego samouczka będzie kształciła początkujących dla CodeIgniter na temat tego, czym jest widok i jak z nich korzystać w ypowej aplikacji Druga połowa omówi motywy znalezienia rozwiązania szablonowego ipoprowadzi czytelnika przez kroki niezbędne do stworzenia prostej,ale skutecznej biblioteki szablonów. Zainteresowany? Zacznijmy!


Zacznijmy!

Widoki to specjalne pliki używane w CodeIgniter do przechowywania znaczników wyprowadzanych przez aplikację, zwykle składających się z HTML i prostych znaczników PHP.

"Widok to po prostu strona internetowa lub fragment strony, taki jak nagłówek, stopka, pasek boczny itp. W rzeczywistości widoki mogą być elastycznie osadzone w innych widokach (w innych widokach itp.), Jeśli jest to potrzebne rodzaj hierarchii."

Widoki są ładowane z poziomu metod kontrolera, z zawartością wewnątrz widoku wyświetlaną później w przeglądarce.


Jak załadować widok

Aby załadować (i wyświetlić) widok w CodeIgniter, używamy wbudowanej biblioteki Loader.

Ten pojedynczy wiersz kodu powie CodeIgniter, aby szukał hello_world.phpfolderze application/views i wyświetli zawartość pliku w przeglądarce.

Zauważ, że CodeIgniter pozwala ci wykluczyć sufiks .php, zapisując kilka naciśnięć klawiszy podczas wpisywania nazwy pliku, który chcesz wczytać

Drugi parametr, $data, jest opcjonalny i przyjmuje tablicę asocjacyjną lub obiekt. Ta tablica / obiekt służy do przekazywania danych do pliku widoku, więc można go używać lub odwoływać się w widoku.

Ostateczny opcjonalny parametr określa, czy zawartość widoku jest wyświetlana w oknie przeglądarki, czy zwracana jako ciąg. W dalszej części samouczka zobaczymy, jak można użyć tego parametru podczas tworzenia rozwiązania szablonowego. W dalszej części samouczka zobaczymy, jak można użyć tego parametru podczas tworzenia rozwiązania szablonowego.


Tworzenie i wyświetlanie widoku

Aby skonfigurować nasz pierwszy widok, utwórz nowy plik o nazwie hello_world.php w aplikacji/views i napisz następujący prosty kod HTML w:

Aby wyświetlić ten widok w przeglądarce, należy go załadować w ramach metody kontrolera, korzystając z wyżej wymienionej metody.

Stwórzmy więc nowy plik kontrolera o nazwie hello_world.php w aplikacji/kontrolerach i umieść w nim poniższy kod. Z tego kontrolera załadujemy nowo utworzony widok.

Wskazanie w przeglądarce adresu http://twoja-domena.pl/index.php/ spowoduje teraz wygenerowanie kodu HTML w aplikacji/views/hello_world.php w przeglądarce. Pomyślnie załadowałeś widok!

Ładowanie wielu widoków

Podział widoku na kilka plików sprawia, że ​​twoja strona jest łatwiejsza w utrzymaniu i redukuje prawdopodobny rozmiar duplikatu kodu.

Wyświetlanie pojedynczego widoku jest dobre i dobre, ale możesz podzielić dane wyjściowe na kilka różnych plików, takich jak widoki nagłówka, treści i stopki.

Ładowanie kilku widoków odbywa się poprzez wielokrotne wywoływanie metody $this->load->view(). CodeIgniter łączy następnie zawartość widoków razem przed wyświetleniem w przeglądarce.

Utwórz nowy plik o nazwie header.php w aplikacji/views i wytnij i wklej kilka pierwszych linii z naszego oryginalnego pliku hello_world.phpw.

Podobnie, utwórz kolejny plik o nazwie footer.php w aplikacji/views i przenieś ostatnie dwa wiersze hello_world.php do.

Pozostawia to plik widoku hello_world.php tylko  zawierający naszą zawartość strony.

Aby wyświetlić ten widok w przeglądarce, należy go załadować w ramach metody kontrolera, korzystając z wyżej wymienionej metody.

Ponownie otwórz aplikację/controllers/hello_world.php i dodaj nowe polecenia $this-> load->view() powyżej i poniżej bieżącego.

Ponieważ widoki nagłówka i stopki są teraz oddzielone od widoku hello_world, oznacza to, że mogą być używane w połączeniu z innymi widokami w witrynie. Oznacza to, że kod w plikach nagłówka i stopki nie musi być kopiowany do żadnych innych widoków w projekcie, które wymagają tego kodu.

Oczywiście jest to ogromna korzyść, ponieważ wszelkie zmiany w kodzie HTML lub treści w widokach, np. Dodanie nowego arkusza stylów do nagłówka, mogą być wykonane tylko dla jednego pliku, a nie dla każdego pliku!


Używanie danych z kontrolera w widoku

Teraz przyjrzymy się przekazywaniu danych z kontrolerów, aby można je było używać lub wyświetlać w widoku.

Aby to osiągnąć, przekazujemy tablicę asocjacyjną, $data jako drugi parametr w wywołaniu $this->load->view().

Wartości tej tablicy będą dostępne w załadowanym widoku jako zmienne, nazwane przez ich odpowiednie klucze.

Powyższy kod da zmiennej $ title wartość "Hello World!" w widoku hello_world.

Jak używać zmiennych w widokach

Po przekazaniu danych do plików widoku zmienne mogą być używane w zwykły sposób.

Zazwyczaj plik widoku będzie wykorzystywać przekazane dane do:

  • Wyświetl wartość zmiennej
  • Pętla poprzez tablice lub właściwości obiektu
  • Użyj instrukcji warunkowych, aby pokazać lub ukryć znaczniki

Przejdę przez szybkie przykłady, jak zrobić każdy.

Aby wyświetlić zawartość zmiennej, użyj prostej i znajomej instrukcji echo:

Zapętlenie przez tablicę lub obiekt jest typowym zadaniem w plikach widoków i można je uzyskać za pomocą pętli foreach:

Proste instrukcje warunkowe mogą być używane w plikach widoku do nieznacznego zmieniania danych wyjściowych, w zależności od przekazanych danych.

Ogólnie rzecz biorąc, chcesz ograniczyć wykorzystanie instrukcji warunkowych w widokach do minimum, ponieważ przeciążenie może prowadzić do skomplikowanych plików widoku zawierających "logikę biznesową". Dzielenie widoku na różne pliki i decydowanie, które mają być wyświetlane w kontrolerze, jest znacznie bardziej preferowane.

Powyższy przykład albo wyświetli komunikat "Welcome", albo żądanie zalogowania użytkownika, w zależności od wartości $logged_in (true/false).


Templowanie w CodeIgniter

Zauważyliśmy, że dzielenie widoków na oddzielne, mniejsze pliki może pomóc w organizacji i zmniejszeniu liczby plików w projektach CodeIgniter, ale teraz należy wykonywać wywołania wielu obciążeń w każdym wystąpieniu strony.

Załóżmy, że masz osobne widoki nagłówka i stopki, które służą do tworzenia szablonu. Każda instancja w projekcie, w której chcesz załadować i wyświetlić stronę przy użyciu tego szablonu, musi wywołać trzy obciążenia widoku. Nie tylko może to zaśmiecać kontrolerów, ale powoduje wiele powtarzających się kodów - dokładnie to, czego chcieliśmy się pozbyć, dzieląc pliki.

Jeśli chcesz teraz dodać dodatkowy znacznik do tego szablonu, na przykład menu paska bocznego. Mogłoby to przejść do widoku nagłówka, ale jest bardziej odpowiednie, aby być w osobnym widoku. Dodanie tego nowego widoku do istniejącego szablonu oznacza przechodzenie przez każdą instancję załadowanych widoków i dodawanie kolejnej. Może to szybko stać się niechlujstwem.

Potrzebujemy sposobu, aby móc osadzać pliki widoku, które wyświetlają pojedynczą zawartość strony, wewnątrz szablonu, bez powtarzania kodu, i taki, który pozwala na łatwe i skuteczne wprowadzanie modyfikacji w szablonie.

Poniższe kroki poprowadzą Cię przez stworzenie prostej biblioteki CodeIgniter, która spełni te potrzeby, a także:

  • Egzekwowanie przewidywalnej i obsługiwanej struktury katalogów dla Twoich widoków
  • Umożliwienie użycia wielu różnych szablonów
  • Zmniejszenie ładowania widoku strony do tylko jednej linii kodu

Po zapisaniu biblioteki i w pasku narzędziowym CodeIgniter, będziemy mogli wyświetlić stronę z szablonem, jak na przykład:

Dużo ładniejszy!

Nasze rozwiązanie do tworzenia szablonów będzie używać plików widoku, które zawierają pełny znacznik szablonu, z elementem zastępczym dla innego pliku widoku (z zawartością strony) do osadzenia w nim.

Obiekt zastępczy będzie po prostu zmienną o nazwie $body. Podczas ładowania widoku szablonu z naszą biblioteką, zawartość odpowiedniego pliku widoku treści zostanie przypisana do tego obiektu $body, osadzając widok w szablonie.


Krok 1: Konfigurowanie katalogu

Chcemy wymusić rozsądny i przewidywalny system katalogowy, w którym będą przechowywane nasze pliki widoku, dzięki czemu nasze widoki będą:

  • Łatwe do zlokalizowania
  • Łatwo określić, do którego obszaru aplikacji należą
  • Łatwe w utrzymaniu

Nasz system katalogowy pozwala również sprytnie określić, gdzie szukać plików widoku, zmniejszając ilość kodu potrzebnego do załadowania widoku szablonowego.

Utwórz nowy folder w katalogu application/views i nazwij go szablonami. Ten folder będzie zawierał różne widoki szablonów.


Krok 2: Tworzenie biblioteki

Biblioteki w CodeIgniter są tylko klasami PHP i są ładowane do kontrolerów podobnie jak widoki.

Biblioteki niestandardowe używane w projektach CodeIgniter są przechowywane w folderze application/libraries. Aby rozpocząć pisanie naszej biblioteki szablonów, utwórz nowy plik w tym folderze o nazwie Template.php i umieść następujący kod w:

Powyższy kod definiuje nową klasę lub bibliotekę o nazwie Template i metodę __construct() w obrębie.

Ta metoda przypisuje super obiekt CodeIgniter do zmiennej klasy $ci, umożliwiając użycie wszystkich zasobów CodeIgniter, zamieniając $this na $this->ci  w zwykłych wywołaniach metod.

Kiedy biblioteka jest ładowana w ramach CodeIgniter, metoda __construct() jest automatycznie wywoływana.

Pisanie metody obciążenia

Teraz powinniśmy napisać metodę, aby faktycznie załadować widok szablonu. Chcemy przekazać do tej funkcji maksymalnie trzy parametry:

  • Nazwa szablonu
  • Nazwa widoku treści (opcjonalnie)
  • Dane, które należy przekazać do widoków (opcjonalnie)

Wynikiem wywołania tej metody będzie widok szablonu wyświetlany w przeglądarce, z widokiem treści osadzonym wewnątrz, jeśli jest on dostarczony.

Pod metodą __construct() umieść następujący kod:

Powyższy kod rozpoczyna się od sprawdzenia, czy parametr $body_view został dostarczony do metody. Ta zmienna będzie zawierała nazwę widoku, który będzie używany jako treść w widoku szablonu.

Jeśli parametr zostanie podany, wykonywana jest seria sprawdzeń file_exists, aby spróbować zlokalizować plik widoku w naszym systemie katalogowym.

Kod najpierw próbuje zlokalizować plik widoku wewnątrz folderu o tej samej nazwie, co szablon w folderze application/views.

Jest to przydatne, jeśli sekcje projektu drastycznie różnią się od innych i używają innych szablonów. W takich okolicznościach sensowne jest grupowanie tych plików widoku razem.

Na przykład wiele witryn wyświetla inny szablon dla różnych sekcji, takich jak blogi. W naszym systemie pliki widoku blogu można umieścić w folderze application/views/blog, oddzielając je od głównych widoków witryny.

Jeśli plik widoku nie może znajdować się w tym folderze, to plik .php jest dołączany na końcu nazwy pliku, a kontrola jest wykonywana ponownie. . Jest to po prostu tak, że .php może być wykluczone, tak jak natywne $this->load->view()

Jeśli plik nadal nie może zostać znaleziony, wykonywane są dalsze kontrole jego lokalizacji.

Tym razem kod sprawdza, czy plik widoku znajduje się w folderze application/views, i jeszcze raz, jeśli nie można go znaleźć, dołącza .php i sprawdza jeszcze raz.

Jeśli plik znajduje się w jednym z tych miejsc, ścieżka jest przypisana do ścieżki $body_view_path, w przeciwnym razie zostanie zgłoszony komunikat o błędzie za pomocą funkcji s how_error() wbudowanej w CodeIgniter, a skrypt zostanie zakończony.

Jeśli plik widoku treści został pomyślnie zlokalizowany, jego zawartość zostanie przypisana do zmiennej $body.

Przekazujemy parametr $data (wartość null, jeśli nie jest podana) do wywołania widoku, i ustawiamy trzeci parametr na wartość true, aby zwracać wynik widoku jako ciąg znaków.

Teraz dodajemy tę zmienną $body do listy danych w $data, aby mogła ona zostać osadzona w widoku szablonu po wczytaniu.

Jeśli $data nie zostały dostarczone do wywołania load()$data są przypisywane do tablicy zawierającej $body pod kluczem body. Jeśli parametr został podany, obiekt $body zostanie dodany do listy przez przypisanie go do klucza tablicy lub właściwości obiektu, zarówno o nazwie body.

Zmienna $body może teraz być używana w plikach widoku szablonu jako symbol zastępczy dla osadzonych widoków.

Ostatnia linia naszej metody ładuje plik widoku szablonu z folderu application/views/templates i przekazuje zmienną $data w drugim parametrze.

I to wszystko!  Biblioteka może teraz zostać wykorzystana.


Korzystanie z biblioteki

Aby rozpocząć korzystanie z naszej biblioteki, utwórzmy widok szablonu o nazwie default.php w aplikacji/ views/templates i umieść w nim następujący HTML/PHP:

W tym szablonie odwołujemy się do dwóch zmiennych: $title i $body.

Przypomnijmy, że w naszych plikach szablonów obiekt $body służy jako symbol zastępczy dla osadzonego widoku.

Teraz utworzymy inny widok, który zostanie osadzony w tym szablonie. Utwórz nowy plik o nazwie content.php w aplikacji/views/ i umieść ten prosty kod HTML w środku:

Jesteśmy teraz gotowi do załadowania widoku strony z szablonu w kontrolerze.

Wewnątrz dowolnej metody kontrolera umieść następujący kod, aby content widok treści w default szablonie.

Uwaga: należy wczytać bibliotekę, zanim będzie można wywołać metodę ładowania. Aby zapisać siebie podczas ładowania biblioteki za każdym razem,gdy wyświetlany jest widok szablonu,
automatycznie ładuj klasę, dodając ją do tablicy bibliotek w aplikacji/config/autoload.php.

Jeśli zamiast pliku widoku chcesz, aby łańcuch został osadzony w szablonie, po prostu przypisz ciąg do tablicy danych $data pomocą body klucza, a jako drugi parametr w wywołaniu ładowania podaj wartość null.


Szybka wskazówka

Odkryłem, że grupowanie plików widoku w folderach przez kontroler, a nawet metoda, do której należą, naprawdę pomaga uporządkować i łatwo lokalizować moje widoki.

Porządkowanie widoków w ten sposób powoduje, że struktura katalogów jest ściśle zgodna ze schematem URL kontrolera/metody.

Na przykład powiedzmy, że twój projekt ma kontroler o nazwie Członkowie, zawierający listę metod.

Odpowiednią lokalizacją dla pliku widoku listy będzie aplikacja/widoki/członkowie lub aplikacja/widoki/członkowie/lista, jeśli ta metoda ładuje wiele widoków.

Ten widok może następnie zostać osadzony w szablonie przy użyciu naszej biblioteki z następującym kodem:


Wniosek

Rozwiązanie szablonowe omówione w tym samouczku to tylko jeden z wielu różnych sposobów na osiągnięcie szablonu w CodeIgniter.

Miejmy nadzieję, że teraz wiesz już, jakie są poglądy i jak skutecznie i efektywnie z nich korzystać w swoich projektach CodeIgniter.

Rozwiązanie szablonowe omówione w tym samouczku to tylko jeden z wielu różnych sposobów na osiągnięcie szablonu w CodeIgniter. Istnieje wiele różnych podejść i zachęcam Cię, czytelniku, do zbadania innych metod i ustalenia, który najlepiej pasuje do twoich projektów.

Jeśli masz jakieś uwagi lub pytania dotyczące samouczka lub jakiekolwiek uwagi na temat różnych rozwiązań szablonów, proszę zostaw komentarz poniżej! Dziękuje za przeczytanie. Dziękuje za przeczytanie.

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.