Yii Framework Offizieller Leitfaden Serie 44 – Thema: Theming (Theme)

Theming ist eine systematische Methode, um das Erscheinungsbild von Webseiten in Webanwendungen anzupassen. Durch die Übernahme eines neuen Themes kann das allgemeine Erscheinungsbild einer Webanwendung sofort und dramatisch verändert werden.

In Yii wird jedes Thema durch ein Verzeichnis dargestellt, einschließlich Ansichtsdateien, Layoutdateien und zugehörigen Ressourcendateien wie Bildern, CSS-Dateien, JavaScript-Dateien usw. Der Name des Themas ist sein Verzeichnisname. Alle Themen werden im selben Verzeichnis WebRoot/themes abgelegt. Es kann immer nur ein Thema aktiv sein.

Tipp: Das Standard-Theme-Stammverzeichnis WebRoot/themes kann auf etwas anderes konfiguriert werden. Konfigurieren Sie einfach die Eigenschaften basePath und baseUrl der themeManager-Anwendungskomponente auf die gewünschten Werte.

Um ein Theme zu aktivieren, legen Sie die Theme-Eigenschaft der Webanwendung auf den gewünschten Namen fest. Es kann in der Anwendungskonfiguration konfiguriert oder während der Ausführung in der Controller-Aktion geändert werden.

Hinweis: Bei Themennamen muss die Groß-/Kleinschreibung beachtet werden. Wenn Sie versuchen, ein Thema zu beginnen, das nicht existiert, wird yii: :app()->theme null zurückgeben.

Der Inhalt im Themenverzeichnis ist auf die gleiche Weise organisiert wie das Basispfadverzeichnis der Anwendung. Beispielsweise müssen sich alle Ansichtsdateien unter views, Layout-Ansichtsdateien unter views/layouts und Systemansichtsdateien unter views/system befinden. Wenn wir beispielsweise die PostController-Ansichtsdatei von create durch das classic-Design ersetzen möchten, speichern wir die neue Ansichtsdatei als WebRoot/themes/classic/views/post/create.php.

Für die Controller-Ansichtsdateien im Modul werden die entsprechenden Theme-Ansichtsdateien im Verzeichnis views abgelegt. Wenn sich das obige PostController beispielsweise in einem Modul mit dem Namen forum befindet, sollten wir die create-Ansichtsdatei als WebRoot/themes/classic/views/forum/post/create.php speichern. Wenn das forum-Modul in einem anderen Modul mit dem Namen support verschachtelt ist, sollte die Ansichtsdatei WebRoot/themes/classic/views/support/forum/post/create.php sein.

Hinweis: Da das Verzeichnis views sicherheitsrelevante Daten enthalten kann, sollte es so konfiguriert werden, dass der Zugriff durch Netzwerkbenutzer verhindert wird.

Wenn wir render oder renderPartial aufrufen, um eine Ansicht anzuzeigen, werden die entsprechende Ansichtsdatei und Layoutdatei im aktuell aktivierten Design gefunden. Wenn diese Dateien gefunden werden, werden sie gerendert. Andernfalls wird auf den durch viewPath und layoutPath angegebenen Standardspeicherort zurückgegriffen.

baseurl-Attribut können wir die folgende URL für diese Bilddatei generieren:

yii">

Tipp: In der Ansicht eines Themes müssen wir oft andere Theme-Ressourcendateien verknüpfen. Beispielsweise möchten wir möglicherweise eine Bilddatei im Verzeichnis images unter dem Thema anzeigen. Mit dem baseurl-Attribut des aktuell aktivierten Themes können wir die folgende URL für diese Bilddatei generieren:

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

Unten ist ein Beispiel für die Verzeichnisorganisation für eine Anwendung mit zwei Themen basic und 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

In der Anwendungskonfiguration, wenn wir konfigurieren

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

dann ist das basic-Design wirksam, was bedeutet, dass das Layout der Anwendung das im Verzeichnis und die Indexansicht der Site verwendet die unterthemes/basic/views/layouts. Falls eine Ansichtsdatei nicht im Theme gefunden wird, greift sie auf die unter demthemes/basic/views/site-Verzeichnis zurück.protected/views

1. Themen-Widgets

Ab Version 1.1.5 können Ansichten, die von einem Widget verwendet werden, auch mit einem Thema versehen werden. Insbesondere wenn wir CWidget::render() aufrufen, um eine Widget-Ansicht zu rendern, versucht Yii, unter dem Thema zu suchen Ordner sowie den Widget-Ansichtsordner für die gewünschte Ansichtsdatei.

Um die Ansicht

für ein Widget zu thematisieren, dessen Klassenname xyz ist, sollten wir zunächst einen Ordner mit dem Namen Foo(same als Widget-Klassenname) unter dem Ansichtsordner des aktuell aktiven Themas (verfügbar in PHP 5.3.0 oder höher), z. B. Foo, sollten wir einen Ordner mit dem Namen appwidgetsFoo erstellen. Wir ersetzen die Namespace-Trennzeichen durch die Unterstriche.app_widgets_Foo

Wir erstellen dann eine Ansichtsdatei mit dem Namen

unter dem neu erstellten Ordner. Zu diesem Zweck sollten wir eine Dateixyz.php haben, die von verwendet wird Das Widget soll seine ursprüngliche Ansicht ersetzen, wenn das derzeit aktive Theme älter als Version 1.1.3 ist.themes/basic/views/Foo/xyz.php

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.

Wenn ein Widget einen Skin verwendet, der nicht existiert, erstellt Yii das Widget trotzdem wie gewohnt ohne Fehler.

Info: Die Verwendung eines Skins kann die Leistung beeinträchtigen weil Yii beim ersten Erstellen eines Widgets nach der Skin-Datei suchen muss.

Skin ist der globalen Widget-Anpassungsfunktion sehr ähnlich. Die Hauptunterschiede sind wie folgt.

• Skin hängt eher mit der Anpassung von Darstellungseigenschaftswerten zusammen;

• Ein Widget kann mehrere Skins haben;

• Skin ist thematisch anpassbar;

• Die Verwendung von Skin ist teurer als die Verwendung globaler Widget-Anpassung.

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