Здесь показаны различия между двумя версиями данной страницы.
Both sides previous revision Предыдущая версия Следущая версия | Предыдущая версия | ||
help:graphics [2013/11/13 17:23] newsash |
help:graphics [2024/10/14 12:30] (текущий) aleks_versus обновление 5.9.0 |
||
---|---|---|---|
Строка 1: | Строка 1: | ||
[[help:sound|Назад: Звук]] | [[help:sound|Назад: Звук]] | ||
- | =====Графика===== | ||
- | Поддерживаемые возможности графического оформления: | + | ====== Графика ====== |
- | * Картинки для действий. См. [[ACT]]. | + | |
- | * Картинки для элементов меню. См. [[MENU]]. | + | |
- | * Картинки для предметов в инвентаре. См. [[ADDOBJ]]. | + | |
- | * Фоновая картинка основного описания. См. [[$BACKIMAGE]]. | + | |
- | * Показ картинки в отдельном окне с помощью [[VIEW]]. | + | |
- | * Вставка картинок в любую часть текста (например, в основное описание) с помощью [[HTML]]-тега IMG. | + | |
- | Для действий, предметов и элементов меню изображения задаются при их добавлении. Рассмотрим подробнее, как "вставить картинку" в основное или дополнительное описание, а также в отдельное окно: | + | Возможности работы с графическими элементами в **QSP** существенно отличаются для разных версий плееров. В данном разделе будут перечислены основные возможности, реализованные в классическом плеере и **qSpider**. Внимательно читайте документацию к плееру, чтобы узнать, какие возможности он предоставляет. |
- | * Задать фон можно с помощью переменной $BACKIMAGE, в неё нужно записать путь к картинке. <sxh qsp> | + | |
- | $BACKIMAGE = 'content/back.png' | + | ===== Список основных возможностей ===== |
+ | |||
+ | ==== Установка картинки фоном в окно основного описания. ==== | ||
+ | |||
+ | Чтобы установить изображение фоном в окно основного описания, воспользуйтесь системной переменной ''%%$BACKIMAGE%%'': | ||
+ | |||
+ | <sxh qsp> | ||
+ | $backimage = 'image/picture.png' | ||
</sxh> | </sxh> | ||
- | * Оператор VIEW позволяет показать картинку в отдельном окошке. <sxh qsp> | + | |
- | VIEW 'content/monster.png' | + | Подробнее об использовании системной переменной ''%%$BACKIMAGE%%'' можно почитать в разделе [[help:main|"Окно основного описания"]]. |
+ | |||
+ | ==== Вывод изображения в отдельном окне. ==== | ||
+ | |||
+ | Чтобы вывести изображение в отдельном окне, которое называется "**Окно предпросмотра**", используйте оператор ''%%VIEW%%'': | ||
+ | |||
+ | <sxh qsp> | ||
+ | view 'content/monster.png' | ||
</sxh> | </sxh> | ||
- | * Также мы можем закрыть окно, вызвав VIEW без параметров: <sxh qsp> | + | |
- | VIEW | + | Подробнее об операторе ''%%VIEW%%'' можно прочитать в разделе "**Операторы для работы с графической частью**" на данной странице ниже. |
+ | |||
+ | ==== Добавление иконки в пункт всплывающего меню. ==== | ||
+ | |||
+ | Чтобы добавить иконку к пункту всплывающего меню, необходимо прописать путь к файлу иконки при заполнении массива, отвечающего за формирование пунктов меню: | ||
+ | |||
+ | * Для массива кортежей третьим значением в кортеже: <sxh qsp> | ||
+ | ! нет иконки | ||
+ | %usr_menu[0] = ['Взять предмет','take_item'] | ||
+ | ! иконка задана gif-файлом | ||
+ | %usr_menu[1] = ['Положить предмет','put_item','images/put_item.gif'] | ||
</sxh> | </sxh> | ||
- | * Для того, чтобы вставить картинку в основное или дополнительное описание, можно использовать [[HTML]] и тег "IMG". Это самый распространенный способ. <sxh qsp> | + | * Для массива строк — через двоеточие после названия локации-обработчика пункта меню: <sxh qsp> |
- | ! Включаем режим HTML. Если во всей игре используется HTML, | + | ! нет иконки |
- | ! то достаточно включить его на самой первой локации. | + | $usr_menu[0] = 'Взять предмет:take_item' |
- | USEHTML = 1 | + | ! иконка задана gif-файлом |
- | ! Выводим картинку в основное описание | + | $usr_menu[1] = 'Положить предмет:put_item:images/put_item.gif' |
- | '<img src="content/room.jpg">' | + | |
- | ! Выводим картинку в доп. описание | + | |
- | PL '<img src="content/map.jpg">' | + | |
</sxh> | </sxh> | ||
- | * Для того, чтобы выровнять такую картинку "по центру", можно воспользоваться тегом "CENTER": <sxh qsp> | + | |
- | '<center><img src="content/room.jpg"></center>' | + | Подробнее о добавлении иконок к пунктам меню можно почитать в разделе [[help:menu|"Меню"]]. |
+ | |||
+ | ==== Добавление картинки к действиям ==== | ||
+ | |||
+ | Чтобы добавить картинку к действию, не изменяя фактического названия действия, нужно прописать путь к изображению вторым параметром к оператору ''%%ACT%%''. | ||
+ | |||
+ | <sxh qsp> | ||
+ | ! действие в многострочной форме записи, с изображением | ||
+ | act "Сорвать арбуз с куста", "img/watermelon.png": | ||
+ | арбуз += 1 | ||
+ | *pl "Вы сорвали арбуз с куста" | ||
+ | end | ||
</sxh> | </sxh> | ||
- | ====Операторы:==== | + | Подробнее об операторе ''%%ACT%%'' можно прочитать в разделе [[help:acts|"Действия"]]. |
+ | |||
+ | ==== Добавление картинки к предмету в инвентаре ==== | ||
+ | |||
+ | Чтобы добавить картинку к предмету в инвентаре, не изменяя фактического названия предмета, нужно прописать путь к изображению вторым параметром к оператору ''%%ADDOBJ%%''. | ||
+ | |||
+ | <sxh qsp> | ||
+ | ! добавляем предмет с картинкой в конец списка | ||
+ | addobj 'Гаечный ключ','image/wrench.png' | ||
+ | </sxh> | ||
+ | |||
+ | Подробнее об операторе ''%%ADDOBJ%%'' можно прочитать в разделе [[help:objs|"Предметы (инвентарь)"]]. | ||
+ | |||
+ | ==== Вставка картинок в любую часть текста с помощью HTML ==== | ||
+ | |||
+ | Вы можете вставлять изображения в любую часть текста, используя HTML-тег ''%%<img>%%'' при включённом режиме распознавания HTML. | ||
+ | |||
+ | Примеры: | ||
+ | |||
+ | <sxh qsp> | ||
+ | ! включаем режим распознавания HTML | ||
+ | usehtml=1 | ||
+ | ! вывод изображения в окно основного описания: | ||
+ | *p '<img src="images/pic_01.png">' | ||
+ | ! вывод изображения в окне дополнительного описания: | ||
+ | p '<img src="icons/note_btn.ico">' | ||
+ | </sxh> | ||
+ | |||
+ | Так же есть возможность вставлять изображения в названия действий и предметов с помощью HTML. | ||
+ | |||
+ | <sxh qsp> | ||
+ | ! добавляем предмет с картинкой в названии | ||
+ | addobj '<img src="res/ico/back_arrow.png"> Назад...' | ||
+ | ! добавляем действие с картинкой в названии | ||
+ | act "Улыбнуться <img src=""res/emoji/smile.gif"">": goto 'smile' | ||
+ | </sxh> | ||
+ | |||
+ | **Обратите внимание!** При этом фактически изменяются названия действий и предметов. Например, при выборе действия "Назад..." в окне предметов ''%%$SELOBJ%%'' будет возвращать не только слово "''%%Назад...%%''",а всю строку "''%%<img src="res/ico/back_arrow.png"> Назад...%%''". | ||
+ | |||
+ | С помощью HTML можно вставлять изображения в модальные окошки ''%%MSG%%'' и ''%%$INPUT%%''. Следует учитывать, что при этом окошко выводится в определённом размере, и если изображение окажется по размеру больше окошка, то появятся полосы прокрутки. | ||
+ | |||
+ | <sxh qsp> | ||
+ | ! выводим изображение в окне сообщения | ||
+ | msg '<img src="res/message/error.png">' | ||
+ | ! выводим изображение в окне ввода | ||
+ | $name = $input('Введите своё имя? <img src="res/face/elph.jpg">') | ||
+ | </sxh> | ||
+ | |||
+ | Более подробно о возможностях HTML читайте в соответствующем [[help:html|разделе]]. | ||
+ | |||
+ | ===== Операторы для работы с изображениями ===== | ||
+ | |||
+ | * ''%%VIEW%%'' — выводит на экран указанное изображение. В классическом плеере изображение выводися в отдельном окошке (окно предпросмотра). Общая запись: <sxh qsp> | ||
+ | VIEW [$путь к графическому файлу] | ||
+ | </sxh> , где ''%%[$путь к графическому файлу]%%'' — путь к файлу картинки. Если параметр ''%%[$путь к графическому файлу]%%'' отсутствует, или задан как ''%%""%%'' (пустая строка), окно предпросмотра закрывается. Примеры: <sxh qsp> | ||
+ | ! выводим изображение в окне предпросмотра | ||
+ | view 'content/monster.png' | ||
+ | ! закрываем окно предпросмотра | ||
+ | view '' | ||
+ | ! закрыть окно предпросмотра можно и так | ||
+ | view | ||
+ | </sxh> | ||
+ | |||
+ | ===== Пути к графическим файлам ===== | ||
+ | |||
+ | Пути к графическим файлам указываются относительно файла игры. Например, если файл игры лежит по адресу "''%%D:\QSP\game\game.qsp%%''", а картинка - по адресу "''%%D:\QSP\game\content\picture.jpg%%''", то путь нужно указывать, как "''%%content/picture.jpg%%''". | ||
+ | |||
+ | Это не зависит от того, где именно вы хотите вывести изображение: | ||
+ | |||
+ | <sxh qsp> | ||
+ | *p "<img src=""content/picture.jpg"">" | ||
+ | |||
+ | addobj "Контент","content/picture.jpg" | ||
+ | |||
+ | view 'content/monster.gif' | ||
+ | </sxh> | ||
+ | |||
+ | ===== Поддерживаемые форматы изображений ===== | ||
+ | |||
+ | * Классический плеер поддерживает большинство распространнных форматов: ''%%.jpg%%'', ''%%.png%%'', ''%%.bmp%%'', ''%%.gif%%'', ''%%.ico%%''. | ||
+ | * **qSpider** поддерживает все форматы изображений, которые поддерживает современный браузер, в т.ч. и "''%%svg%%''". | ||
- | * **REFINT** - принудительное обновление интерфейса | + | [[help:interface|Вперёд: Настройки интерфейса]] |
- | * **VIEW** //[$путь]// - просмотр картинки из указанного файла. | + | |
- | * Если вместо //[$путь]// указана пустая строка ('') или параметр не указан, то это скроет окно с картинкой. | + | |
- | ---- | ||
- | [[help:fonts|Вперёд: Шрифты]] |