theming是一個在web應(yīng)用程序里定制網(wǎng)頁外觀的系統(tǒng)方式。通過采用一個新的主題，網(wǎng)頁應(yīng)用程序的整體外觀可以立即和戲劇性的改變。

在Yii，每個主題由一個目錄代表，包含view文件，layout文件和相關(guān)的資源文件，如圖片， CSS文件， JavaScript文件等。主題的名字就是他的目錄名字。全部主題都放在在同一目錄WebRoot/themes下 。在任何時候，只有一個主題可以被激活。

提示：默認(rèn)的主題根目錄WebRoot/themes可被配置成其他的。只需要配置themeManager應(yīng)用部件的屬性basePath和baseUrl為你所要的值。

要激活一個主題，設(shè)置Web應(yīng)用程序的屬性theme為你所要的名字。可以在application configuration中配置或者在執(zhí)行過程中在控制器的動作里面修改。

注：主題名稱是區(qū)分大小寫的。如果您嘗試啟動一個不存在的主題，?yii:?:app()->theme將返回null?。

主題目錄里面內(nèi)容的組織方式和application base path目錄下的組織方式一樣。例如，所有的view文件必須位于views下 ，布局view文件在views/layouts下 ，和系統(tǒng)view文件在views/system下。例如，如果我們要替換PostController的create?view文件為classic主題下，我們將保存新的view文件為WebRoot/themes/classic/views/post/create.php。

對于在module里面的控制器view文件，相應(yīng)主題view文件將被放在views目錄下。例如，如果上述的PostController是在一個命名為forum的模塊里 ，我們應(yīng)該保存create?view 文件為WebRoot/themes/classic/views/forum/post/create.php?。如果?forum模塊嵌套在另一個名為support模塊里 ，那么view文件應(yīng)為WebRoot/themes/classic/views/support/forum/post/create.php?。

注：由于views目錄可能包含安全敏感數(shù)據(jù)，應(yīng)當(dāng)配置以防止被網(wǎng)絡(luò)用戶訪問。

當(dāng)我們調(diào)用render或renderPartial顯示視圖，相應(yīng)的view文件以及布局文件將在當(dāng)前激活的主題里尋找。如果發(fā)現(xiàn)，這些文件將被render渲染。否則，就后退到viewPath和layoutPath?所指定的預(yù)設(shè)位置尋找。

baseurl屬性，我們就可以為此圖像文件生成如下url，

yii">

登錄后復(fù)制

提示：在一個主題的視圖，我們經(jīng)常需要鏈接其他主題資源文件。例如，我們可能要顯示一個在主題下images目錄里的圖像文件。使用當(dāng)前激活主題的baseurl屬性，我們就可以為此圖像文件生成如下url，

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

登錄后復(fù)制

Below is an example of directory organization for an application with two themes?basic?and?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 the application configuration, if we configure

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

then the?basic?theme will be in effect, which means the application's layout will use the one under the directory?themes/basic/views/layouts, and the site's index view will use the one underthemes/basic/views/site. In case a view file is not found in the theme, it will fall back to the one under theprotected/views?directory.

1. 主題掛件

Starting from version 1.1.5, views used by a widget can also be themed. In particular, when we callCWidget::render()?to render a widget view, Yii will attempt to search under the theme folder as well as the widget view folder for the desired view file.

To theme the view?xyz?for a widget whose class name is?Foo, we should first create a folder named?Foo(same as the widget class name) under the currently active theme's view folder. If the widget class is namespaced (available in PHP 5.3.0 or above), such as?\app\widgets\Foo, we should create a folder namedapp_widgets_Foo. That is, we replace the namespace separators with the underscore characters.

We then create a view file named?xyz.php?under the newly created folder. To this end, we should have a filethemes/basic/views/Foo/xyz.php, which will be used by the widget to replace its original view, if the currently active theme is?basic.

2. 自定義全局掛件

Note:?this feature has been available since version 1.1.3.

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(
    'default'=>array(
        'nextPageLabel'=>'>>',
        'prevPageLabel'=>'<<',
    ),
    '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.

If a widget is using a skin that does not exist, Yii will still create the widget as usual without any error.

Info:?Using skin may degrade the performance because Yii needs to look for the skin file the first time a widget is being created.

Skin is very similar to the global widget customization feature. The main differences are as follows.

• Skin is more related with the customization of presentational property values;

• A widget can have multiple skins;

• Skin is themeable;

• Using skin is more expensive than using global widget customization.

?以上就是Yii框架官方指南系列44——專題：Theming(主題)的內(nèi)容，更多相關(guān)內(nèi)容請關(guān)注PHP中文網(wǎng)（miracleart.cn）！