Come programmare con Yii2 esplorazione di MVC, moduli e layout

Cosa starai creando

In Programming with Yii2: Getting Started, abbiamo configurato Yii2 localmente, creato un'applicazione Hello World, configurato un server remoto e utilizzato Github per implementare il nostro codice. Questo tutorial coprirà alcuni dei concetti base di Yii relativi alla sua implementazione del framework MVC: Models, Views and Controllers. Esploreremo anche i layout e la personalizzazione dei menu di navigazione e degli elementi Bootstrap.

Per questi esempi, immaginiamo di costruire un framework per la pubblicazione di semplici aggiornamenti di stato, ad es. il nostro mini-Twitter. Tuttavia, non andremo così lontano da archiviare i dati in un database. Lo salverò per il prossimo tutorial, che esplorerà le capacità di impalcatura di Yii, chiamato Gii.

Gii automatizza e semplifica tutto ciò che faremo in questo tutorial, ma è importante analizzare i concetti di base ed eseguire queste attività manualmente almeno una volta.

Modelli

Cos'è un modello? Wikipedia dice "A modello notifica le viste e i controllori associati quando si è verificato un cambiamento nel suo stato. Questa notifica consente alle viste di produrre output aggiornati e ai controller di modificare il set di comandi disponibile. "

Per me, i modelli spesso rappresentano i concetti di ciò che sto costruendo nel mondo "esterno". Quindi, se pensiamo agli aggiornamenti di stato, il modello Status conterrà tutte le proprietà di un aggiornamento di stato e tutte le funzioni o i metodi relativi alla query o alla modifica di uno stato o di uno stato. 

La migliore pratica è quella di creare la massima funzionalità e intelligenza nei modelli che puoi. Nella pratica MVC, si costruiscono modelli "pesanti" e controllori e punti luce. Yii fornisce alcune funzioni eccellenti specifiche per il tipo di cose che fai nello sviluppo di applicazioni e web che semplificano la costruzione di modelli, specialmente quando si tratta di moduli e database; la maggior parte di questo esploreremo in tutorial successivi.

Creiamo il nostro modello di stato. Per i nostri esempi di codice, è possibile utilizzare il repository Git. Sto costruendo su ciò che abbiamo creato nel tutorial Getting Started: l'ho taggato qui per riferimento. Il repository Github per il tutorial finito è qui.

Creeremo Status.php in /hello/models/Status.php. Per pubblicare un messaggio di stato, dobbiamo raccogliere il testo del messaggio dall'utente. Creeremo anche un campo di autorizzazioni per la pubblicazione pubblica o privata.

'Privata', self :: PERMISSIONS_PUBLIC => 'Pubblico');  public function getPermissionsLabel ($ permissions) if ($ permissions == self :: PERMISSIONS_PUBLIC) return 'Public';  else return 'Private'; ?>

Osserva la funzione delle regole: viene utilizzata dalla convalida del modulo di Yii per garantire che gli utenti inseriscano le informazioni appropriate in ciascun campo. Yii utilizza JavaScript per convalidare i moduli mentre l'utente digita.

Il GetPermissions () la funzione che ho creato verrà utilizzata per gli elementi dell'elenco a discesa del modulo.

Passiamo ora alla creazione di un controller per consentire all'utente di creare e visualizzare gli aggiornamenti di testo.

Controller

Cos'è un controller? Wikipedia dice "A controllore può inviare comandi al modello per aggiornare lo stato del modello (ad esempio, modificare un documento). Può anche inviare comandi alla vista associata per modificare la presentazione della vista del modello. "In una tipica applicazione Web Yii, un percorso URL a una pagina richiama un controller per caricare i dati per la pagina utilizzando il modello e il rendering della pagina utilizzando la vista. 

È meglio raggruppare logicamente le funzioni correlate all'interno di un singolo controller. Diversi metodi del controller, chiamati azioni, implementano ciascuna funzione. Questi spesso corrispondono a pagine specifiche. Ad esempio, http: // localhost: 8888 / hello / web / status / create invocherà l'azione di creazione di StatusController che stiamo per costruire.

Man mano che sviluppi le funzionalità relative allo stato, raggrupperai queste funzioni in un unico StatusController.php. Per ora, creeremo solo una funzione di creazione.

Nel / Ciao / controller /, crea StatusController.php:

carica (Yii :: $ app-> request-> post ()) && $ model-> validate ()) // dati validi ricevuti in $ modello return $ this-> render ('view', ['model' = > $ modello]);  else // o la pagina è inizialmente visualizzata o c'è qualche errore di validazione return $ this-> render ('create', ['model' => $ model]); ?>

Le azioni per la creazione di un modulo in genere invocano i dati del modello e quindi cambiano a seconda che facciano parte o meno di un'operazione POST. In caso contrario, viene visualizzato il modulo vuoto. Se ricevono dati pubblicati, vengono convalidati ed elaborati. Nel nostro caso, questo significa procedere per rendere il file di visualizzazione.

Visualizzazioni

Cos'è una vista? Wikipedia dice "A vista richiede informazioni dal modello che utilizza per generare una rappresentazione di output per l'utente. "In Yii, la vista utilizza un linguaggio modello simile a PHP per rendere l'output della pagina in HTML, sfruttando i dati caricati dal modello e consegnati dal controller.

Le viste si trovano in genere all'interno di una singola cartella correlata al controller associato, ad es. le viste StatusController si trovano nel views / Stato cartella.

In Yii, il codice del modulo è solitamente incluso in quella che viene chiamata vista parziale. Questi file sono spesso denominati con un prefisso di sottolineatura. Devono essere inclusi da altri punti di vista. Ciò consente di riutilizzare il codice del modulo effettivo dalle pagine di creazione e aggiornamento.

