Как сделать спрайт прозрачным
Econ Dude
Страницы
среда, 12 июля 2017 г.
Как сделать прозрачность объектов в Game Maker
Для того чтобы сделать прозрачность объектов в Game Maker Studio любой версии используется функция «image_alpha» (прозрачность картинки).
Под этим понимается прозрачность спрайта, функция будет менять прозрачность.
Изначально значение прозрачности всех объектов установлено равным 1, это значит что объекты абсолютно непрозрачны. Вы можете менять данное значение от 0 (полная прозрачность, невидимость) до 1 (непрозрачный).
Кроме того объекты могут быть прозрачными на уровне спрайта, а так-же прозрачным может быть фон спрайта.
Вот несколько примеров которые помогут вам разобраться:
Это бывает удобно когда мы делаем маску коллизии (соприкосновения) и для того, чтобы фон такого спрайта не наезжал на другие объекты.
Сейчас почти все спрайты для игр делаются с прозрачным фоном.
Тут мы можем добавить спрайту прозрачность с помощью функции opacity (помутнение):
Если там стоит значение 150 и если мы хотим сделать непрозрачный спрайт наполовину прозрачным, то выкручиваем её до 75, в 2 раза.
Однако менять прозрачность самих спарайтов не обязательно, достаточно в самой игре менять их прозрачность с помощью функции:
Допустим в момент создания дерева (create event) мы добавляем код с прозрачностью:
На карте до запуска игры ваши деревья будут непрозрачными, но как только игра начнётся, они сразу получат прозрачность 50%. Примерно вот так:
Тут станет понятно зачем может быть нужна прозрачность в гейм мейкер студио, почти всегда это чисто визуальный момент. Например тут можно видеть как герой прячется за деревьями, при этом понятно что он там есть и что дерево над ним.
Иногда в играх с изометрией стены или подвалы / этажи делаются прозрачными, возьмём Fallout tactics в качестве примера:
Выделил красным область применения прозрачности. Так сделано примерно так что при касании спрайта героя с объектом, спрайт объекта делается прозрачным.
Вернёмся к нашему примеру и деревьям.
С помощью прозрачности удобно делать тени, воду, стекло, деревья и некоторые эффекты (хотя лучше не надо), такие как кровь.
Имейте в виду что функция прозрачности требует много ресурсов процессора для обработки таких спрайтов, следовательно не злоупотребляйте ей. Если у вас нет нужды делать что-то прозрачным, не делайте.
В последних версиях Game Maker Studio (и в GMS2) фон у всех спрайтов автоматически делается прозрачным, раньше фон был белым.
Если у вас есть картинка с белым фоном (или любым другим), но вы хотите его убрать в графическом редакторе гейм мейкер, то это делается с помощью функции «erase a color» (убрать цвет), я пользуюсь этой функций очень часто, в том числе и для своих рисунков, а так-же работая практически с какой угодно графикой.
Если цвет не убирается, меняйте либо цвет, подбирая под цвет фона, либо допустимое отклонение (tolerance).
Кстати, вы часто замечали спрайты вот с таким зелёным фоном?
Это так сохраняются некоторые спрайты с прозрачным фоном, вам просто нужно будет потом его убрать вот таким вот образом.
С помощью прозрачности можно делать и тень, хотя это не лучший способ.
Чтобы сделать тень в Game Maker вы берёте ваш спрайт, затем делайте его абсолютно чёрным. Меняйте интенсивность (insensitivity) до 0:
Далее меняете прозрачность изменяя opacity (помутнение), как я и писал выше.
Ну и накладывайте на всё это дело ваш основной спрайт:
Получается примерно что-то такое, фон уже потом добавил, он на спрайте не нужен.
С помощью этой функции можно делать как-бы растворение элементов и объектов, а так-же появление их из ниоткуда. Выглядит прикольно, но жрёт довольно много ресурсов да и это кривоватый метод.
Посмотрите это моё короткое видео про элементы меню:
Посмотрите как тут из темноты появляются элементы меню (кнопки). Сделано это с помощью как раз прозрачности. Просто изначально пишем кнопкам (в create) прозрачность равную нулю (image_alpha = 0), а затем в шаге (step) пишем что-то вроде:
if image_alpha =150 then image_alpha=0;
Реально и сделать еще парочку промежуточных вариантов дальности видимости.
У этого метода есть и другие недостатки, например объекты где вы хотели иметь постоянную прозрачность допустим 50% (0.5) у вас будут тоже менять её в зависимости от дальности от героя, хотя можете у таких объектов сделать изначальную прозрачность спрайта другой.
Ну вот и всё что я могу вам рассказать про прозрачность в Game Maker Studio, функция важная, красивая и полезная, пользуйтесь с умом. Удачи!
Другие мои статьи про создание игр вы можете найти вот тут: Геймдев
Как сделать спрайт прозрачным
Вывод спрайта и его прозрачность
afq | Дата: Вторник, 03 Июля 2018, 06:18 | Сообщение # 1 | |
| Никак не могу понять, можно ли сделать прозрачность спрайта без шейдеров, а то я никак не могу понять как шейдеры использовать, почему нужно то и то писать и где вся инфа по шейдерам есть, раз уж на то пошло. Проблема вот в чем. Далее будет предоставлен код, это для 2d. Если я не устанавливаю glOrtho, то спрайт рисуется, но большого размера. Если установлю glOrtho, то рисуется только черный квадрат. Ещё была функция какая то, уже не помню как называется, он ещё двигается с помощью glRasterpos, она тоже рисует там где должно быть прозрачно, черным цветом. Из-за того, что не устанавливаю glortho, приходится координаты ставить в 0, 1 и тому подобное. Вот код. std::fseek ( fd, pos, SEEK_SET ); pixels = new unsigned char [ max_pixels ]; // for ( int i = 0; i | |
Snake174 | Дата: Вторник, 03 Июля 2018, 07:00 | Сообщение # 2 | |
| Мне кажется, или init_texture ( ); нужно вызывать после того, как ты заполнишь массив pixels? Не следует обманывать инспектора Pipmak Assistant Love2D Exporter Love2D-Helpers | |
afq | Дата: Вторник, 03 Июля 2018, 07:12 | Сообщение # 3 | |
| Snake174, да ты совершенно прав. Я это поменял в последний момент, подумал что в конструкторе лучше не создавать ничего, потому как если выясниться что файл отсутствует или другая ошибка, то освободить память я не смогу, потому что конструктор не выполнится до конца, а отсюда и то, что деструктор тогда не вызовется. Я init_texture перенес без задней мысли из конструктора в начало фунцкии и забыл о приоритетах, но если поместить эту функцию в конец, то будет работать, но так как я написал в начале темы, то есть без прозрачности и glOrtho. мозги | |
Snake174 | Дата: Вторник, 03 Июля 2018, 07:31 | Сообщение # 4 | |
| Код вывода спрайта покажи. Вот процедура загрузки png изображений из моего старого проекта. Обрати внимание на цикл. glGenTextures( 1, &id ); for (int y = 0; y > 8) & 255) > 16) & 255) > 24) & 255) | |
afq | Дата: Вторник, 03 Июля 2018, 08:07 | Сообщение # 5 | |
| Snake174, я тоже раньше в int помещал все четыре цвета. А потом понел что можно по одному ( unsigned char ) для каждого цвета писать в массив, а потом за раз записать в data файл весь массив. И также прочесть одним разом без цикла. Я сегодня поменял и теперь за один раз считывает все цвета из data файла. Сначала размеры считываются, потом количество пикселей, а потом за раз требуемая длина, так лучше. Добавлено (03 Июля 2018, 08:07) | |
Snake174 | Дата: Вторник, 03 Июля 2018, 08:56 | Сообщение # 6 | |
Да, с прозрачностью. Старый потому что времени нет его допиливать ) Тут тоже всё разом считывается. В цикле то как раз и делается, чтобы было прозрачно. Без него у меня неправильно отображалось. | ||
afq | Дата: Вторник, 03 Июля 2018, 11:08 | Сообщение # 7 | |
| Snake174, можешь снимок предоставить прозрачного спрайта? мозги | |
Snake174 | Дата: Вторник, 03 Июля 2018, 13:08 | Сообщение # 8 | |
| https://github.com/Snake174/PipmakAssistant/blob/master/res/ramka.png Да любой файл с прозрачностью скачай и всё. | |
afq | Дата: Среда, 11 Июля 2018, 12:14 | Сообщение # 9 | |
| Snake174, я так понел ты с gl_Begin делал, у меня так тоже с прозрачностью рисовался. Но на нетбуке тормозило если несколько рисунков надо было нарисовать, потому что пока в цикле все поинты нарисуются, пройдет время. мозги | |
Snake174 | Дата: Среда, 11 Июля 2018, 17:11 | Сообщение # 10 | |
| Да скинь ты уже весь код. Могу на java скинуть без glBegin если надо. | |
afq | Дата: Среда, 11 Июля 2018, 17:58 | Сообщение # 11 | |
| Snake174, давай на java. Весь код? Сюда? Или на github? мозги | |
Snake174 | Дата: Четверг, 12 Июля 2018, 07:34 | Сообщение # 12 |
import java.io.BufferedInputStream; public class Sprite private int texID = 0; public Sprite( String fileName ) LoadableImageData imageData = ImageDataFactory.getImageDataFor( fileName ); int width = imageData.getWidth(); texture.setTextureWidth( imageData.getTexWidth() ); texWidth = texture.getTextureWidth(); IntBuffer temp = BufferUtils.createIntBuffer( 16 ); if ((texWidth > max) || (texHeight > max)) texture.setWidth( width ); imageWidth = texture.getImageWidth(); glTexEnvf( GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_MODULATE ); float[] vert = < float[] texVertices = < vboQuadHandle = glGenBuffers(); quadVertices = BufferUtils.createFloatBuffer( 4 * 2 ); quadTexVertices = BufferUtils.createFloatBuffer( 4 * 2 ); ARBVertexBufferObject.glBindBufferARB( ARBVertexBufferObject.GL_ARRAY_BUFFER_ARB, vboQuadHandle ); ARBVertexBufferObject.glBindBufferARB( ARBVertexBufferObject.GL_ARRAY_BUFFER_ARB, vboQuadTexHandle ); ARBVertexBufferObject.glBindBufferARB( ARBVertexBufferObject.GL_ARRAY_BUFFER_ARB, 0 ); public void use() public Vector2f size() public int width() public int height() public Vector2f imageSize() public int imageWidth() public int imageHeight() public int ID() public void destroy() public void setTexEnvi( int param1, int param2 ) public static void activeTexture( int num ) public void draw( Vector4f geom, float angle, float alpha, boolean centered, int mode ) quadVertices.clear(); // Normal render // Flip vertical // Flip horizontal quadTexVertices.clear(); ARBVertexBufferObject.glBindBufferARB( ARBVertexBufferObject.GL_ARRAY_BUFFER_ARB, vboQuadHandle ); ARBVertexBufferObject.glBindBufferARB( ARBVertexBufferObject.GL_ARRAY_BUFFER_ARB, vboQuadTexHandle ); ARBVertexBufferObject.glBindBufferARB( ARBVertexBufferObject.GL_ARRAY_BUFFER_ARB, 0 ); glEnable( GL_BLEND ); glColor4f( 1.0f, 1.0f, 1.0f, alpha ); glEnableClientState( GL_VERTEX_ARRAY ); glDrawArrays( GL_QUADS, 0, 4 ); glDisableClientState( GL_TEXTURE_COORD_ARRAY ); glDisable( GL_TEXTURE_2D ); public void drawPart( Vector4f geom, Vector4f partGeom, float angle, float alpha, quadVertices.clear(); float tx = partGeom.getX() / (float)texWidth; // Normal render // Flip vertical // Flip horizontal quadTexVertices.clear(); ARBVertexBufferObject.glBindBufferARB( ARBVertexBufferObject.GL_ARRAY_BUFFER_ARB, vboQuadHandle ); ARBVertexBufferObject.glBindBufferARB( ARBVertexBufferObject.GL_ARRAY_BUFFER_ARB, vboQuadTexHandle ); ARBVertexBufferObject.glBindBufferARB( ARBVertexBufferObject.GL_ARRAY_BUFFER_ARB, 0 ); glEnable( GL_BLEND ); glColor4f( 1.0f, 1.0f, 1.0f, alpha ); glEnableClientState( GL_VERTEX_ARRAY ); glDrawArrays( GL_QUADS, 0, 4 ); glDisableClientState( GL_TEXTURE_COORD_ARRAY ); glDisable( GL_TEXTURE_2D );
|