Symfony - Motoru Görüntüle

Görünüm Katmanı, MVC uygulamasının sunum katmanıdır. Uygulama mantığını sunum mantığından ayırır.

Bir denetleyicinin HTML, CSS veya başka herhangi bir içerik oluşturması gerektiğinde, görevi şablon oluşturma motoruna iletir.

Şablonlar

Şablonlar temelde HTML, XML, vb. Gibi metin tabanlı belgeler oluşturmak için kullanılan metin dosyalarıdır. Zamandan tasarruf etmek ve hataları azaltmak için kullanılır.

Varsayılan olarak, şablonlar iki farklı konumda bulunabilir -

app/Resources/views/- Uygulamanın görünümler dizini, uygulamanızın düzenlerini ve uygulama paketinin şablonlarını içerebilir. Ayrıca üçüncü taraf paket şablonlarını da geçersiz kılar.

vendor/path/to/Bundle/Resources/views/ - Her üçüncü taraf paket, şablonlarını "Resources / views /" dizininde içerir.

Twig Motoru

Symfony, adında güçlü bir şablon dili kullanır Twig. Twig, çok kolay bir şekilde kısa ve okunabilir şablonlar yazmanıza olanak tanır. Twig şablonları basittir ve PHP etiketlerini işlemez. Twig; boşluk kontrolü, korumalı alan oluşturma ve otomatik HTML kaçışını gerçekleştirir.

Sözdizimi

