Une aide de vue, ou ViewHelper, sert \u00e0 factoriser des bouts de code pour nos views ou layouts.<\/p>\n
L'appel \u00e0 notre aide de vue se fera tr\u00e8s simplement. Prenons par exemple le cas o\u00f9 on a besoin\u00a0de d\u00e9clarer des feuilles de style dont les noms sont contenus dans un tableau :<\/p>\n
$base_path = $this->basePath(); \r\necho $this->getHeadLinks($base_path, $favicon_file = null, $this->config['css']);<\/pre>\nDans cet exemple, on utilise deux aides de vue, basePath()<\/em> qui est fournie dans le package Zendframework 2<\/em> et getHeadLinks()<\/em> que je vais d\u00e9velopper ci-dessous.<\/p>\n
Pour mon aide de vue je\u00a0passe trois\u00a0param\u00e8tres :<\/p>\n
\n
- $base_path<\/em>\u00a0: la racine du\u00a0service fournie par l'aide de vue de ZendFramework<\/em><\/li>\n
- $favicon_file<\/em>\u00a0: le favicon \u00e0 utiliser pour cette page<\/li>\n
- $config['css'] : le<\/em>\u00a0tableau provenant du config\/module.config.php<\/em><\/li>\n<\/ul>\n
Dans config\/module.config.php,<\/em> je d\u00e9cris les feuilles de style \u00e0 charger de la fa\u00e7on suivante :<\/p>\n
return array(\r\n ...\r\n 'css' => array(\r\n 'css\/style.css',\r\n 'css\/nav.css',\r\n array(\r\n 'href' => 'css\/ie7.css',\r\n 'media' => 'screen',\r\n 'conditionalStylesheet' => 'lt ie7',\r\n 'extras' => array('id' => 'dafap',) \r\n ),\r\n ),\r\n ...<\/pre>\ncela devra donner dans le code de la page :<\/p>\n
<!--[if lt ie7]> <link href=\"\/css\/ie7.css\" media=\"screen\" rel=\"stylesheet\" type=\"text\/css\" id=\"dafap\" \/><![endif]-->\r\n<link href=\"\/css\/nav.css\" media=\"screen\" rel=\"stylesheet\" type=\"text\/css\">\r\n<link href=\"\/css\/style.css\" media=\"screen\" rel=\"stylesheet\" type=\"text\/css\">\r\n<link href=\"\/img\/favicon.ico\" rel=\"shortcut icon\" type=\"image\/vnd.microsoft.icon\"><\/pre>\nImpl\u00e9mentation de notre aide de vue<\/h2>\n
Une aide de vue, ou ViewHelper, est une classe d\u00e9riv\u00e9e de\u00a0Zend\\View\\Helper\\AbstractHelper<\/em>. Pour mon cas, je l'appelerai HeadLinks<\/em> et elle sera plac\u00e9e dans le src<\/em> du module, dossier View\/Helper<\/em> :<\/p>\n
module\r\n \u2514 MonModule\r\n \u2514 src\r\n \u2514 MonModule\r\n \u2514 View\r\n \u2514 Helper<\/pre>\nSa m\u00e9thode _invoke()<\/em> retournera le\u00a0r\u00e9sultat en invoquant son nom d\u00e9clar\u00e9 dans module.php<\/em> dans la m\u00e9thode getViewHelperConfig()<\/em>.<\/p>\n
public function getViewHelperConfig()\r\n{\r\n return array(\r\n 'invokables' => array(\r\n 'getHeadLinks' => __NAMESPACE__ .'\\View\\Helper\\HeadLinks',\r\n ),\r\n );\r\n}<\/pre>\nDans\u00a0mon aide de vue, j'ai besoin d'utiliser l'aide de vue headLink<\/em> de Zendframework<\/em>. Or, je ne peux pas utiliser l'alias headLink<\/em> qui n'est pas invokable<\/em>. Je vais donc utiliser la classe directement.<\/p>\n
namespace MonModule\\View\\Helper;\r\nuse Zend\\View\\Helper\\AbstractHelper;\r\nuse Zend\\View\\Helper\\HeadLink;\r\n\r\nclass HeadLinks extends AbstractHelper\r\n{\r\n public function __invoke($base_path, $favicon_file = null, $cssFilesArray = array())\r\n {\r\n $headLink = new HeadLink();\r\n if (! is_null($favicon_file) && is_string($favicon_file)) {\r\n $headLink = $headLink(array(\r\n 'rel' => 'shortcut icon',\r\n 'type' => 'image\/vnd.microsoft.icon',\r\n 'href' => $this->concatPath($base_path, $favicon_file)\r\n ));\r\n } else {\r\n $headLink = $headLink();\r\n }\r\n foreach ($cssFilesArray as $css_file) {\r\n if (is_string($css_file)) {\r\n $headLink = $headLink->prependStylesheet($this->concatPath($base_path, $css_file));\r\n } elseif (is_array($css_file)) {\r\n $href = $this->getParam('href', $css_file);\r\n $media = $this->getParam('media', $css_file);\r\n $conditionalStylesheet = $this->getParam('conditionalStylesheet', $css_file);\r\n $extras = $this->getParam('extras', $css_file);\r\n if (!is_null($href)) {\r\n $headLink = $headLink->prependStylesheet($this->concatPath($base_path, $href), $media, $conditionalStylesheet, $extras);\r\n }\r\n } else {\r\n throw new \\Exception('Erreur de structure pour la d\u00e9finition des fichiers css.');\r\n }\r\n }\r\n return $headLink;\r\n }\r\n private function getParam($nom, $tableau)\r\n {\r\n if (array_key_exists($nom, $tableau)) {\r\n return $tableau[$nom];\r\n } else {\r\n return null;\r\n }\r\n }\r\n private function concatPath($base_path, $file = null)\r\n {\r\n if (! is_null($file)) {\r\n $file = '\/' . ltrim($file, '\/');\r\n }\r\n $base_path = rtrim(str_replace('\\\\', '\/', $base_path), '\/');\r\n return $base_path . $file;\r\n }\r\n}<\/pre>\nUtilisation de mon aide de vue dans un layout<\/h2>\n
Pour utiliser mon aide de vue dans un layout, je dois disposer d'une variable $this->config<\/em> qui contient notamment la cl\u00e9 'css'<\/em> donnant la structure \u00e0 monter (en fait, je passe \u00e9galement dans ce tableau tous les \u00e9l\u00e9ments constitutifs du layout comme les composants du header, du footer, etc.).<\/p>\n
Comment passer une variable \u00e0 un layout ?<\/h3>\n
Premi\u00e8re fa\u00e7on : depuis un contr\u00f4leur<\/h4>\n
Dans un contr\u00f4leur, on a acc\u00e8s au layout par la m\u00e9thode layout()<\/em>. On cr\u00e9e donc les variables directement :<\/p>\n
$this->layout()->ma_variable = $valeur;<\/pre>\nEn particulier pour mon cas, je trouverai la valeur de ma variable de configuration de la fa\u00e7on suivante :<\/p>\n
$sm = $this->getServiceLocator();\r\n$config = $sm->get('config');\r\n$this->layout()->config = $config['layout'];<\/pre>\nDeuxi\u00e8me fa\u00e7on : depuis la classe Module<\/h4>\n
Etant donn\u00e9 que la configuration est disponible dans\u00a0la classe Module, on peut\u00a0cr\u00e9er la variable depuis la m\u00e9thode onBootstrap()<\/em> de cette classe :<\/p>\n
public function onBootstrap(MvcEvent $e)\r\n {\r\n $eventManager = $e->getApplication()->getEventManager();\r\n $config = $this->getApplication()->getServiceManager()->get('config');\r\n $config_layout = $config['layout'];\r\n $eventManager->attach(MvcEvent::EVENT_RENDER, function($e) use ($config_layout) {\r\n $e->getViewModel()->setVariable('config', $config_layout);\r\n });\r\n $moduleRouteListener = new ModuleRouteListener();\r\n $moduleRouteListener->attach($eventManager);\r\n }<\/pre>\nTroisi\u00e8me fa\u00e7on : en d\u00e9rivant la classe\u00a0Module<\/em> de ZfcBase\\Module\\AbstractModule<\/em><\/h4>\n
On devra alors restructurer le fichier module.config.php de la fa\u00e7on suivante :<\/p>\n
return array(\r\n 'MonModule' => array(\r\n 'layout' => array(\r\n 'css' => array(\r\n 'css\/style.css',\r\n 'css\/nav.css',\r\n array(\r\n 'href' => 'css\/ie7.css',\r\n 'media' => 'screen',\r\n 'conditionalStylesheet' => 'lt ie7',\r\n 'extras' => array('id' => 'dafap',)\r\n ),\r\n ),\r\n ...\r\n ),\r\n ),\r\n ...\r\n);<\/pre>\nAinsi, on pourra utiliser dans le module la m\u00e9thode getOptions()\u00a0<\/em>:<\/p>\n
namespace MonModule;\r\nuse ZfcBase\\Module\\AbstractModule;\r\nclass Module extends AbstractModule\r\n{\r\n public function onBootstrap(MvcEvent $e)\r\n {\r\n $eventManager = $e->getApplication()->getEventManager();\r\n $config_layout = $this->getOptions('layout');\r\n $eventManager->attach(MvcEvent::EVENT_RENDER, function($e) use ($config_layout) {\r\n $e->getViewModel()->setVariable('config', $config_layout);\r\n });\r\n $moduleRouteListener = new ModuleRouteListener();\r\n $moduleRouteListener->attach($eventManager);\r\n }\r\n public function getDir()\r\n {\r\n return __DIR__;\r\n }\r\n public function getNamespace()\r\n {\r\n return __NAMESPACE__;\r\n }\r\n}<\/pre>\nCela va permettre d'utiliser une configuration particuli\u00e8re pour chaque module de l'application. Mais \u00e7a, ce sera l'objet d'un prochain article.<\/p>\n