Форум Flasher.ru

Форум Flasher.ru (http://www.flasher.ru/forum/index.php)
-   ActionScript 3.0 (http://www.flasher.ru/forum/forumdisplay.php?f=83)
-   -   Алгоритм разбивки спрайтщита на отдельные изображения (http://www.flasher.ru/forum/showthread.php?t=206735)

Parez 26.02.2014 06:21

Алгоритм разбивки спрайтщита на отдельные изображения
 
Здравствуйте.
Появилась необходимость найти/придумать алгоритм, который разделял бы спрайтщит на отдельные изображения (BitmapData) исходя из альфа-канала. Что-то наподобии того, что делает программа Shoebox.
То есть нужно определить, где в спрайтщите заканчивается один фрейм и начинается другой. Фактически, обвести все отдельные непрозрачные области изображения в прямоугольные рамки.
Вот пример того, как это делает Shoebox:
http://www.fotolink.su/pic_s/9b123f5...3c5efb4103.jpg
1036x1038(327.72 kB)
хостинг изображений

Если кому-то интересно, зачем это мне вдруг понадобилось - вот ссылка на тему-предысторию: http://www.flasher.ru/forum/showthread.php?t=206728

Wolsh 26.02.2014 10:56

Ерундой какой-то занимаетесь. Во-первых, уже на этой картинке некоторые изображения не разделены прозрачностью (сливаются), во-вторых в кадре может быть несколько разделенных прозрачностью объектов, например жонглер и его шарики. В третьих, все это похоже на воровство чужой интеллектуальной собственности. В четвертых, картинки надо загружать на хостинг форума, а не на левые файлопомойки — вирусоопасные и удаляющие изображения через месяц.

к слову, я бы вообще никакой xml не делал, а печатал ключ прямо на спрайтшите в виде пикселей. Распарсить ключ имхо быстрее чем загрузить и распарсить xml.
Не говоря уже о том, что в PNG можно встроить свой собственный chunk с инфой о кадрах. Ну, это все конечно справедливо, если Вы сами делаете спрайтшиты а не крадете.

caseyryan 26.02.2014 11:16

Цитата:

Не говоря уже о том, что в PNG можно встроить свой собственный chunk с инфой о кадрах. Ну, это все конечно справедливо, если Вы сами делаете спрайтшиты а не крадете.
Ну, я лично ничего плохого не вижу в том, чтобы взять чужой для тестов. Я сам не художник, и когда мне надо по-быстренькому набросать какой-то движок, то я не жду, пока мне нарисуют, а просто беру чужие картинки. Одно дело когда для тестов берешь, а потом заменяешь своим, и уже совсем другое, если в продакшене используешь чужое, без разрешения автора.
Цитата:

Если кому-то интересно, зачем это мне вдруг понадобилось - вот ссылка на тему-предысторию
Зачем было создавать эту тему? Чем та не устроила?

Wolsh 26.02.2014 11:27

caseyryan, я сильно сомневаюсь, что если бы Вы сами делали спрайтшиты, то создавали бы систему для определения границ кадров по прозрачностям. Уж наверное придумали бы, как сохранить и передать эту инфу. Я уже не говорю о том, что прозрачные области в PNG почти ничего не весят, и непонятен сам подход упихать все как сельдь в банке и потом мучиться с разделением, вместо того чтобы определиться с постоянной ячейкой под каждый кадр и пусть будет пустота, фиг с ней.

silin 26.02.2014 11:36

по всем пунктам согласен с Волшем, но чисто из 'любви к искусству' вариант решения через floodFill: находим непрозрачную точку, флудфилом красим все что с ней соприкасается непрозрачного, через getColorBoundsRect забираем кусок
Код AS3:

package 
{
        import flash.display.Bitmap;
        import flash.display.BitmapData;
        import flash.display.Sprite;
        import flash.display.StageAlign;
        import flash.display.StageScaleMode;
        import flash.geom.Point;
        import flash.geom.Rectangle;
 
 
        public class Main extends Sprite
        {
                [Embed(source = "test.png")]
                public static const test_png:Class;
                public function Main():void
                {
 
                        stage.scaleMode = StageScaleMode.NO_SCALE;
                        stage.align = StageAlign.TOP_LEFT;
 
                        var bmd:BitmapData = Bitmap(new test_png()).bitmapData;
                        addChild(new Bitmap(bmd));
 
                        // типа карта непрозрачности
                        var map:BitmapData = bmd.clone();
                        map.threshold(map, map.rect, new Point(), ">", 0, 0xFF000000, 0xFF000000);
 
                        var tX:Number = 0;
 
                        do
                        {
                                var rec:Rectangle = getFragmentRect(map);
 
                                if (rec)
                                {
                                        // стираем обработанный кусок
                                        map.fillRect(rec, 0x0);
                                        // вынимаем из рабочей ьитмапдаты
                                        var fragmBmd:BitmapData = new BitmapData(rec.width, rec.height, true, 0x0);
                                        fragmBmd.copyPixels(bmd, rec, new Point());
 
                                        // смотрим
                                        var fragm:Bitmap = new Bitmap(fragmBmd);
                                        addChild(fragm);
                                        fragm.x = tX;
                                        fragm.y = bmd.height + 40;;
                                        tX += fragm.width + 40;
 
 
                                }
                        }while (rec);
 
                }
 
 
                public static function getFragmentRect(bmd:BitmapData):Rectangle
                {
 
                        // ищем первый непрозрачный пиксель
                        for (var i:int = 0; i < bmd.width; i++)
                        {
                                for (var j:int = 0; j < bmd.height; j++)
                                {
                                        if (bmd.getPixel32(i, j)>>24)
                                        {
                                                // заливаем каким-то отличным цветом
                                                var clr:uint = 0xFFFF0000;
                                                bmd.floodFill(i, j, clr);
 
                                                return bmd.getColorBoundsRect(0xFFFFFFFF, clr);
                                        }
                                }
                        }
 
                        return null;
                }
        }
 
}


Zebestov 26.02.2014 12:11

Цитата:

Сообщение от Wolsh (Сообщение 1160697)
Я уже не говорю о том, что прозрачные области в PNG почти ~ничего не весят, и непонятен сам подход упихать все как сельдь в банке и потом мучиться с разделением, вместо того чтобы определиться с постоянной ячейкой под каждый кадр и пусть будет пустота, фиг с ней.

Не соглашусь. В PNG да, пустота ничего не весит. Но при разворачивании в памяти пустотой пиксель весит те же 4 байта. К тому же сам размер атласа нужно стараться сдерживать в определенных рамках, допустимых конкретной платформой, чтобы при отрисовке графики поменьше "дергать" текстурами в GPU, что ощутимо влияет на производительность.

А вот подозрения уважаемого Wolsh на воровство контента я разделяю. Если у тебя есть картинка и к ней нет xml/json, это с большой вероятностью означает, что ты качнул ее с блога какого-то разработчика, который делится процессом работы или что-то вроде того.

Babylon 26.02.2014 14:13

Если делится, то это уже не воровство.

Zebestov 26.02.2014 14:26

Babylon не понимает разницы между "делится процессом работы" и "раздает исходники".

Parez 27.02.2014 00:39

Спасибо silin за интересную идею.
Не понимаю, зачем понадобилось разводить холивар по поводу воровства и обвинять меня в нём без особых оснований. Никто даже не догадался подумать, что на просторах интернета есть немало бесплатных спрайтщитов, которыми авторы делятся для таких как я, не умеющих рисовать. Есть и тайлсеты, и анимации персонажей. Это одна из причин, по которой я заинтересовался этим вопросом.
Вторая причина - это просто интерес к теме. Как я сказал в теме-предыстории, я только недавно обратил более пристальное внимание к теме спрайтщитов и их использования. И мне стало интересно (даже не по какой-то объективной причине, а просто из-за спортивного интереса) как можно (и можно ли вообще) автоматизировать процесс работы с абстрактным спрайтщитом, не имея дополнительных данных о нем.
Надеюсь, теперь тут будет больше постов по теме, а не обсуждений правильности того, что я делаю.

p.s
И неужели кто-то из вас думает, что если я соберусь делать какой-то коммерческий продукт, я буду использовать чужую графику? Это в первую очередь плохо для меня и для успеха того, что я буду делать. Если уж я соберусь делать что-то в серьёз, я не пожалею денег заплатить профессиональному художнику аниматору, чтобы он нарисовал для моего приложения УНИКАЛЬНУЮ графику, не скопированную ни от куда. Иначе это не серьёзно. Пока же я просто экспериментирую.

Zebestov 27.02.2014 00:47

Parez, не путай обвинения с обоснованными подозрениями.
Покажи мне ссылку на авторитетные сайты с бесплатными атласами с нерегулярной сеткой и без сопутствующего дескриптора.


Часовой пояс GMT +4, время: 20:36.

Copyright © 1999-2008 Flasher.ru. All rights reserved.
Работает на vBulletin®. Copyright ©2000 - 2024, Jelsoft Enterprises Ltd. Перевод: zCarot
Администрация сайта не несёт ответственности за любую предоставленную посетителями информацию. Подробнее см. Правила.