yii Как создать свой виджет?

Как создать  виджет  в yii?

yii2

Ответ

Виджет чаще всего используется в виде (view). Потому простой(!) пример для этого случая - виджет выводит заголовок и список ссылок (и заголовок, и массив ссылок передаются в момент вызова виджета в виде). Отправляемся в папку extensions и создаем в ней папку testwidgets. В ней создадим файл TestWidget.php и папку views, в которой создадим файл test.php. Как вы могли догадаться, это файл для класса виджета и файл для представления (вида) виджета соответственно.

Код файла TestWidget.php:

Как видите, название класса совпадает с названием файла и в методе run() данные отправляются в вид test. Php-код views/test.php выглядит следующим образом:

Теперь применим виджет в каком-нибудь виде:

Заметим, что здесь используется alias ext. Можно по-старому писать так: application.extensions.testwidgets.TestWidget.

Очень важная фраза:  $this в представлении указывает на экземпляр виджета, а не на экземпляр контроллера.

В примере выше не использован метод init(). Поэтому приведем более сложный пример, найденный на просторах интернета (спасибо bupy7). Внимание: речь идет о некоторых принципиальных моментах, нет нужды изучать код досконально в данной статье.

Суть в том, что есть скрипт http://flipclockjs.com/  - счетчик времени и необходимо сделать обертку для yii. Файлы скрипта находятся в папке assets (flipclock.css, flipclock.min.js). Рядом с папкой - файлы Flipclock.php и FlipclockWidget.php. И это все, естественно, в папке extensions/flipclock.

А теперь содержимое php-файлов:

и файла FlipclockWidget.php:

Собственно применение виджета в каком-нибудь виде:

Кстати, здесь используется registerScript с параметром CClientScript::POS_END - про это стоит срочно почитать. Что касается виджета, то обратим внимание на метод init(), в котором вызывается статический метод Flipclock::register() (для этого пришлось добавить строку Yii::import('ext.flipclock.Flipclock'); ). Надеюсь, суть понятна. Осталось самостоятельно написать обертку к какому-нибудь простому js-скрипту.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *