Skip to content

Интерфейс (стили)

TrueCat17 edited this page Dec 5, 2023 · 2 revisions

Это статья о настройке стилей, используемых в экранах (Загрузка, Настройки...).
Настройка свойств gui-объекта обсуждалась в прошлой статье.


Определение стилей по умолчанию производится в файле Ren-Engine/rpy/screens/styles.rpy.
Вносить изменения для своей игры рекомендуется в файле resources/mods/common/styles.rpy.


Приоритет блока инициализации

Стили часто наследуются друг от друга, поэтому они должны быть объявлены в нужном порядке.
Для возможности переопределения пользователем "базовых" стилей (от которых зависят другие стили) все стили определяются в init-блоках с чётко определённым приоритетом.
Благодаря этому можно легко изменить любой стиль без отслеживания их зависимостей друг от друга и повторных переопределений свойств, получая при этом хороший результат.


Общий и отдельные стили

Некоторые стили можно определить не только в "общем" виде, но и создать их специализированные версии со спец. префиксами, тогда они будут применяться в конкретных экранах.

Например, скрин загрузки будет использовать для заголовка стиль load_menu_title, скрин сохранения - save_menu_title, а скрин настроек - prefs_menu_title.
В случае же отсутствия нужного стиля (по умолчанию их обычно нет) будет использоваться базовый стиль menu_title.

Далее для некоторых стилей будет указана такая возможность создания специализированных вариантов.
В этом случае в самом начале их абзаца будет написана фраза:

"Общий" стиль.


Отключение элементов

Иногда требуется отключить отображение некоторых элементов.
Для этого вы можете в соответствующем стиле alpha 0.

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

init -999:
	style menu_title is text:
		alpha 0

Очевидно, похожим образом легко поменять его местоположение на экране и другие характеристики.


Масштабирование без краёв

В Ren-Engine интерфейс является адаптивным, т. е. меняется в зависимости от разрешения окна игры.

Однако, изображения обычно нельзя просто так растягивать (кроме разве что полностью однотонных), поэтому для этого используется специальная функция im.scale_without_borders (см. статью об im-функциях).

Обычно это происходит не прямо, а косвенно, через методы get_ground/get_hover у стилей (для подробностей см. абзац про стили в ScreenLang).

Т. е. для более точного управления масштабированием, вам может понадобиться использовать свойства xsize, xsize_min, xsize_max, их аналоги ysize*, а также "нестандартное" свойство corner_sizes.

По умолчанию corner_sizes не существует или равен None, т. е. в качестве "размера границы", которую не нужно масштабировать, берётся треть от минимальной стороны изображения.
Но в случае необходимости, этот размер можно задать явно (или даже размеры - для каждой стороны отдельно).

Если по каким-то причинам нужно "отключить" это поведение и масштабировать всё изображение целиком, свойству corner_sizes можно присвоить значение 0.


Далее идут стили (с нужным приоритетом вроде -999) и их краткие описания.
Посмотреть на свойства по умолчанию и примеры можно в файле Ren-Engine/rpy/screens/styles.rpy.
Порядок стилей взят оттуда же, т. е. они сгруппированы скорее по "наследованию" (если оно есть), чем по расположению на экране.


Заголовок

"Общий" стиль.

init -999:
	style menu_title is text:
		# ...

Текст

Обычный текст, используется только в экране настроек.

init -999:
	style menu_text is text:
		# ...

Кнопка

"Общий" стиль.

init -999:
	style menu_button is textbutton:
		# ...

prefs_content

Стиль vbox-контейнера для всех "строк" ("рядов", "линий") настроек.

init -999:
	style prefs_content is vbox:
		# ...

prefs_line

Стиль hbox-контейнера для "строки" настроек.

init -999:
	style prefs_line is hbox:
		# ...

Текст пропуска

Стиль для текста "Пропуск" в режиме пропуска (по Ctrl или Tab).

init -999:
	style skip_text is text:
		# ...

Кнопка Моды

Обратите внимание на изменившийся приоритет init-блока.
Это нужно, т. к. стиль mods_button наследуется от menu_button.

init -998:
	style mods_button is menu_button:
		# ...

Кнопка Вернуться

"Общий" стиль.

init -998:
	style return_button is menu_button:
		# ...

Кнопка страницы

"Общий" стиль.

Под "страницей" подразумевается страница сохранений (1, "quick", auto) или вкладка настроек (Language).

init -998:
	style page_button is menu_button:
		# ...

pages_vbox

"Общий" стиль.

Стиль vbox-контейнера для кнопок страниц из абзаца выше.

init -998:
	style pages_vbox is vbox:
		# ...

prefs_page_button

Аналог page_button, но специально для экрана настроек.

init -997:
	style prefs_page_button is page_button:
		# ...

prefs_pages_vbox

Аналог pages_vbox, но специально для экрана настроек.

init -997:
	style prefs_pages_vbox is pages_vbox:
		# ...

bar_button

Стиль кнопок слева и справа от бара ("минус" и "плюс").

init -998:
	style bar_button is menu_button:
		# ...

bar

Хоть этот стиль и наследуется от menu_button, использовать его будет изображение (это нужно для равенства некоторых параметров, чтобы разные элементы хорошо смотрелись вместе).

init -998:
	style bar is menu_button:
		# ...

Кнопка чекбокса

