Renpy как сделать меню свое
Зарегистрированный пользователь может оставлять отзывы, оценивать статьи и решать задачи на курсе. В дальнейшем пользователи смогут делиться и своим контентом.
—> Приключения —> —> Фантастика —> —> Комедии —> —> Ужасы —> —> 2020 —> —> 2019 —> —> 2018 —> —> 2017 —> —> 2016 —> —> 2015 —> —> —> —> —> —> 5.0 —> —> —> —> —> —> 4.0 —> —> —> —> —> —> 3.5 —> —> —> —> —> —> 3.0 —> —> —> —> —> —> 2.5 —>
Популярные новеллы
Lucy — The Eternity She Wished For

The House in Fata Morgana

Princess Evangile

Перезапись
Изменение меню в RenPy
Время на чтение:
Автор статьи:
Наверное, при первом запуске своей новеллы вы заметили невзрачные и одноцветные фоны главного меню, меню с настройками и т.д. Если вы еще не разобрались, как это исправить, то сейчас самое время. Разберемся, как заменить встроенное изображение на своё или же вовсе нарисуем весь внешний вид новеллы с нуля.
Изменение изображения в главном меню
Изменение картинки в главном меню делается очень просто: необходимо поместить нужное изображение в папку с файлами графического интерфейса. Рассмотрим подробнее.
В корневой папке “game” проекта RenPy есть папка gui. В этой папке находятся изображения с названием “main_menu” и “game_menu” (если вы их не удаляли и не меняли настройки проекта в файле “options.rpy”). Это и есть изображения главного меню и меню игры в целом.

Посмотрите разрешение изображений через свойства файла или любым другим удобным способом. Это разрешение соответствует тому, которое вы выбрали при создании проекта.

Самый простой способ изменения картинок — просто заменить их на свои с таким же разрешением. Но есть еще один момент: по дефолту RenPy выводит название игры поверх фона. Если оно вам мешает, то это можно поправить через файл “options.rpy”.
Находим строчку следующую строчку и меняем True на False.
define gui.show_name = True
Создание своего меню
Для начала рассмотрим изменение первичного дизайна новеллы, который предлагает сам RenPy. В той же папке gui есть еще несколько подпапок. Одна из них называется “overlay”. Эти изображения накладываются поверх фонов.

Если изображения кажутся слишком темными или наоборот слишком светлыми, то их запросто можно отредактировать в редакторе Gimp или в фотошопе (или в любом другом привычном редакторе). Можно поменять прозрачность, добавить изображениям контраста или вовсе заменить их на свои (с учетом разрешения экрана игры).
Далее можно поменять шрифт в меню, а именно: его цвет. Заходим в файл gui.rpy и ищем строчку:
define gui.idle_color
Это не выделенные пункты меню. После знака равенства пишем любой подходящий цвет в шестнадцатеричном формате.
Есть вариант полностью перерисовать меню игры под себя: если вы хорошо рисуете или у вас есть дизайнер, то подготовьте все нужные экраны, изображения кнопок, боковых панелей и т.д. Узнать список всех необходимых файлов можно из созданного проекта в RenPy: внимательно изучите папку gui, просмотрите вложенные папки. Определите, какие изображения за что отвечают. Узнать это можно из названия картинок и опираясь на официальный гайд по изменению интерфейса.
Рассмотрим вариант изменения главного меню с созданием своих кнопок.
Для этого необходимо подготовить фоновое изображение меню, изображение с пунктами меню (без фона) и изображение с выделенными пунктами меню (как будто бы на них наведена мышка).

Пример фонового изображения

Пример изображения с пунктами меню

Пример выделенных пунктов меню
! У вас должен быть не серый фон, а прозрачный. Скачать картинки из примера можно будет в конце статьи.
Далее все три изображения перемещаем в папку “gui”. Изображение с фоном можно назвать “main_menu”, с кнопками “menu_normal”, с подсвеченными кнопками “menu_hover”. Чтобы настроить отображение своего меню заходим в файл screens.rpy и находим раздел screen main_menu(). В этом блоке можно смело всё удалить, оставив лишь tag menu.
screen main_menu(): tag menu
Воспользуемся объектом imagemap, у которого можно указать фоновое изображение (ground), изображения с кнопками (idle и hover).
screen main_menu(): tag menu imagemap: ground "gui/main_menu.png" idle "gui/menu_normal.png" hover "gui/menu_hover.png"
Но надо еще указать координаты для каждой кнопки, потому что мы задали по одному изображению и RenPy думает, что у нас есть одна большая кнопка на весь экран: исправить это можно через hotspot, указав ему стартовую координату кнопки, её ширину и высоту.
screen main_menu(): tag menu imagemap: ground "gui/main_menu.png" idle "gui/menu_normal.png" hover "gui/menu_hover.png" hotspot(x, y, width, height)
Посмотреть эти координаты можно в графическом редакторе. Когда вы водите мышкой по экрану, то по краю изображения можно найти числа в пикселях или увидеть координаты в отдельном меню (например, в фотошопе стоит зайти в “Окно”>”Навигатор” и выбрать вкладку “Инфо”).

