Yii - Layout

I layout rappresentano le parti comuni di più visualizzazioni, ad esempio l'intestazione e il piè di pagina della pagina. Per impostazione predefinita, i layout dovrebbero essere archiviati nel fileviews/layouts cartella.

Diamo un'occhiata al layout principale del modello di applicazione di base:

<?php
   /* @var $this \yii\web\View */ /* @var $content string */
   use yii\helpers\Html;
   use yii\bootstrap\Nav;
   use yii\bootstrap\NavBar;
   use yii\widgets\Breadcrumbs;
   use app\assets\AppAsset;
   AppAsset::register($this); ?> <?php $this->beginPage() ?>
<!DOCTYPE html>
<html lang = "<?= Yii::$app->language ?>"> <head> <meta charset = "<?= Yii::$app->charset ?>">
      <meta name = "viewport" content = "width = device-width, initial-scale = 1">
      <?= Html::csrfMetaTags() ?>
      <title><?= Html::encode($this->title) ?></title> <?php $this->head() ?>
   </head>
	
   <body>
      <?php $this->beginBody() ?> <div class = "wrap"> <?php NavBar::begin([ 'brandLabel' => 'My Company', 'brandUrl' => Yii::$app->homeUrl,
                  'options' => [
                     'class' => 'navbar-inverse navbar-fixed-top',
                  ],
               ]);
					
               echo Nav::widget([
                  'options' => ['class' => 'navbar-nav navbar-right'],
                  'items' => [
                     ['label' => 'Home', 'url' => ['/site/index']],
                     ['label' => 'About', 'url' => ['/site/about']],
                     ['label' => 'Contact', 'url' => ['/site/contact']],
                     Yii::$app->user->isGuest ? ['label' => 'Login', 'url' => ['/site/login']] : [ 'label' => 'Logout (' . Yii::$app->user->identity->username.')',
                           'url' => ['/site/logout'],
                           'linkOptions' => ['data-method' => 'post']
                        ],
                  ],
               ]);
					
               NavBar::end();
            ?>
            <div class = "container">
               <?= Breadcrumbs::widget([
                  'links' => isset($this->params['breadcrumbs']) ? $this>params
                     ['breadcrumbs'] : [],
               ]) ?>
               <?= $content ?> </div> </div> <footer class = "footer"> <div class = "container"> <p class = "pull-left">© My Company <?= date('Y') ?></p> <p class = "pull-right"><?= Yii::powered() ?></p> </div> </footer> <?php $this->endBody() ?>
   </body>
</html>
<?php $this->endPage() ?>

Questo layout genera la pagina HTML comune a tutte le pagine. Il$contentvariabile è il risultato di rendering delle visualizzazioni del contenuto. I seguenti metodi attivano eventi sul processo di rendering in modo che gli script e i tag registrati in altre posizioni possano essere inseriti correttamente:

  • head()- Dovrebbe essere chiamato all'interno della testa sezione. Genera un segnaposto, che verrà sostituito con l'HTML registrato mirato alla posizione della testina.

  • beginBody()- Dovrebbe essere chiamato all'inizio della sezione del corpo . Attiva ilEVENT_BEGIN_BODYevento. Genera un segnaposto che verrà sostituito con l'HTML registrato mirato alla posizione iniziale del corpo.

  • endBody()- Dovrebbe essere chiamato alla fine della sezione del corpo . Attiva ilEVENT_END_BODYevento. Genera un segnaposto, che verrà sostituito con l'HTML registrato mirato alla posizione finale del corpo.

  • beginPage()- Dovrebbe essere chiamato all'inizio del layout. Attiva ilEVENT_BEGIN_PAGE evento.

  • endPage()- Dovrebbe essere chiamato alla fine del layout. Attiva ilEVENT_END_PAGE evento.

Crea un layout

Step 1 - All'interno della directory views / layouts, crea un file chiamato newlayout.php con il seguente codice.

<?php
   /* @var $this \yii\web\View */ /* @var $content string */
   use yii\helpers\Html;
   use yii\bootstrap\Nav;
   use yii\bootstrap\NavBar;
   use yii\widgets\Breadcrumbs;
   use app\assets\AppAsset;
   AppAsset::register($this); ?> <?php $this->beginPage() ?>
<!DOCTYPE html>
<html lang = "<?= Yii::$app->language ?>"> <head> <meta charset = "<?= Yii::$app->charset ?>">
      <meta name = "viewport" content = "width = device-width, initial-scale = 1">
      <? = Html::csrfMetaTags() ?>
      <title><? = Html::encode($this->title) ?></title> <?php $this->head() ?>
   </head>

   <body>
      <?php $this->beginBody() ?> <div class = "wrap"> <div class = "container"> <? = $content ?>
            </div>
         </div>
			
         <footer class = "footer">
            <div class = "container">
               <p class = "pull-left">© My Company <?= date('Y') ?></p>
               <p class = "pull-right"><? = Yii::powered() ?></p>
            </div>
         </footer>
      <?php $this->endBody() ?> </body> </html> <?php $this->endPage() ?>

Abbiamo rimosso la barra dei menu in alto.

Step 2 - Per applicare questo layout al file SiteController, Aggiungi il $layout proprietà al SiteController classe.

<?php
   namespace app\controllers;
   use Yii;
   use yii\filters\AccessControl;
   use yii\web\Controller;
   use yii\filters\VerbFilter;
   use app\models\LoginForm;
   use app\models\ContactForm;
   class SiteController extends Controller {
      public $layout = “newlayout”;
      /* other methods */
   }
?>

Step 3 - Ora se vai al browser web in qualsiasi vista del SiteController, vedrai che il layout è cambiato.

Step 4 - Per registrare vari meta tag, puoi chiamare yii\web\View::registerMetaTag() in una visualizzazione del contenuto.

Step 5 - Modifica il file ‘About’ vista del SiteController.

<?php
   /* @var $this yii\web\View */ use yii\helpers\Html; $this->title = 'About';
   $this->params['breadcrumbs'][] = $this->title;
   $this->registerMetaTag(['name' => 'keywords', 'content' => 'yii, developing, views, meta, tags']); $this->registerMetaTag(['name' => 'description', 'content' => 'This is the description
      of this page!'], 'description');
?>
<div class="site-about">
   <h1><?= Html::encode($this->title) ?></h1>
   <p>
      This is the About page. You may modify the following file to customize its content:
   </p>
   <code><?= __FILE__ ?></code>
</div>

Abbiamo appena registrato due meta tag: keywords and description.

Step 6 - Adesso vai a http://localhost:8080/index.php?r=site/about, troverai i meta tag nella sezione head della pagina come mostrato nello screenshot seguente.

Le visualizzazioni attivano diversi eventi:

  • EVENT_BEGIN_BODY - attivato nei layout dalla chiamata di yii\web\View::beginBody().

  • EVENT_END_BODY - attivato nei layout dalla chiamata di yii\web\View::endBody().

  • EVENT_BEGIN_PAGE - attivato nei layout dalla chiamata di yii\web\View::beginPage().

  • EVENT_END_PAGE - attivato nei layout dalla chiamata di yii\web\View::endPage().

  • EVENT_BEFORE_RENDER - attivato in un controller all'inizio del rendering di un file.

  • EVENT_AFTER_RENDER - attivato dopo il rendering di un file.

Puoi rispondere a questi eventi per inserire contenuto nelle visualizzazioni.

Step 7 - Per visualizzare la data e l'ora correnti nel file actionAbout del SiteController, modificalo in questo modo.

public function actionAbout() {
   \Yii::$app->view->on(View::EVENT_BEGIN_BODY, function () {
      echo date('m.d.Y H:i:s');
   });
   return $this->render('about');
}

Step 8 - Tipo http://localhost:8080/index.php?r=site/about nella barra degli indirizzi del browser web e vedrai quanto segue.

Punti importanti

Per rendere le visualizzazioni più gestibili dovresti:

  • Dividi le viste complesse in diverse viste più piccole.
  • Usa layout per sezioni HTML comuni (intestazioni, piè di pagina, menu e così via).
  • Usa i widget.

Le visualizzazioni dovrebbero:

  • Contengono HTML e semplice codice PHP per formattare e visualizzare i dati.
  • NON elaborare le richieste.
  • NON modificare le proprietà del modello.
  • NON eseguire query sul database.