Способи кастомізації і стилізації віджетів в yii

У комплекті Yii Framework спочатку поставляється набір віджетів Zii. Програмісти знайомляться з великою кількістю можливостей по стилізації віджетів, починають кастомизировать, але не відразу доходять до зручних способів стилізації. У цьому рецепті ми спробуємо максимально скоротити розміри копійованого з виду на вид коду.

Багато наведені далі дії застосовні до стандартних (CLinkPager. CGridView. CListView. CDetailView. CActiveForm) і вашим власним віджетів. Ми розглянемо для прикладу тільки роботу з ґрідом і паджінатором.

Оформлення CGridView і CLinkPager

Отже, паджінатор можна стилізувати, використовуючи його як спеціально окремо:

так і «не навмисне», так як він же використовується в складі CGridView. CListView:

Тут ми вказали йому додаткові опції, а саме додали «ялинки» до написів посилань.

Зазвичай стилізація на цьому не зупиняється. так як для переробки віджетів під персональний дизайн доводиться міняти шаблони і прописувати свої CSS правила. Наприклад, щоб вивести два паджінатора над і під списком елементів (не використовуючи CListView), потрібно написати в поданні так:

Клас CLinkPager. звичайно ж, має і інші параметри. але ми їх чіпати не будемо.

Перейдемо тепер до CGridView. Нехай стандартний грід для виведення списку записів блогу виглядає так:

Коли ми вкажемо необхідні правила в коді виклику, це буде виглядати монструозність:

Тут ми, всього лише, переопределили деякі шаблони і вказали віджетів свої файли стилів.

Загалом, кожен виводить гріди по своєму, але це зараз не так важливо.

Проблема такого прямого підходу до стилізації в тому, що при наявності декількох десятків CRUD контролерів з'являється незручність синхронізації. Всі ці виклики віджета потрібно копіювати в первозданному вигляді в усі уявлення, і при зміні стилю правити код в кожному.

Також у нас з'явиться проблема при розробці другого сайту, так як там ми не зможемо використовувати ці ж файли представлень для іншого дизайну. Звичайно ж, ми можемо перевизначити всі уявлення в темі нового сайту, але це не дуже економний варіант. Так що спробуємо знайти альтернативи.

Перевизначення параметрів віджетів через успадкування

CGridView і все решта компоненти фреймворку вдають із себе звичайні класи з публічними полями, тому ми легко можемо отнаследоваться від оригіналу і перевизначити значення цих полів за замовчуванням.

Створимо клас LinkPager і перенесемо передаються при виклику віджета значення всередину нього:

Тут ми, наприклад, беремо файл стилів з поточної теми. Ми вказали його в конструкторі, так як, на відміну від Java або ActionScript, мова PHP не дозволяє використовувати для ініціалізації полів обчислювані вирази, тобто не дозволяє написати ось так:

Новий клас помістимо, наприклад, в protected / components. Тепер замість CLinkPager можна використовувати наш LinkPager:

І все це здійснюється не дописуванням десятків опцій в кожну виставу, а простою зміною імені класу.

Тепер щоб змінити стилі всіх віджетів для другого сайту потрібно лише змінити значення опцій в класах GridView або GridView. Жоден файл уявлення міняти не треба.

Темізація через скіни

Перевизначення стандартних класів - дуже гнучкий засіб, але використовувати його тільки для зміни стилю віджетів нераціонально, так як фреймворк надає для цього іншу зручну можливість.

Опис можна знайти в статті по темізаціі в офіційному керівництві. Yii надає для віджетів не тільки стандартне перевизначення уявлень, а й перевизначення опцій.

Перший підхід має на увазі вказівку параметрів в файлі конфігурації:

Але в цьому випадку ми повинні вручну прописувати шляху