Необходимо определить координаты (это и есть x и y) левого верхнего угла каждой кнопки. Высоту можно определить при помощи разницы координаты Y нижнего левого угла кнопки и ее верхнего левого угла. Ширину аналогично при помощи разницы координаты X правого верхнего угла и левого верхнего угла.
Отлично, мы нашли кнопку на экране. Осталось определить, что эта кнопка будет делать при помощи action. Action бывают следующие: Start — для запуска игры, ShowMenu — для показа какого-то конкретного меню, Quit — выход из игры. Действиям можно передавать параметры: название меню или флаг, который будет указывать на подтверждение выхода из игры.
Вот как это выглядит в коде:
screen main_menu(): tag menu imagemap: ground "gui/main_menu.png" idle "gui/menu_normal.png" hover "gui/menu_hover.png" hotspot(30, 150, 240, 60) action Start() hotspot(30, 240, 320, 80) action ShowMenu("load") hotspot(30, 320, 330, 80) action ShowMenu("preferences") hotspot(30, 400, 250, 80) action ShowMenu("about") hotspot(30, 610, 220, 60) action Quit(confirm=True)
Теперь все кнопки будут вести на нужные экраны. Но есть одна проблема: экраны настроек, сохранений, помощи будут выглядеть как прежде. А всё дело в том, что все они настраиваются отдельно друг от друга, но по тому же принципу, что был рассмотрен в этой статье. Так что вы можете полностью перерисовать внешний вид своей новеллы до неузнаваемости, главное запастись красивыми изображениями и разобраться во всех экранах.
С дальнейшей кастомизацией помогут официальный гайд и многочисленные видео на YouTube.
Дата публикации: Окт. 25, 2022
Renpy как сделать меню свое
Приветствую в данном руководстве опытных и не очень мододелов. В данном руководстве написано, как создать собственное меню и дополнения к нему в своём моде.
- https://steamcommunity.com/sharedfiles/filedetails/?id=690911411
- https://steamcommunity.com/sharedfiles/filedetails/?id=1734251131

1

1
В избранное
В избранном
Поделиться
Этот предмет добавлен в избранное.

AkkuChan
Не в сети
24 сен. 2022 в 22:25
28 мая в 7:45
| 751 | уникальных посетителей |
| 100 | добавили в избранное |
Оглавление руководства


Предисловие

Плавное начало мода и появление меню в целом

А что насчёт собственного меню? Способ первый.

А что насчёт собственного меню? Способ второй.

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

Подробнее про action

Ещё немного про меню

Позиционирование

Галерея изображений. 1 Способ

Галерея изображений. 2 способ

Музыкальная комната

Послесловие


Комментарии
Предисловие
Не хочется, чтобы данное руководство послужило толчком в появлении модов с меню, состоящим из кнопок «начать» и «выйти». Меню должно иметь практическую пользу, а не чтобы было. Это всё моё мнение, прислушиваться к нему или нет — решать вам. Решил выговориться заранее. А теперь к руководству!
Руководство дополняется в свободное время, так что иногда некоторые разделы могут быть незаконченными некоторое время.
Плавное начало мода и появление меню в целом
Перед началом создания меню хотелось бы рассказать про плавный старт мода, т.е. плавное затухание меню выбора модов и плавное появление начала вашего мода.
Для этого вам надо всего-лишь начать мод с этих строк:
label NAME: scene bg black with dissolve # вызываем переход на всё, что сейчас на экране, а не только на фон # далее просто вызываем screen нашего меню call screen MENU with dissolve
Довольно простая вещь, однако многие её не используют.
Кстати, именно так и появляется ваше меню. NAME в label — это то, что вы указывали в mods:
С лейбла NAME и начинается ваш мод, этакая точка входа. С неё и перебрасывайте на меню.
А что насчёт собственного меню? Способ первый.
Меню можно сделать двумя способами. Либо через imagemap, либо через imagebutton. Ну, хотя можно сделать и так и так одновременно. Пойдём по порядку.
В Imagemap нам необходимо три картинки (можно и больше, об этом позже). Фон, неактивные кнопки и активные кнопки. (фон и неактивные кнопки при желании можно сделать одним изображением). Ренпай, при наведении на кнопку, будет «вырезать и вставлять» активную кнопку в местоположение неактивной.
Предположим, вы работаете в Photoshop’е и сделали эти самые картинки. Теперь нам нужны некоторые данные, записывайте их или запоминайте. Находим левый верхний угол вашей картинки, предположим, у меня это будет 256 по оси X и 72 по оси Y. Теперь вычисляем правый нижний угол, пусть у меня он будет 510 по X и по Y 121. Теперь мы вычитаем из них первые числа, т.е. 510-256=254 и 121-72=49. Записываем или запоминаем Левый верхний угол и разницу правого угла и левого. Т.е. (256, 72, 254, 49) (Именно так координаты и записываются в кнопку imagemap)
Но как обозначить кнопку в коде? За это у нас отвечает оператор hotspot.
screen MENU: tag menu imagemap: ground «background.jpg» idle «buttons_idle.png» hover «buttons_hover.png» hotspot (256, 72, 254, 49) action Call(«START», transition=dissolve)
Теперь давайте разберёмся с вышенаписанным:
- Мы создаем экран MENU (название заменить);
- tag не дает нам накладывать части экранов друг на друга, то есть, если у нас есть два экрана с одним тегом, то при появлении, второй заменит первый. Также мы можем скрывать по тегу экраны;
- ground — это наш фон. Указываем в кавычках путь к изображению, к фону или просто пишем уже объявленное изображение (тоже в кавычках);
- idle — это наши неактивные кнопки, тоже указываем путь;
- hover — активные кнопки. Указываем путь;
- hotspot — наша кнопка, в скобках указываем координаты, которые получили ранее.
Но что же такое action? А это как раз таки действия, которые будет выполнять игра при нажатии на кнопку. Есть множество действий, но я распишу лишь некоторые в другом отделе (ибо action работает и в imagebutton и в imagemap), чтобы не повторяться.
А что насчёт собственного меню? Способ второй.
И вот мы добрались до второго способа, а именно imagebutton. Этот способ позволяет нам объявлять каждую кнопку отдельным изображением. Т.е. нам нужно как минимум по два изображения на кнопку, неактивная и активная. Давайте объявим её:
screen MENU: tag menu add «background.png» # добавляем наш фон imagebutton: # тут мы можем прописать как отдельно двумя строчками, так и одной
# Двумя это выглядит так: idle «button_idle.png» hover «button_hover.png # а чтобы объявить одной строкой, нам надо, чтобы наши картинки оканчивались на _idle и _hover соответственно auto «button_%s» # Далее указываем позицию нашей кнопки, подробнее об этом в разделе Позиционирование xpos 256 ypos 72 action Call(«START», transition=dissolve)
Заметили, что мы использовали add? Небольшое отступление, оператор add позволяет нам добавлять что-то на screen, например изображение.
В данном случае мы указываем только одну точку, нам не нужна длина и высота кнопки.
Главное преимущество этого метода — возможность заменить кнопку, не меняя всё меню в фотошопе.
Про action будет наш следующий раздел.
Кстати про кнопки
Если в вашем меню кнопки — это просто текст, то нет нужды для этого делать их изображениями, ведь можно использовать textbutton. Всё, что нам надо для этого, это шрифт, его размер в пикселях и положение. Положение текстовой кнопки работает так же, как и imagebutton.
textbutton «Здесь может быть ваша кнопка»: xpos 256 ypos 72 text_idle_color «#fff» text_hover_color «#aaa» text_size 30 text_font «font.ttf» action Call(«START», transition=dissolve)
textbutton, как и imagebutton, можно прописывать как блоком, так и в строку, кому как больше нравится. То есть:
textbutton «Здесь может быть ваша кнопка» xpos 256 ypos 72 text_idle_color «#fff» text_hover_color «#aaa» text_size 30 text_font «font.ttf» action Call(«START», transition=dissolve)
Но блоком смотрится приятнее и читается понятнее.
Но ранее говорилось об ещё каких-то картинках для кнопок, так вот. Если в вашем меню, при переходе на другой экран, остаются элементы предыдущего, то можно использовать картинки selected_idle и selected_hover. Т.е., при нажатии на данную кнопку, эта кнопку останется выделенной, пока выполняемое ею действие активно. Если вы вызываете какой-то экран с данными операторами, то вместо Show нужно использовать ToggleScreen:
screen MENU: imagemap: ground «background.jpg» idle «buttons_idle.png» hover «buttons_hover.png» selected_idle «buttons_selected_idle.png» selected_hover «buttons_selected_hover.png» hotspot (256, 72, 512, 432) action ToggleScreen(«GALLERY», transition=dissolve)
Но если вы хотите, чтобы несколько экранов были на экране, но нажимался только текущий, то пропишите в этом экране modal True.
screen GALLERY: tag menu modal True
Подробнее про action
Нам нужны кнопки, чтобы они что-то делали. Ниже я выписал одни из самых важных действий, которые понадобятся в каждом меню (или почти в каждом)
- Call(label, *args) — завершает текущий оператор и вызывает label. В аргументах может принимать transition, т.е. каким будет переход от оператора к Лейблу.
- Show(screen, *args) — приводит к отображению другого экрана. screen – строка, в которой указано имя экрана. Также принимает transition
- Hide(screen, transition=None) — приводит к тому, что экран с именем screen будет скрыт, если он показан. Принимает transition.
- Return() — возвращается к предыдущему действию. Крайне полезно, если ваше меню состоит из нескольких экранов. Этот оператор будет возвращать вас на предыдущий экран.
- NullAction() — кнопка, которая ничего не делает. Думаю тут понятно.
- With(transition) — оператор, который используется с другими операторами. Он задает плавность операторам, которые не принимают в себя transition. Например, Return(), MainMenu() и т.д.
- MainMenu() — возвращает нас в главное меню, т.е. в меню Бесконечного лета.
- Quit() — закрывает игру. Можем указать в скобках confirm=True, чтобы после нажания кнопки у нас вылезло окно подтверждения (ну та, где Юля сидит и спрашивает, хотим мы выйти или нет)
В action мы не ограничиваемся только одним действием, мы можем указать несколько через запятую. Они будут выполняться последовательно. Чтобы они выполнялись одновременно, мы просто берем все операторы в скобки, т.е.
action [MainMenu(), With(dissolve)]
Есть множество операторов, как например, задание значения переменной, произведение музыки и её остановка, условие, выполнение написанной вами python-функции и т.д.
Все они описаны в документации Ren’py: Тык [ru.renpypedia.shoutwiki.com]
Ещё немного про меню
В экранах мы можем прописывать не только imagemap, кнопки и так далее, мы также можем писпользовать таймер, python-блоки и условия.
default test_lv = None screen TEST: timer 2 action SetVariable(«test_lv», True) python: renpy.pause(2, hard=True) if test_lv: imagebutton: auto «button_%s» xcenter 0.5 ycenter 0.5 action NullAction()
Таймер позволяет нам выполнить какое-либо действие через какое-то время, например через две секунды. Отсчёт начинается с момента появления экрана.
В python-блоке мы можем вызывать и прописывать какие-либо функции, будь то написанные вами или имеющиеся изначально из Ренпая и написанные кодером Бесконечного лета.
Ну с условием, думаю, всё понятно.
Позиционирование
Как же указывать положение нашей картинки/кнопки? А всё просто.
Сперва определимся, как мы указываем аргументы. Есть два способа, по пикселям и через десятичные числа, где 0.0 до 1.0 — границы нашего экрана.
Первый способ по пикселям мы указываем положение по X от 0 до 1920 на ПК (на телефонах это до 1280) и до 1080 по Y (720 на телефонах).
Второй — от 0.0 до 1.0 (можно и меньше/больше, но тогда изображение будет выходить за рамки). Этот метод лучше, ибо при портировании на телефоны, нам не нужно париться с положением кнопок, но и высчитать положение сложнее.
Ренпай сам определяет, какое вы ему указываете значение.
Если у позиции в начале стоит x или y, то оператор перемещает по соответствующей оси (указывается одно значение)
a и b — ваши координаты
— pos(a, b), xpos a, ypos b. Изначально точка позиционирования изображения находится в верхнем левом углу изображения. Поэтому, при перемещении изображения с помощью pos, мы указываем положение именно верхнего левого угла. (например pos(0, 0) поставит изображение в левый верхний угол)
— center(), xcenter, ycenter Ренпай ставит точку позиционирования в центр изображения, т.е. вы переносите изображение за середину. (например center(0.5, 0.5) поставит изображение в центр)
Более подробно про позиционирование и ATL в целом Тут [www.renpy.org]
Галерея изображений. 1 Способ
Что же, вот и галерея изображений. Хотелось бы начать с того, что в Ренпае есть встроенная Галерея, с которой можно работать. И так же можно сделать простыми кнопками. Это всё одинаково просто.
Однако советую воздержаться от её использования, ибо с ней имеется ряд проблем, которые надо исправлять/учитывать.
Кратко расскажу про галерею простыми кнопками, ибо она делается так же, как и простые кнопки в меню, но с условием.
# для создания галереи с фонами, которые открываются только после их просмотра,
# создаём постоянную переменную default persistent.bg_1 = None # также для создания подобной галереи создаём переменную, в которую будет записываться текущий фон на экране,
# чтобы, нажав на фон, можно было его увеличить на весь экран. Если это не надо, то не пишем её default img_now = None # и затем ставим её истинное значение после просмотра фона в сценарии label START: scene bg bg_1 $ persistent.bg_1 = True screen GALLERY(): tag menu add «background.jpg» imagebutton: if persistent.bg_1: idle «bg_1_prev» #внимание, данный фон у вас изначально в 1920х1080, следовательно, здесь он будет такого же размера. Сделайте изображение меньше и вызывайте его, но в переменную суйте фон 1920х1080. в моём случае это заранее уменьшенный фон с припиской _prev xpos 210 ypos 101 # заталкиваем в переменную название нашего фона. Если вам не надо, чтобы фон увеличивался на весь экран, просто убери строчку ниже action SetVariable(«img_now», «bg bg_1»), Show(«screen_img_now», transition=dissolve) # данный экран нам нужен, чтобы вызвать изображение кнопкой. Если нажать на фон, то он исчезнет
# если вам не надо, чтобы фон открывался на весь экран, просто уберите этот screen screen screen_img_now: # делаем экран непрозрачным, чтобы случайно не тыкнуть что-нибудь ненужное modal True imagebutton: idle img_now xpos 0 ypos 0 action Hide(«screen_img_now», transition=dissolve)
Галерея изображений. 2 способ
И так, вместо простых кнопок можно использовать встроенную Gallery().
default persistent.bg_1 = None # для создания галереи с помощью встроенной функции Галереи, создаем объект Галереи в init python блоке init python: bg = Gallery() # так же мы можем указать, с какой планостью будут раскрываться изображения на большой экран bg.transition = dissolve # теперь добавляем сами кнопки, добавляем изображения. В моём случае фоны bg.button(«slot1») # slot1 — название нашей кнопки. Название может быть произвольным bg.image(«bg_1_prev») # Само изображение, которое будет кнопкой. Внимание, изображение не сжимается само, т.е. оно будет показываться в своём размере (как в предыдущем примере). bg.condition(«persistent.bg_1») # указываем условие, при котором наш фон будет отображаться # подобное используем для каждой кнопки галереи. Либо делаем автообъявление. # теперь делаем экран самой галереи screen GALLERY(): tag menu add «background.jpg» # Добавляем кнопку на экран. В первых кавычках указываем название кнопки, созданное ранее. Затем фон, который будет отображаться при открытии (1920х1080). locked — это то, что будет отображаться, пока кнопка недоступна. Ну и указываем положение кнопки. add bg.make_button(«slot1», «bg bg_1″, locked=»lock.png», xpos=210, ypos=101)
Музыкальная комната
Теперь давайте разберемся с музыкальной комнатой, в которой мы можем слушать музыку.
Для удобства всего этого желательно добавлять всю музыку в массив или список, как это реализовано в оригинале БЛ (music_list[«blow_with_the_fire»]. Массив music_list, «blow_with_the_fire» — элемент массива, который хранит путь к песне.)
Объявлять их можно тупо как:
init python: my_music = dict(); my_music[«music1»] = «music/music1.mp3» #или, например: music_list = dict() for mus in [«music1», «music2»]: my_music[mus] = «audio/music/» + mus + «.mp3»
Либо, что будет лучше и удобнее, делать автообъявление (об этом я когда-нибудь попозже расскажу в отдельном разделе Автообъявления)
Вообще, мы будем использовать ту же встроенную в Ренпай музыкальную комнату, в которой можно так же самому прописывать каждую строчку. Но зачастую, музыки намного больше, чем фонов, так что прописывать каждую строчку будет крайне муторно.
Предположим, у нас есть массив my_music. В нём есть несколько композиций. Нам нужно создать нашу MusicRoom.
#здесь мы задаём объект классу MusicRoom, в скобках которого можно указать плавность затухание и начала песни.
#далее делаем цикл, в котором добавляем в mr нашу музыку, которая всегда открыта. init python: mus = MusicRoom(fadeout=0.5, fadein=0.5) for i in my_music: mr.add(my_music[i], always_unlocked = True) #далее создаём экран нашей музыкальной комнаты screen MusicRoom(): tag menu #vbox позволяет нам указывать элементы экрана сверху вниз, не указывая положение каждого. Так же можно и слева направо, только вместо vbox будет hbox. Просто указываем количество пикселей между элементами в spacing.
#далее указываем положение нашего vbox’a, (мы так же можем указать и границы, дойдя до которых, элемент перенесется. Для этого указываем либо как в hotspot, только area(a, b, c, d). Или указываем длину по ширине в xmaximum и ymaximum. vbox: pos(500, 750) for i in my_music: spacing 5 textbutton i.replace(«_», » «) text_idle_color «#aaa» text_hover_color «#ccc» text_size 30 action mus.Play(my_music[i]) #Далее нам цикл прописывает каждую кнопку. Т.е. нам не надо 20-30 песен прописывать самим. Т.к. элементы mus и my_music одинаковы, то мы просто проигрываем необходимую нам песню из изначального массива.
Послесловие
Данное руководство было написано со скуки и чтобы скидывать его людям, которые не знают, как делать меню. Ранее была мысль сделать руководство, в котором бы рассказывалось о всяких разных фичах, функциях, способах, которые могут быть полезны мододелам. Например, Галерея изображений, Музыкальная комната, замена интерфейса, автообъявления изображений, звуковых файлов и так далее.
Если вам это интересно, пишите в комментариях, и я может быть их напишу и добавлю.
Если были совершены какие-нибудь ошибки в руководстве или у вас возникли проблемы при создании меню, пишите, помогу.
ТЕМА: Создание меню
Приветик всем :3
Я совсем недавно начала изучение движка Ren’Py и ещё плохо с ним знакома. Сейчас я делаю свою новеллу и передо мной встала задача сделать красивое меню, а то стандартное мне не нравится. Хотелось бы сделать что то вроде такого:
ВНИМАНИЕ: Спойлер! [ Нажмите, чтобы развернуть ] [ Нажмите, чтобы скрыть ]

Картинку сделать не проблема, а вот как сделать горизонтальные пункты меню да и ещё что бы свои картинки туда поставить.
Если вас не затруднит, объясните пожалуйста как сделать нечто подобное. Заранее спасибо :3
Последнее редактирование: 11 года 8 мес. назад от Kuro-chan.
Администратор запретил публиковать записи гостям.
Re: Создание меню 11 года 8 мес. назад #51199





Чтоб сделать горизонтальное меню, откройте скрипт (кнопка «Edit Script») и на строчке №190 во вкладке «screens.rpy», замените vbox на hbox.
Там же, на строчках 187 и 188, можно изменить положение блока меню на экране. Насколько понял, число после точки означает количество процентов. Т.е. значение 50, расположит меню по центру экрана.
Насчет меню из своей картинки. Выходит примерно так:
result = renpy.imagemap("main_menu.jpg", "main_menu.jpg", [ (0, 0, 114, 35, "start") (114, 0, 228, 35, "load") (228, 0, 342, 35, "preference") (342, 0, 456, 35, "help") (456, 0, 570, 35, "quit") ]) if result == "start": Start() elif result == "load": ShowMenu("load") elif result == "preference": ShowMenu("preferences") elif result == "help": Help() elif result == "quit": Quit(confirm=False)
Последнее редактирование: 11 года 8 мес. назад от Lekste.
Администратор запретил публиковать записи гостям.
За этот пост поблагодарили: Kuro-chan
Re: Создание меню 11 года 8 мес. назад #51218
Это в «options.rpy» вставлять нужно?
После этой строки?
Или я совсем ничего не понимаю :с
layout.button_menu()
У меня выглядит так:
######################################### # Планы ## Здесь активируется использование игрового меню ## ввыполненного из кнопок. layout.button_menu() $ result = renpy.imagemap("bg/main1.jpg", "bg/main2.jpg", [ (6, 550, 190, 579, "start"), (238, 550, 431, 579, "load"), (495, 550, 627, 579, "preference"), (705, 550, 784, 579, "quit"), ], focus="imagemap") if result == "start": Start() elif result == "load": ShowMenu("load") elif result == "preference": ShowMenu("preferences") elif result == "quit": Quit(confirm=False) #########################################
Выдает ошибку при проверке, говорит что синтаксическая ошибка.
Последнее редактирование: 11 года 8 мес. назад от Kuro-chan.
Администратор запретил публиковать записи гостям.
Re: Создание меню 11 года 8 мес. назад #51219
Нужно делать вот так:
# Планы ## Здесь активируется использование игрового меню ## ввыполненного из кнопок. layout.button_menu() init -2 python: layout.imagemap_main_menu("main1.jpg", "main2.jpg", [ (300, 250, 495, 270, "Start Game"), (300, 273, 495, 294, "Load Game"), (300, 298, 495, 318, "Preferences"), (300, 323, 495, 343, "Quit"), ]) #########################################
Lekste спасибо за идею с imagemap ^^
И да, кстати новое меню:
Renpy как сделать меню свое
Главное меню
Есть множество способов создания главного меню.
Рассмотрим пару из них.
1. Меню со своим фоном и созданием контейнера с однообразными кнопками. Почти то же, что и стандартное Ren’Py меню.
2. С использованием метода «Горячих точек» (ImageMap). Но добавление точек происходит иначе.
Метод первый: Создание контейнера с кнопками.
Нужно 3 вещи:
1. Фон
2. Пустая кнопка
3. Пустая наведённая кнопка.
Фон устанавливается стандартно, в options.rpy.
mm_root = «back.png»
А для создания кнопок нам желательно иметь 2 кнопки: обычную и наведённую (hover)

Обычная:

Наведённая:
Можно обойтись и одной кнопкой.
Заходим в screens.rpy и опускаемся до 174 строки, далее, если необходимо заменяем код.
screen main_menu:
# Это заменяет другие меню.
tag menu
# Фон главного меню.
window:
style «mm_root»
#Непосредственно кнопки
has vbox
textbutton _(«Новая игра») action Start():
area(50,10,310,70)
background «but.png»
hover_background «but_hover.png»
textbutton _(«Загрузка») action ShowMenu(«load»):
area(50,10,310,70)
background «but.png»
. hover_background «but_hover.png»
textbutton _(«Настройки») action ShowMenu(«preferences»):
area(50,10,305,70)
background «but.png»
hover_background «but_hover.png»
textbutton _(«Справка») action Help():
area(50,10,305,70)
background «but.png»
hover_background «but_hover.png»
textbutton _(«Выход») action Quit(confirm=False):
area(50,10,300,70)
background «but.png»
hover_background «but_hover.png»
textbutton — создание кнопки с текстом, который будет написан поверх неё..
action — действие, происходящее по клику.
area(50,10,305,70) — точки координат размещения кнопки и текста на ней.
Координаты:
Первая точка (50) — расположение кнопки по координате X.
Вторая точка (10) — расположение кнопки по координате Y.
Третья точка (300) — расположение надписи по координате X.
Четвёртая точка (70) — расположение надписи по координате Y.
background «but.png» — указывание обычной кнопки.
hover_background «but_hover.png» — указывание наведённой кнопки.
P.S. has vbox — создаёт контейнер с кнопками, все кнопки идут подряд сверху вниз. Количество кнопок может варьироваться.
Второй метод: Использование «Горячих точек» (ImageMap)
Как и в обычном ImageMap, нам нужно иметь 2 изображения:
1.Фон
2.С отличающейся областью наведения/выделения.

1.

2.
screen main_menu:
imagemap:
ground «mmo.png»
hover «mmh.png»
alpha True
hotspot (262, 117, 497, 68) action Start()
hotspot (314, 196, 447, 32) action ShowMenu(«load»)
hotspot (314, 238, 445, 32) action ShowMenu(«preferences»)
hotspot (298, 278, 463, 32) action Help()
hotspot (270, 318, 490, 32) action Quit(confirm=False)
P.S.S. Ниже, стандартно на 218 строке, необходимо удалить/исключить из кода следующие строки:
init -2 python:
style.mm_button.size_group = «mm»
ground «mmo.png» — обычное фоновое изображение.
hover «mmh.png» — изображение с отличающейся областью выделения.
alpha True — разрешает прозрачность (альфа-канал).
hotspot — создание новой «Горячей точки».
(262, 117, 497, 68) — координаты «Горячей точки». Вычисляются иначе, чем в обычном ImageMap.
action — действие, которое происходит, по клику на выделенную область (горячую точку).
Вычисление координат:
1.Закидываем изображения в папку game, можно создавать свои папки, но не выше game.
2.Заходим в Ren’Py .
3. Запускаем свой проект.
4. Нажимаем комбинацию клавиш Shift + D (раскладка должна быть на английском).

5. В Developer Menu жмём по Image Location Picker.
6. Выбираем любое из двух нужных изображений.

