В прошлой части мы познакомились с текстурными координатами и научились проводить ориентированные на них операции. Но координаты эти позволяют не только устанавливать зоны воздействия, но и непосредственно влиять на структуру изображения. Говоря проще, мы может не просто задать ту область, в которой будут происходить изменения, но и влиять на положение части текстуры.
Всевозможные искажения – еще одна основная возможность шейдеров, позволяющая добиваться весьма интересных эффектов. Давайте перейдем от слов к делу и попробуем сотворить что-нибудь этакое.
Для примера, попытаемся увеличить часть изображения, создав своеобразный эффект лупы. Здесь, нам бы пригодились всяческие формулы из курса геометрии и физики, но, скажу честно, мне было лень копаться в этом. Потому, результат был получен исключительно экспериментальным путем, который основывался на моем понимании поставленной задачи. Думаю, для ознакомления с работой текстурных координат этого будет достаточно.
Вновь создадим новый шейдер и перейдем на вкладку Fragment. Так как наша лупа будет привязана к координатам мыши, то вспомним, что мы делали в подобной ситуации в прошлый раз. Каких-то дополнительных пояснений тут не требуется. Создадим две переменные, которые будут хранить координаты мыши:
Код
uniform float xMouse; uniform float yMouse;
Теперь перейдем в функцию main() и начнем творить наш шейдер. Давайте подумаем, что нам понадобиться для достижения поставленной задачи. Первое, что нужно, это получить текущие текстурные координаты:
Код
vec2 Coord = v_vTexcoord;
Далее, определим координаты центра лупы и зададим ее радиус:
Код
vec2 Center = vec2(xMouse,yMouse); float rad = 0.2;
Как видите, центр, для удобства, мы будем хранить в 2-компонентном векторе Center. Ну а пояснять, что центром лупы будут являться координаты мыши, думаю, не стоит. Для хранения радиуса создаем новую переменную rad, я выбрал значение радиуса 0.2 (не забывайте, что вся текстура у нас располагается в диапазоне от 0 до 1).
Как и в прошлой части, нам нужно знать, будет ли текущая координата входить в зону покрытия лупы. Но на этот раз мы не будем применять геометрических формул, а воспользуется встроенной функцией distance(), которую предоставляет шейдер. Зная расстояние от центра лупы до текущей точки, мы можем легко определить, входит ли точка в радиус охвата лупы. Функция distance() как раз служит для того, чтобы определить расстояние между двумя точками. Сохраним это расстояние в переменную dist:
Код
float dis = distance(Coord, Center);
Далее, составим условие попадания текущей координаты под лупу:
Код
if (dis < rad + 0.1) { …………… }
Получается, если дистанция от центра до текущей точки меньше заданного радиуса, то точка попадает в окружность лупы. Как видите, к радиусу я добавил 0.1, сделано это исключительно по моей прихоти, для достижения более качественного эффекта. Вы так же можете экспериментировать. Теперь перейдем к самому главному – увеличение. Для этого нам понадобится вот такая нехитрая конструкция:
Код
Coord = Coord - (Coord - Center)/0.2;
Останется только вывести текстуру с новыми текстурными координатами, а так же вывести исходные координаты, не попадающие под лупу. Общий код будет иметь следующий вид:
Остается создать текстуру с размерами 2 в степени N, установить галочку [b]Used for 3D[/b] и назначить ее объекту. У объекта в событии [b]Draw[/b] пишем уже знакомые нам строки:
Код
var xM = shader_get_uniform(shader0,"xMouse"); var yM = shader_get_uniform(shader0,"yMouse");
Если теперь запустить приложение и проверить работу шейдера, то мы увидим, что часть текстур под лупой действительно увеличилась, но отсутствует эффект выпуклости, свойственный подобной оптике. Что такое эффект выпуклости, говоря простым языком?! Это зависимость размера текстуры от удаления текущей точки от центра. Центр у нас есть, текущую точку мы получить можем, давайте сформируем зависимость. Для этого в шейдере пропишем следующее:
Код
float d = (rad - dist)/2.0;
Если рассудить логически, то мы увидим, что d будет тем больше, чем ближе текущая точка к центру. Так как полученное значение для нашего эффекта будет чрезмерно большим, мы делим его на 2.0.
Остается только использовать данную зависимость в построении новых координат:
Код
Coord = Coord - ((Coord - Center)/0.2) * d;
Вот, что получается в итоге для формирования нашего импровизированного эффекта лупы:
Код
if (dist < rad + 0.1) { float d = (rad - dist)/2.0; Coord = Coord - ((Coord - Center)/0.2) * d; gl_FragColor = texture2D(gm_BaseTexture, Coord); }
Можно запускать и наслаждаться результатом. У меня это выглядит вот так:
Также если вы считаете, что данный материал мог быть интересен и полезен кому-то из ваших друзей, то вы бы могли посоветовать его, отправив сообщение на e-mail друга:
Игровые объявления и предложения:
Если вас заинтересовал материал «Game Maker Studio: Шейдеры (Часть 4)», и вы бы хотели прочесть что-то на эту же тему, то вы можете воспользоваться списком схожих материалов ниже. Данный список сформирован автоматически по тематическим меткам раздела.
Предлагаются такие схожие материалы:
Если вы ведёте свой блог, микроблог, либо участвуете в какой-то популярной социальной сети, то вы можете быстро поделиться данной заметкой со своими друзьями и посетителями.
))) Ну я написал в начале: "Здесь, нам бы пригодились всяческие формулы из курса геометрии и физики, но, скажу честно, мне было лень копаться в этом. Потому, результат был получен исключительно экспериментальным путем, который основывался на моем понимании поставленной задачи." Так что, как уже сказал Fade, дерзайте и сделайте, чтобы было похоже )
1
И да, спасибо за урок. :3 
Все таки, нужно было каждое слово "лупа" брать в кавычки ))
на лупу не совсем похоже 
Почему? 
