создаем атлас текстур

Создаём атлас текстур с помощью LibGDX

Здравствуйте, давайте создадим атлас текстур (файл .atlas) из набора изображений или из gif анимации!

Начнем с gif анимации, можете воспользоваться моей предыдущей статьей, где можно скачать gif-ки – Анимашки gif: смешные киски.

Для примера возьму вот эту gif-киску:

sw

Теперь с помощью онлайн-сервиса: “picasion.com/split-animated-gif/” разобьём gif анимацию на отдельные картинки:

atlas20

Далее выбираем фон картинок и закачиваем все кадры к себе на компьютер:

atlas21

Скачается zip архив, распаковываем его и видим в нём gif файлы, из моей gif анимации получилось 18 gif картинок.

Так как Libgdx работает с png файлами – придется конвертировать gif в png, можно также воспользоваться онлайн-сервисом: “onlineconverter.com/gif-to-png”

В итоге у меня получилось 18 png картинок!

Теперь приступим к созданию Атласа текстур из набора изображений:

1. Создаём LibGDX проект:

atlas1

Незабываем поставить галочку напротив пункта Tools.
Название проекта, для данного примера, поставил myatlas.

И жмем кнопку Generate!

2. Заходим в Android Studio и открываем сгенерированный в LibGDX проект:

Для этого в верхнем меню Android Studio выбираем пункт File – подпункт New – подпункт Import Project:

atlas24

Далее заходим в папку проекта и выбираем build.gradle:

atlas23

3. Создаем файл MyPacker в desktop:

Для этого в папке, где храниться файл DesktopLauncher, создаем ещё один класс – MyPacker:

atlas2

Код файла MyPacker:

package com.mygdx.game.desktop;

import com.badlogic.gdx.tools.texturepacker.TexturePacker;

public class MyPacker {
    public static void main (String[] args) throws Exception {
        TexturePacker.process("cat", "atlas", "catatlas");
    }
}

, где:
cat – это название папки с исходными изображениями;
atlas – это название папки, куда будет помещен готовый атлас;
catatlas – это имя атласа.

4. Создаем папки cat и atlas

Сначала меняем вкладку Android на Project:

atlas4

Папка с исходными изображениями (в данном примере это папка cat) должна находиться в корне проекта – в нашем примере – это папка – myatlas.
Поэтому создаем папку cat через Android Studio, а именно: кликаем правой кнопкой мышки на папку myatlas, выбираем пункт New и подпункт Directory:

atlas8

Аналогично создаем папку atlas:

atlas9

Далее перекидываем наши 18 png картинок в папку cat.

Вот так выглядит папка cat:

atlas10

Здесь я добавил в имя каждого файла нолики слева, то есть 0001, 0002 и т.д. – но это делать не обязательно.

5. Запускаем файл MyPacker

Для этого кликаем по файлу MyPacker правой кнопкой мышки и выбираем пункт Run:

atlas11

После чего у нас в папке atlas появятся 2-а новых файла:
catatlas.atlas
catatlas.png
, то есть все изображения в исходной папке (cat) будут запакованы в один файл (catatlas.png) и создано описание к нему (catatlas.atlas):

atlas12

Все готово!

Можно перебросить их в папку assets:

atlas13

atlas14

и начать использовать их, например для создания анимации актёра – более подробно читайте здесь – Android Studio и LibGDX: Создаем простую 2D игру (Часть 3: Анимация актера)

PS: MyPacker будет пользоваться настройками установленные в нем по умолчанию, если нужно задать какие-то дополнительные условия создания атласа, можно настроить их в коде с помощью TexturePacker.Settings, либо с помощью .json файла. Подробности настройки можно почитать на русскоязычной вики:
“libgdx.ru/2015/01/texture-packer.html”.

Похожие записи: