Войти на сайт
×
ТЕМА: Графические карты в Ren'py.
Графические карты в Ren'py. 12 года 8 мес. назад #51172
          |
В этой статье я расскажу, как сделать на движке Ren'py графические карты. Но, для начала, нужно пояснить, что это вообще такое.
Графическая карта (англ. image map) – это изображение с несколькими активными областями, то есть один рисунок содержит несколько участков. В зависимости от того в какую область картинки кликнет пользователь могут совершаться те или иные действия. Что такое Ren'py, надеюсь, объяснять не надо. На этом движке у меня есть две готовой игры, одна из которых как раз использует нижеописанный принцип. Это игра про котёнка. Стрелочки перехода там сделаны именно таким способом. При наведении на них появляются подписи, а при клике на нужную стрелку попадаем на другой экран. Но мы будем рассматривать это на другом примере. КrisM помог справиться мне с графическими картами. Он прислал мне несложную демку-сюрприз, в которой всё доступно объяснил и показал. Этот материал очень помог мне при разработке, и, я надеюсь, что пригодится и читателям. С чего начать. Для того, чтобы сделать такую вот кликабельную картинку, нужно в первую очередь создать два изображения. Одно из них будет основным, а второе - как бы изнанкой. Оно будет проявляться только при наведении на него. Там мы можем сделать подписи, подсветку и прочее на ваше усмотрение.  Здесь в примере использована картинка из "Летучего корабля".  Второй вариант вы в игре вряд ли, правда, найдете. Он сделан для демонстрации работы этого метода. Теперь открываем скрипт и первым делом нужно объявить используемые изображения. А именно: init: # Объявляем первый фон. Второй объявлять не обязательно,
# т.к. напрямую он использоваться не будет. image fon1 = "fon1.jpg"Хитрая конструкция. А вот теперь переходим к самой конструкции. Она снабжена подробными комментариями от КrisM, где что происходит. label start:
label izba: # Ставлю метку на начало сцены в избе.
# Все эти цифры в конструкции - координаты.
# Координаты хотспотов - невидимых активных зон -
# икс-игрек левой верхней точки прямоугольника,
# затем икс-игрек правой ниженй - всего 4 цифры.
# При наведении мыши на хотспот "просвечивает" второй фон,
# причем только та часть, которая ограничена координатами.
# Так можно сделать предметы, "оживающие" под курсором мыши.
# После координат задаем метку, на которую будем переходить по клику на хотспот.
# Координаты в пикселях удобнее смотрять прямо в фотошопе.
# Слишком большими хотспоты не делай, неаккуратно получится...
# Сначала получаем результат клика - $ result = renpy.imagemap("fon1.jpg", "fon2.jpg", [
(160, 40, 275, 110, "ivan"),
(115, 165, 190, 235, "sapogi"),
(193, 235, 252, 313, "babka"),
(320, 172, 480, 255, "bratya"),
(520, 105, 616, 190, "dver"),
(560, 207, 617, 304, "ded")
])
# Внимание - не теряй нужные закрывающие скобки!
 От себя добавлю, что для отлавливания координат нужных областей можно использовать также Paint. Понимаю, что если областей много, то занятие вылавливания каждой точки весьма утомительно. Ну, ничего не поделаешь, нужно набраться терпения. После того, как каждой области задали метку, например, мы кликнули на область, огороженную х1=193, y1=235, x2=252,y2= 313, что соответсвует метке "бабка". В результате у нас подсвечивается область с подписью "бабка" из изображения fon2. Метки и реакция. Для того, чтобы была еще и реакция при наведении, пойдем дальше. Прямо после того кода пишем этот код: # Теперь проверяем получившися результат и переходим - if result == "ivan":
jump ivan
elif result == "sapogi":
jump sapogi
elif result == "babka":
jump babka
elif result == "bratya":
jump bratya
elif result == "dver":
jump dver
elif result == "ded":
jump ded
#Кстати, имя результата и имя метки необязательно одинаковы. label ivan: scene fon1
"Иван" "А это я! Главный герой!"
jump izba label sapogi: scene fon1
"Иван" "А зачем мне их надевать? Я лучше на печи полежу!"
jump izba
label babka: scene fon1
"Бабка" "Перестань тыкать в пожилую женщину! Хулиганьё..."
jump izba
label bratya: scene fon1
"Братья" "Настоящие герои этой сказки - мы. Зачем про дураков игры делать?"
jump izba
label dver: scene fon1
"Дверь" "Ну а я-то тут причем?! Стою, никому не мешаю..."
jump izba
label ded: scene fon1
"Дед" "(молчит)"
jump izbaЗдесь мы для каждого варианта задали свою метку, а потом в зависимости от этого переходим в нужное место и там же совершаем нужное нам действие. В данном случае мы выводим текст на экран. А потом переходим к метке izba, то есть на начало. И можем дальше сколько хочется кликать. Заключение. Вот, собственно, и всё. ^_^ |
  |