7. Выделяем нужную область. С верхнего левого угла, до нижнего правого.

8. И в отличие от обычного ImageMap, здесь нам необходимы все четыре точки с Rectangle

9. В итоге получим что-то, вроде (262, 117, 497, 68). Их и необходимо вписать в координаты точки.
10. Повторяем действия 7, 8, 9 для остальных горячих точек.
Но здесь чего-то не хватает. Попробуем добавить летающие полоски, а также какой-нибудь движущейся туман.
screen main_menu:
imagemap:
#Добавляем круг, и заставляем его крутится по часовой стрелки.
add «mm/poe4.png» at RotoZoom(0, 360, 10, 50, 1, 1, rot_repeat=True, rot_anim_timebase=True,
opaque=False, xalign=-0.07, yalign=0.18)
#Добавляем туманы и всякие полосочки, и прописываем им путь движения.
add «mm/mut11.png» at Move((3.0, 1.0, 1.0, 1.0),
(-2.0, 1.0, 1.0, 1.0),
50.0, repeat=True, bounce=True, subpixel=True )
add «mm/mut10.png» at Move((-0.1, 1.0, 1.0, 1.0),
(3.0, 1.0, 1.0, 1.0), 20.0, repeat=True, subpixel=True )
add «mm/mut8.png» at Move((-0.1, 1.0, 1.0, 1.0),
(3.0, 1.0, 1.0, 1.0), 15.0, repeat=True, subpixel=True )
add «mm/mut9.png» at Move((-0.1, 1.0, 1.0, 1.0),
(3.0, 1.0, 1.0, 1.0), 20.0, repeat=True, subpixel=True )
add «mm/mut6.png» at Move((-0.1, 1.0, 1.0, 1.0),
(2.0, 1.0, 1.0, 1.0), 20.0, repeat=True, subpixel=True )
add «mm/mut5.png» at Move((2.0, 1.0, 1.0, 1.0),
(-0.1, 1.0, 1.0, 1.0), 20.0, repeat=True, subpixel=True )
add «mm/mut4.png» at Move((2.0, 1.0, 1.0, 1.0),
(-0.1, 1.0, 1.0, 1.0), 12.0, repeat=True, subpixel=True )
add «mm/mut3.png» at Move((-0.1, 1.0, 1.0, 1.0),
(1.15, 1.0, 1.0, 1.0), 13.0, repeat=True, subpixel=True )
add «mm/mut2.png» at Move((-0.1, 1.0, 1.0, 1.0),
(2.0, 1.0, 1.0, 1.0), 13.0, repeat=True, subpixel=True )
add «mm/mut1.png» at Move((4.0, 1.0, 1.0, 1.0),
(-0.1, 1.0, 1.0, 1.0), 30.0, repeat=True, subpixel=True )
ground «mmo.png»
hover «mmh.png»
alpha True
hotspot (262, 117, 497, 68) action Start()
hotspot (314, 196, 447, 32) action ShowMenu(«load»)
hotspot (314, 238, 445, 32) action ShowMenu(«preferences»)
hotspot (298, 278, 463, 32) action Help()
hotspot (270, 318, 490, 32) action Quit(confirm=False)
Скриншоты:
P.S.S.S. При использовании второго метода, после первого запуска проекта, в папке game, создастся папка cache. В ней находятся вырезанные выделенный области. Если у вас не абсолютно прямоугольные области, файл, лежащий в данной папке можно подредактировать, стерев в нём всю область, которая лишняя в горячей точки.
К примеру я стёр области с левой стороны «кнопок», ибо они у меня не идеально-прямоугольные. В итоге получилась не прямоугольная область.
Но если бы я не отредактировал файл, было бы примерно так:

И помните, встречают по одежке, не игнорируйте главное меню. Это практически первое, что видит игрок, и оно является лицом вашей визуальной новеллы. Так что, создайте поистине уникальное и прекрасное главное меню.