Twig, üç tür özel sözdizimi içerir -

  • {{ ... }} - Şablona bir değişken veya bir ifadenin sonucunu yazdırır.

  • {% ... %} - Şablonun mantığını kontrol eden bir etiket. Esas olarak bir işlevi yürütmek için kullanılır.

  • {# ... #}- Yorum sözdizimi. Tek veya çok satırlı yorumlar eklemek için kullanılır.

Dal temel şablonu şu konumda bulunur: “app/Resources/views/base.html.twig”.

Misal

Twig motoru kullanarak basit bir örnek verelim.

StudentController.php

<?php  
namespace AppBundle\Controller;  

use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route; 
use Symfony\Component\HttpFoundation\Response; 
use Symfony\Bundle\FrameworkBundle\Controller\Controller;  

class StudentController extends Controller { 
   /** 
      * @Route("/student/home") 
   */ 
   public function homeAction() { 
      return $this->render('student/home.html.twig'); 
   } 
}

Burada render() yöntem bir şablon oluşturur ve bu içeriği bir Response nesnesine koyar.

Şimdi "views" dizinine gidin ve bir "öğrenci" klasörü oluşturun ve bu klasörün içinde bir "home.html.twig" dosyası oluşturun. Dosyaya aşağıdaki değişiklikleri ekleyin.

home.html.twig

//app/Resources/views/student/home.html.twig  
<h3>Student application!</h3>

Sonucu, “http: // localhost: 8000 / öğrenci / ev” url'sini talep ederek elde edebilirsiniz.

Twig, varsayılan olarak uzun bir etiket, filtre ve işlev listesi ile birlikte gelir. Ayrıntılı olarak tek tek geçelim.

Etiketler

Twig, aşağıdaki önemli etiketleri destekler -

Yapmak

doetiketi, hiçbir şey yazdırmaması dışında normal ifade ile benzer işlevleri yerine getirir. Sözdizimi aşağıdaki gibidir -

{% do 5 + 6 %}

Dahil etmek

İnclude ifadesi bir şablon içerir ve bu dosyanın oluşturulmuş içeriğini geçerli ad alanına döndürür. Sözdizimi aşağıdaki gibidir -

{% include 'template.html' %}

Uzatmalar

Extends etiketi, bir şablonu diğerinden genişletmek için kullanılabilir. Sözdizimi aşağıdaki gibidir -

{% extends "template.html" %}

Blok

Blok, bir yer tutucu görevi görür ve içeriği değiştirir. Blok adları, alfasayısal karakterler ve alt çizgilerden oluşur. Örneğin,

<title>{% block title %}{% endblock %}</title>

Göm

embedetiketi, hem include hem de extends'in bir kombinasyonunu gerçekleştirir. Başka bir şablonun içeriğini eklemenize izin verir. Ayrıca, bir şablonu genişletirken olduğu gibi, dahil edilen şablon içinde tanımlanan herhangi bir bloğu geçersiz kılmanıza da olanak tanır. Sözdizimi aşağıdaki gibidir -

{% embed “new_template.twig” %} 
   {# These blocks are defined in “new_template.twig" #} 
   {% block center %} 
      Block content 
   {% endblock %} 
{% endembed %}

Filtrele

Filtre bölümleri, bir şablon verisi bloğuna normal Twig filtreleri uygulamanıza izin verir. Örneğin,

{% filter upper %} 
   symfony framework 
{% endfilter %}

Burada metin büyük harfe değiştirilecektir.

İçin

Fordöngü, her öğeyi bir sırayla getirir. Örneğin,

{% for x in 0..10 %} 
   {{ x }} 
{% endfor %}

Eğer

ifTwig'deki ifade PHP'ye benzer. İfade doğru veya yanlış olarak değerlendirilir. Örneğin,

{% if value == true %} 
   <p>Simple If statement</p> 
{% endif %}

Filtreler

Twig, filtreler içerir. Oluşturulmadan önce içeriği değiştirmek için kullanılır. Aşağıda dikkate değer filtrelerden bazıları verilmiştir.

Uzunluk

Uzunluk filtresi, bir dizenin uzunluğunu döndürür. Sözdizimi aşağıdaki gibidir -

{% if name|length > 5 %} 
   ... 
{% endif %}

Daha düşük

Alttaki filtre, bir değeri küçük harfe dönüştürür. Örneğin,

{{ 'SYMFONY'|lower }}

Aşağıdaki sonucu üretecektir -

symfony

Benzer şekilde, büyük harf için deneyebilirsiniz.

Değiştir

Değiştirme filtresi, yer tutucuları değiştirerek belirli bir dizeyi biçimlendirir. Örneğin,

{{ "tutorials point site %si% and %te%."|replace({'%si%': web, '%te%': "site"}) }}

Aşağıdaki sonucu üretecektir -

tutorials point website

Başlık

Başlık filtresi, değerin başlık esaslı sürümünü döndürür. Örneğin,

{{ 'symfony framework '|title }}

Aşağıdaki sonucu üretecektir -

Symfony Framework

Çeşit

Sıralama filtresi bir diziyi sıralar. Sözdizimi aşağıdaki gibidir -

{% for user in names|sort %} 
   ... 
{% endfor %}

Kırpma

Kırpma filtresi, bir dizenin başındaki ve sonundaki boşlukları (veya diğer karakterleri) kırpar. Örneğin,

{{ '  Symfony!  '|trim }}

Aşağıdaki sonucu üretecektir -

Symfony!

Fonksiyonlar

Twig, işlevleri destekler. Belirli bir sonuç elde etmek için kullanılır. Aşağıda Twig işlevlerinden bazıları verilmiştir.

Öznitelik

attributeişlevi, bir değişkenin "dinamik" özelliğine erişmek için kullanılabilir. Sözdizimi aşağıdaki gibidir -

{{ attribute(object, method) }} 
{{ attribute(object, method, arguments) }} 
{{ attribute(array, item) }}

Örneğin,

{{ attribute(object, method) is defined ? 'Method exists' : 'Method does not exist' }}

Sabit

Sabit işlevi, belirtilen bir dizge için sabit değeri döndürür. Örneğin,

{{ constant('Namespace\\Classname::CONSTANT_NAME') }}

Döngü

Döngü işlevi bir dizi değer üzerinde döngü yapar. Örneğin,

{% set months = [‘Jan’, ‘Feb’, ‘Mar’] %}  
{% for x in 0..12 %} 
   { cycle(months, x) }} 
{% endfor %}

Tarih

Tarih karşılaştırmasına izin vermek için bir bağımsız değişkeni tarihe dönüştürür. Örneğin,

<p>Choose your location before {{ 'next Monday'|date('M j, Y') }}</p>

Aşağıdaki sonucu üretecektir -

Choose your location before May 15, 2017

Bağımsız değişken, PHP'nin desteklenen tarih ve saat biçimlerinden birinde olmalıdır.

İkinci argüman olarak bir saat dilimi geçirebilirsiniz.

Dökümü

Döküm işlevi, bir şablon değişkeni hakkındaki bilgileri döker. Örneğin,

{{ dump(user) }}

Max

Max işlevi, bir dizinin en büyük değerini döndürür. Örneğin,

{{ max(1, 5, 9, 11, 15) }}

Min

Min işlevi, bir dizinin en küçük değerini döndürür. Örneğin,

{{ min(1, 3, 2) }}

Dahil etmek

İnclude işlevi, bir şablonun oluşturulmuş içeriğini döndürür. Örneğin,

{{ include('template.html') }}

Rastgele

Rastgele işlevi, rastgele bir değer üretir. Örneğin,

{{ random([‘Jan’, ‘Feb’, ‘Mar’, ‘Apr’]) }} 
{# example output: Jan #}

Aralık

Aralık işlevi, tam sayıların aritmetik ilerlemesini içeren bir liste döndürür. Örneğin,

{% for x in range(1, 5) %} 
   {{ x }}, 
{% endfor %}

Aşağıdaki sonucu üretecektir -

1,2,3,4,5

Düzenler

Bir Düzen, birden çok görünümün ortak kısımlarını temsil eder, örneğin, sayfa üstbilgisi ve altbilgi.

Şablon Devralma

Bir şablon başka biri tarafından kullanılabilir. Bunu şablon kalıtım konseptini kullanarak başarabiliriz. Şablon kalıtımı, web sitesinin bloklar olarak tanımlanan tüm ortak öğelerini içeren temel bir "düzen" şablonu oluşturmanıza olanak tanır.

Şablon kalıtımı hakkında daha fazla bilgi edinmek için basit bir örnek alalım.

Misal

"App / Resources / views / base.html.twig" adresinde bulunan temel şablonu düşünün. Dosyaya aşağıdaki değişiklikleri ekleyin.

base.html.twig

<!DOCTYPE html> 
<html> 
   <head> 
      <meta charset = "UTF-8"> 
      <title>{% block title %}Parent template Layout{% endblock %}</title> 
   </head> 
</html>

Şimdi "app / Resources / views / default / index.html.twig" adresinde bulunan dizin şablon dosyasına gidin . Aşağıdaki değişiklikleri buna ekleyin.

index.html.twig

{% extends 'base.html.twig' %}  
{% block title %}Child template Layout{% endblock %}

Burada {% extends %}etiketi şablon oluşturma motoruna ilk önce düzeni ayarlayan ve bloğu tanımlayan temel şablonu değerlendirmesi için bilgi verir. Alt şablon daha sonra oluşturulur. Bir alt şablon, temel düzeni genişletebilir ve başlık bloğunu geçersiz kılabilir. Şimdi "http: // localhost: 8000" url'sini isteyin ve sonucunu elde edebilirsiniz.

Varlıklar

Varlık, CSS stil sayfaları, JavaScript dosyaları ve görüntü dosyaları gibi web varlıklarının URL oluşturma ve sürümlerini yönetir.

JavaScript

JavaScript dosyalarını dahil etmek için şunu kullanın: javascripts herhangi bir şablonda etiketleyin.

{# Include javascript #} 
{% block javascripts %} 
   {% javascripts '@AppBundle/Resources/public/js/*' %} 
      <script src="{{ asset_url }}"></script> 
   {% endjavascripts %} 
{% endblock %}

Stil sayfaları

Stil sayfası dosyalarını dahil etmek için, stylesheets herhangi bir şablonda etiketleyin

{# include style sheet #} 
{% block stylesheets %} 
   {% stylesheets 'bundles/app/css/*' filter = 'cssrewrite' %} 
      <link rel = "stylesheet" href="{{ asset_url }}" />
   {% endstylesheets %} 
{% endblock %}

Görüntüler

Bir resim eklemek için resim etiketini kullanabilirsiniz. Aşağıdaki gibi tanımlanır.

{% image '@AppBundle/Resources/public/images/example.jpg' %} 
   <img src = "{{ asset_url }}" alt = "Example" /> 
{% endimage %}

Bileşik Varlıklar

Birçok dosyayı tek bir dosyada birleştirebilirsiniz. Bu, HTTP isteklerinin sayısını azaltmaya yardımcı olur ve daha yüksek ön uç performansı sağlar.

{% javascripts 
   '@AppBundle/Resources/public/js/*' 
   '@AcmeBarBundle/Resources/public/js/form.js' 
   '@AcmeBarBundle/Resources/public/js/calendar.js' %} 
   <script src = "{{ asset_url }}"></script> 
{% endjavascripts %}