Стиль кнопки поверх чекбокса (затемнение).
Такая кнопка нужна, чтобы не целиться в маленький чекбокс, а также чтобы клик по тексту или рядом воспринимался также, как клик по чекбоксу.

init -998:
	style bool_button is menu_button:
		# ...

Изображение чекбокса

init -998:
	style checkbox is image:
		# ...

Текст чекбокса

init -998:
	style bool_text is menu_text:
		# ...

Контейнер чекбокса

init -998:
	style bool_hbox is hbox:
		# ...

slots_content

Стиль vbox-контейнера в скрине slots (используется в экранах загрузки и сохранения).
Основная задача - отделять слоты и кнопки управления ("Загрузить"/"Сохранить" и "Удалить") друг от друга, а также размещать их в определённой части экрана.

init -998:
	style slots_content is vbox:
		# ...

slots_vbox

Стиль vbox-контейнера в скрине slots, основная задача которого - отделять slots_hbox ("строки"/"ряды"/"линии") друг от друга.

init -998:
	style slots_vbox is vbox:
		# ...

slots_hbox

Стиль hbox-контейнера в скрине slots, который ставит слоты в горизонтальный ряд.

init -998:
	style slots_hbox is hbox:
		# ...

Текст слота

В нём пишется время создания сохранения.

init -998:
	style slot_text is menu_text:
		# ...

slots_buttons

Стиль hbox-контейнера для разделения кнопок управления ("Загрузить"/"Сохранить" и "Удалить") друг от друга, а также размещения их в определённой части экрана.

init -998:
	style slots_buttons is slots_hbox:
		# ...

Кнопки управления слотами

Есть несколько стилей, которые по умолчанию отсутствуют (берётся menu_button с некоторыми изменениями), но которые могут быть использованы:

  • save_button - для кнопки сохранения,
  • enabled_load_button - для доступной кнопки загрузки,
  • disabled_load_button - для "отключённой" кнопки загрузки,
  • enabled_delete_button - для доступной кнопки удаления,
  • disabled_delete_button - для "отключённой" кнопки удаления.

Кнопки имеют "отключённый" вид, если выделен слот без сохранения (очевидно, это не относится к кнопке "Сохранить").

Рекомендуется наследовать эти стили от menu_button.
В init-блоке для них используйте приоритет 0 (относится ко всем несуществующим по умолчанию стилям).


mods_vbox

Стиль vbox-контейнера для кнопок модов из абзаца ниже.

init -997:
	style mods_vbox is vbox:
		# ...

Кнопка запуска мода

init -997:
	style mod_button is menu_button:
		# ...

Кнопка смены страницы модов

Есть 2 такие кнопки: для перехода на предыдущую и следующую страницы.
Отображаются, когда установлено больше модов, чем может вместиться на 1 странице (см. gui.prefs_mods_in_page).

init -997:
	style change_mod_page_button is mod_button:
		# ...

Текст страниц модов

Текст имеет вид номер_страницы / кол-во_страниц.
Отображаются, когда установлено больше модов, чем может вместиться на 1 странице (см. gui.prefs_mods_in_page).

init -997:
	style mod_page_text is menu_text:
		# ...

change_mod_page_button_hbox

Стиль hbox-контейнера для элементов из 2 предыдущих абзацев.
Отображается, когда установлено больше модов, чем может вместиться на 1 странице (см. gui.prefs_mods_in_page).

init -997:
	style change_mod_page_button_hbox is hbox:
		# ...

Фон внутриигрового меню выбора

См. gui.choice_buttons_bg.

init -998:
	style choice_buttons_bg is image:
		# ...

Кнопка внутриигрового меню выбора

init -998:
	style choice_button is menu_button:
		# ...

choice_buttons_vbox

Стиль vbox-контейнера для кнопок из предыдущего абзаца.

init -998:
	style choice_buttons_vbox is vbox:
		# ...

Фон для быстрого меню

См. gui.quick_buttons_bg и gui.quick_buttons_bg_without_window (по умолчанию - прозрачные изображения), а также gui.quick_buttons_top_indent (расстояние между быстрым меню и диалог-боксом).

init -998:
	style quick_buttons_bg is image:
		# ...

quick_buttons_hbox

Стиль hbox-контейнера для кнопок быстрого меню.

init -998:
	style quick_buttons_hbox is hbox:
		# ...

Кнопка быстрого меню

Находится в init-блоке с приоритетом -997, а не -998, т. к. в варианте по умолчанию кроме наследования от стиля menu_button здесь также есть взятие некоторых параметров из стиля quick_buttons_bg (ysize*).

init -997:
	style quick_button is menu_button:
		# ...

Далее ->
<- Назад

Основы
Если вы новичок, то будет достаточно прочитать лишь это, пока ваш энтузиазм не исчерпан.
Остальное можно будет прочесть по мере надобности.

  1. Быстрый старт!
  2. Основы команд и блоков.
  3. Простейшие примеры.
  4. Изображения.
  5. Музыка и звуки.

Документация по RPG-части находится здесь.


Более сложные вещи
Через некоторое время вам, возможно, потребуются более продвинутые возможности.

  1. Функции для изображений (im-функции).
  2. Эффекты.
  3. Времена суток.
  4. ATL (анимации и трансформации).
  5. Ввод с клавиатуры.
  6. Введение в ScreenLang (GUI, интерфейс).
  7. Конфигурирование игры.

Дополнительно


Перед самым началом
Советы для новичков и не только.


Оффтоп.

Clone this wiki locally