Yii Framework Official Guide Series 44 - Sujet : Thématisation (thème)

Le thème est un moyen systématique de personnaliser l'apparence des pages Web dans les applications Web. En adoptant un nouveau thème, l’apparence générale d’une application Web peut être modifiée instantanément et radicalement.

Dans Yii, chaque thème est représenté par un répertoire, comprenant les fichiers de vue, les fichiers de mise en page et les fichiers de ressources associés, tels que les images, les fichiers CSS, les fichiers JavaScript, etc. Le nom du thème est le nom de son répertoire. Tous les thèmes sont placés dans le même répertoire WebRoot/themes. A tout moment, un seul thème peut être actif.

Conseil : Le répertoire racine du thème par défaut WebRoot/themes peut être configuré sur autre chose. Configurez simplement les propriétés basePath et baseUrl du composant d'application themeManager sur les valeurs souhaitées.

Pour activer un thème, définissez la propriété theme de l'application Web sur le nom souhaité. Il peut être configuré dans la configuration de l'application ou modifié dans l'action du contrôleur lors de l'exécution.

Remarque : les noms des sujets sont sensibles à la casse. Si vous essayez de démarrer un sujet qui n'existe pas, yii: :app()->theme reviendra null .

Le contenu du répertoire du thème est organisé de la même manière que le répertoire du chemin de base de l'application. Par exemple, tous les fichiers de vue doivent être situés sous views, les fichiers de vue de mise en page sous views/layouts et les fichiers de vue système sous views/system. Par exemple, si nous voulons remplacer le fichier de vue PostController de create par le thème classic, nous enregistrerons le nouveau fichier de vue sous WebRoot/themes/classic/views/post/create.php.

Pour les fichiers de vue du contrôleur dans le module, les fichiers de vue de thème correspondants seront placés dans le répertoire views. Par exemple, si le PostController ci-dessus se trouve dans un module nommé forum, nous devons enregistrer le fichier de vue create sous WebRoot/themes/classic/views/forum/post/create.php. Si le module forum est imbriqué dans un autre module nommé support, alors le fichier de vue doit être WebRoot/themes/classic/views/support/forum/post/create.php.

Remarque : Étant donné que le répertoire views peut contenir des données sensibles en matière de sécurité, il doit être configuré pour empêcher l'accès des utilisateurs du réseau.

Lorsque nous appelons render ou renderPartial pour afficher une vue, le fichier de vue et le fichier de mise en page correspondants se trouveront dans le thème actuellement activé. S’ils sont trouvés, ces fichiers seront rendus. Sinon, il reviendra à l'emplacement par défaut spécifié par viewPath et layoutPath.

attribut baseurl, nous pouvons générer l'url suivante pour ce fichier image,

yii">

Astuce : Dans la vue d'un thème, nous avons souvent besoin de lier d'autres fichiers de ressources de thème. Par exemple, nous pourrions souhaiter afficher un fichier image dans le répertoire images sous le thème. En utilisant l'attribut baseurl du thème actuellement activé, nous pouvons générer l'url suivante pour ce fichier image,

yii: :app()->theme->baseUrl . '/images/FileName.gif'

Ci-dessous un exemple d'organisation d'annuaire pour une application avec deux thèmes basic et fancy.

WebRoot/
    assets
    protected/
        .htaccess
        components/
        controllers/
        models/
        views/
            layouts/
                main.php
            site/
                index.php
    themes/
        basic/
            views/
                .htaccess
                layouts/
                    main.php
                site/
                    index.php
        fancy/
            views/
                .htaccess
                layouts/
                    main.php
                site/
                    index.php

Dans la configuration de l'application, si on configure

return array(
    'theme'=>'basic',
    ......
);

alors le thème basic sera en vigueur, ce qui signifie que la mise en page de l'application utilisera celui du répertoire themes/basic/views/layouts, et la vue d'index du site utilisera celle sousthemes/basic/views/site. Si un fichier de vue n'est pas trouvé dans le thème, il reviendra à celui sous le répertoireprotected/views.

1. Widgets thématiques

À partir de la version 1.1.5, les vues utilisées par un widget peuvent également être thématiques. En particulier, lorsque nous appelons CWidget::render() pour restituer une vue de widget, Yii tentera de rechercher sous le thème. dossier ainsi que le dossier de vue du widget pour le fichier de vue souhaité.

Pour thématiser la vue xyz pour un widget dont le nom de classe est Foo, nous devons d'abord créer un dossier nommé Foo (même comme nom de classe de widget) sous le dossier d'affichage du thème actuellement actif. Si la classe de widget est avec un espace de noms (disponible dans PHP 5.3.0 ou supérieur), comme appwidgetsFoo, nous devons créer un dossier nommé app_widgets_Foo. nous remplaçons les séparateurs d'espace de noms par les caractères de soulignement.

Nous créons ensuite un fichier de vue nommé xyz.php sous le dossier nouvellement créé. À cette fin, nous devrions avoir un fichierthemes/basic/views/Foo/xyz.php, qui sera utilisé par. le widget pour remplacer sa vue d'origine, si le thème actuellement actif est depuis la version 1.1.3.basic

When using a widget provided by third party or Yii, we often need to customize it for specific needs. For example, we may want to change the value of CLinkPager::maxButtonCount from 10 (default) to 5. We can accomplish this by passing the initial property values when calling CBaseController::widget to create a widget. However, it becomes troublesome to do so if we have to repeat the same customization in every place we useCLinkPager.

$this->widget('CLinkPager', array(
    'pages'=>$pagination,
    'maxButtonCount'=>5,
    'cssFile'=>false,
));

Using the global widget customization feature, we only need to specify these initial values in a single place, i.e., the application configuration. This makes the customization of widgets more manageable.

To use the global widget customization feature, we need to configure the widgetFactory as follows:

return array(
    'components'=>array(
        'widgetFactory'=>array(
            'widgets'=>array(
                'CLinkPager'=>array(
                    'maxButtonCount'=>5,
                    'cssFile'=>false,
                ),
                'CJuiDatePicker'=>array(
                    'language'=>'ru',
                ),
            ),
        ),
    ),
);

In the above, we specify the global widget customization for both CLinkPager and CJuiDatePicker widgets by configuring the CWidgetFactory::widgets property. Note that the global customization for each widget is represented as a key-value pair in the array, where the key refers to the wiget class name while the value specifies the initial property value array.

Now, whenever we create a CLinkPager widget in a view, the above property values will be assigned to the widget, and we only need to write the following code in the view to create the widget:

$this->widget('CLinkPager', array(
    'pages'=>$pagination,
));

We can still override the initial property values when necessary. For example, if in some view we want to setmaxButtonCount to be 2, we can do the following:

$this->widget('CLinkPager', array(
    'pages'=>$pagination,
    'maxButtonCount'=>2,
));

3. 皮肤

Note: The skin feature has been available since version 1.1.0.

While using a theme we can quickly change the outlook of views, we can use skins to systematically customize the outlook of the widgets used in the views.

A skin is an array of name-value pairs that can be used to initialize the properties of a widget. A skin belongs to a widget class, and a widget class can have multiple skins identified by their names. For example, we can have a skin for the CLinkPager widget and the skin is named as classic.

In order to use the skin feature, we first need to modify the application configuration by configuring theCWidgetFactory::enableSkin property to be true for the widgetFactory application component:

return array(
    'components'=>array(
        'widgetFactory'=>array(
            'enableSkin'=>true,
        ),
    ),
);

Please note that in versions prior to 1.1.3, you need to use the following configuration to enable widget skinning:

return array(
    'components'=>array(
        'widgetFactory'=>array(
            'class'=>'CWidgetFactory',
        ),
    ),
);

We then create the needed skins. Skins belonging to the same widget class are stored in a single PHP script file whose name is the widget class name. All these skin files are stored under protected/views/skins, by default. If you want to change this to be a different directory, you may configure the skinPath property of thewidgetFactory component. As an example, we may create under protected/views/skins a file namedCLinkPager.php whose content is as follows,

<?php
return array(
    &#39;default&#39;=>array(
        'nextPageLabel'=>'&gt;&gt;',
        'prevPageLabel'=>'&lt;&lt;',
    ),
    'classic'=>array(
        'header'=>'',
        'maxButtonCount'=>5,
    ),
);

In the above, we create two skins for the CLinkPager widget: default and classic. The former is the skin that will be applied to any CLinkPager widget that we do not explicitly specify its skin property, while the latter is the skin to be applied to a CLinkPager widget whose skin property is specified as classic. For example, in the following view code, the first pager will use the default skin while the second the classic skin:

<?php $this->widget('CLinkPager'); ?>

<?php $this->widget('CLinkPager', array('skin'=>'classic')); ?>

If we create a widget with a set of initial property values, they will take precedence and be merged with any applicable skin. For example, the following view code will create a pager whose initial values will bearray('header'=>'', 'maxButtonCount'=>6, 'cssFile'=>false), which is the result of merging the initial property values specified in the view and the classic skin.

<?php $this->widget('CLinkPager', array(
    'skin'=>'classic',
    'maxButtonCount'=>6,
    'cssFile'=>false,
)); ?>

Note that the skin feature does NOT require using themes. However, when a theme is active, Yii will also look for skins under the skins directory of the theme's view directory (e.g.WebRoot/themes/classic/views/skins). In case a skin with the same name exists in both the theme and the main application view directories, the theme skin will take precedence.

Si un widget utilise un skin qui n'existe pas, Yii créera quand même le widget comme d'habitude sans aucune erreur.

Information : L'utilisation du skin peut dégrader les performances car Yii doit rechercher le fichier skin la première fois qu'un widget est créé.

Skin est très similaire à la fonction de personnalisation globale du widget. Les principales différences sont les suivantes.

• Le skin est davantage lié à la personnalisation des valeurs des propriétés de présentation ;

• Un widget peut avoir plusieurs skins ;

• Le skin peut être thématique ;

• L'utilisation du skin coûte plus cher que l'utilisation de la personnalisation globale du widget.

 以上就是Yii框架官方指南系列44——专题：Theming(主题)的内容，更多相关内容请关注PHP中文网（www.php.cn） ！