Innanzitutto, creeremo la vista Crea che esegue il rendering del modulo. Quindi, creeremo anche una vista per mostrarci l'aggiornamento di stato che pubblichiamo. Nelle prossime esercitazioni, quando lavoriamo con un vero database, memorizzando e recuperando i dati, questo funzionerà in modo leggermente diverso.

Ecco un semplice esempio del nostro /hello/views/status.view.php visualizza il file per rendere i dati pubblicati:

 

Il tuo aggiornamento di stato

:

testo)?>

:

getPermissionsLabel ($ modello-> permessi); ?>

Nota come un file di visualizzazione è un mix di HTML e PHP. Quando il controllore riceve i dati inviati, visualizza la vista sopra, mostrando quali dati l'utente ha inviato.

Ma ora parliamo di moduli e compiliamo il file di visualizzazione del modulo di creazione.

Le forme

I moduli sono ciò che utilizziamo ogni giorno nello sviluppo web per raccogliere dati dall'utente, spesso per inviare l'input dell'utente a un database. Yii fornisce una grande quantità di codice di supporto per semplificare il processo di creazione, convalida, protezione e pubblicazione dei dati dai moduli. In Yii, le forme sono un tipo di vista.

Ecco un modulo di esempio per la creazione di un aggiornamento di stato:

  field ($ model, 'text') -> textArea (['rows' => '4']) -> label ('Status Update'); ?> field ($ model, 'permissions') -> dropDownList ($ model-> getPermissions (), ['prompt' => '- Scegli i permessi -'])?> 
'btn btn-primary'])?>

Il widget Yii2 ActiveForm viene utilizzato per generare HTML per i nostri campi di input. Si noti come l'elenco a discesa richiama il modello Status GetPermissions metodo.

Facendo clic sul pulsante Invia si ritorna all'azione di creazione di StatusController. Quando i dati inviati vengono ricevuti, restituisce il file view.php al posto del file del modulo create.php.

Ecco come appare il file di visualizzazione quando viene eseguito il rendering con view.php:

Successivamente, aggiorniamo la barra di navigazione globale per includere collegamenti al modulo di creazione dello stato.

layout

I layout sono i modelli per la maggior parte degli elementi esterni e ripetuti di un sito Web come il wrapper del documento HTML, l'intestazione, la barra di navigazione e il piè di pagina. Poiché questi sono comuni alla maggior parte delle pagine di un sito Web, vengono creati una volta nel layout e non vengono ripetuti ovunque nel codice.

Se guardi \ Hello \ Visto \ layout \ main.php, puoi vedere la struttura del layout esterno:

 beginPage ()?>       <?= Html::encode($this->titolo)?> testa ()?>   beginBody ()?> 
'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']]: ['etichetta' => 'Esci ('. Yii :: $ app-> utente-> identità-> nome utente. ')', 'Url' => ['/ sito / logout'], 'linkOptions' => ['metodo dati '=>' post ']],],]); NavBar :: end (); ?>
isset ($ this-> params ['breadcrumbs'])? $ this-> params ['breadcrumbs']: [],])?>

© La mia azienda

endBody ()?> endPage ()?>

Le viste rappresentano per lo più i corpi delle pagine interne di un sito Web: cosa c'è tra l'intestazione e la barra di navigazione e l'inizio del piè di pagina. Sono resi quando echeggia il layout $ content:

 
isset ($ this-> params ['breadcrumbs'])? $ this-> params ['breadcrumbs']: [],])?>

Yii ti consente di creare più layout per applicazione, anche se questo non è sempre necessario. Dipende dalla tua applicazione. I controller offrono un layout predefinito e puoi sovrascriverlo per qualsiasi azione specifica. Se i controllori raggruppano logicamente attività correlate, è probabile che l'interfaccia utente utilizzi lo stesso layout per tutte le azioni all'interno di un controller.

Ora, aggiorna la barra di navigazione per includere un menu Stato con un'azione "crea". Poiché Yii2 utilizza Bootstrap per i suoi layout e stili, dobbiamo solo dirgli di creare un menu a discesa Bootstrap.

Aggiorna il Nav :: widget di avere un array annidato:

 echo Nav :: widget (['options' => ['class' => 'navbar-nav navbar-right'], 'items' => [['label' => 'Home', 'url' => [ '/ site / index']], ['label' => 'Status', 'items' => [['label' => 'Crea', 'url' => ['/ status / create']], ],], ['label' => 'About', 'url' => ['/ site / about']], ['label' => 'Contatti', 'url' => ['/ sito / contatto ']], Yii :: $ app-> utente-> isGuest? [' Label '=>' Login ',' url '=> [' / site / login ']]: [' label '=>' Esci ( '. Yii :: $ app-> user-> identity-> username.') ',' Url '=> [' / site / logout '],' linkOptions '=> [' data-method '=>' post ']],],]); 

Ecco cosa dovresti vedere:

Qual'è il prossimo?

Ora che sapete come funziona in pratica l'architettura MVC di Yii, inclusi modelli, viste, controller, moduli e layout, creeremo uno schema di database per gli stati e useremo il generatore di scaffolding di Yii, Gii, per costruire tutto questo automaticamente per noi. Le cose inizieranno a muoversi un po 'più velocemente.

Se vuoi sapere quando arriverà il prossimo tutorial di Yii2, seguimi su @reifman su Twitter o controlla la mia pagina di istruttori + Tuts. La mia pagina di istruttore includerà tutti gli articoli di questa serie non appena saranno pubblicati.

Link correlati

  • Sito Web di Yii Framework
  • Introduzione al framework Yii (Tuts +) 
  • Programmazione con Yii2: Guida introduttiva (Tuts +)
  • Altri esempi di sviluppatori Yii gratuiti e open source dell'autore