LINUX.ORG.RU

Ищу инструмент для нарезки (slicing) GUI из набора изображений

 , , , , slicing


0

1

в development, т.к. это нужно только для разработки всякого там gui-софта под ненужно^Wмобилы и планшеты.

вобщем, задача такая.

есть набор из 4-5 PNG-файлов, которые представляют собой слои, сконвертированные из PSD файла. все эти 4-5 файлов содержат кучу элементов GUI, вобщем — типичный uikit с того же Envato, разделенный на слои по «глубине».

каждый из файлов есть в 3-6 разрешениях (для разных андроидных экранов).

нужен инструмент (под онтопик или osx - неважно), который позволит делать нечто вроде того, что делает фотошоп-плагин cut&slice me, но немного иначе.

нужно в каждом PNG выбрать прямоугольник, и присвоить ему имя. желательно с возможностью создавать группы из элементов.

потом, нужно чтобы можно было все эти выделенные прямоугольники вырезать из больших PNG, и сгенерировать из них атлас + текстовик с координатами, соответствующими каждому элементу, отдельно под каждое разрешение.

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

поэтому решил спросить у СПВ, нет ли такого же, но готового.

фотошоп использовать не могу, т.к. под вайн ниасилил поставить, а на рабочий мак пиратку ставить не могу по причине контрактных обязательств. в триале CC2014 не работает плагин cut&slice me. ну и вообще меня фотошопное решение не устраивает, в силу недостаточной кроссплатформенности и зависимости на адскую клауд-проприетарщину, способную подвести в самый неподходящий момент.

UPD:

Проблема решена, спасибо AP за совет про inkscape, тема закрывается как решенная.

Инструкция для будущих поколений:

1. запускаем inkscape. у меня 0.48.5 (0.48.4 сглючил на snap to grid)

2. File -> Import -> выбираем наш PNG файл

3. ресайзим документ в размер PNG файла

4. выбираем изображение в inkscape (оно представлено в виде объекта), и присваиваем ему координаты 0,0

5. идем в свойства документа, и выставляем snap to grid, пиксельные юниты, и т.п.

6. переименовываем слой в background, и лочим

7. view -> grid

8. в «Fill and stroke» выбираем все в режим «X» (крестик), чтобы ничего не рисовалось

9. создаем новый слой, выше чем background

10. на новом слое создаем прямоугольники нужного размера в нужных местах

11. Object -> Object properties -> выставляем поле id в желаемое имя файла

12. невидимые объекты практически невозможно выделять/искать, кроме как кнопкой Tab, но Edit->XMLEditor более-менее помогает.

13. выделяем все объекты (ctrl+a), затем File -> Export Bitmap

14. выбираем Batch export N selected objects, и нажимаем кнопку Export.

неудобства:

* весь экспорт сыпется в $HOME (решение найдено — вывод сыпется в ту же директорию, в которую сохранен SVG файл)

* хотелось бы таки как-то видеть объекты, может быть удастся найти какой-то способ

★★★★★

Последнее исправление: waker (всего исправлений: 5)

Ответ на: комментарий от AP

спасибо, я находил описание этого плагина, но именно по описанию он не умеет делать то что мне надо. попробую, когда за линуксовый комп попаду.

waker ★★★★★
() автор топика

Сильно подозреваю, что можно примерно то же самое сделать в Inkscape:

1. Впилить в пустой документ картинку в PNG (не забыть поставить X/Y в целочисленные координаты, чтобы картинка не «плыла»).

2. Добавить новый слой, фоновый с картинкой — заблокировать.

3. На новом слое рисовать полностью прозрачные прямоугольники вокруг элементов, через диалог свойств объекта давать им уникальные имена.

4. Ctrl+A на слое с прямоугольниками.

5. В диалоге экспорта в PNG поставить галку пакетного экспорта.

Что такое «атлас + текстовик с координатами, соответствующими каждому элементу, отдельно под каждое разрешение.», я не понимаю. Это image map, для которого есть встроенный гимповый плагин?

AP ★★★★★
()
Последнее исправление: AP (всего исправлений: 1)
Ответ на: комментарий от waker

А, ну то есть это мипмапы текстур, по сути. Я не знаю, как у тебя записывается этот атлас (может ты их в JSON пихаешь :)), так что, увы, пока без конкретики. Так-то GIMP через отдельный плагин может DDS генерить.

AP ★★★★★
()
Последнее исправление: AP (всего исправлений: 1)
Ответ на: комментарий от AP

не, мипмапы это другое (вообще не в тему). как записывать координаты спрайтов из атласа - мне пофигу, я могу и конвертнуть если что.

если есть плагин который может сделать нарезку, и правильно назвать файлы — то из этих файлов я могу атлас уже и другой программой сгенерить.

waker ★★★★★
() автор топика
Ответ на: комментарий от AP

насчет gimp#... я так понял, ты разработчик?

было бы неплохо на сайте где-то написать инструкцию по сборке и установке (желательно в $HOME, т.к. в /usr срать не очень приятно), хотя бы для пары популярных дистров. в частности, как поставить mono devel packages, такие как libmono-cil-dev, mono-runtime, mono-dmcs в убунте, ибо хрен где разыщешь эту информацию, и ни в каких readme файлах нету ее.

далее, у тебя где-то в configure.in баг, т.к. ./configure проходит после установки вышеупомянутых пакетов, после чего make фейлит на неустановленном gtk-sharp-2.0.

если надо - могу все это перепостить в багтрекер.

вобщем, в итоге я смог его собрать, щас попробую разобраться как его запускать.

waker ★★★★★
() автор топика
Ответ на: комментарий от AP

с некоторым трудом, обнаружил как запустить (Filters->Web->Slice Tool).

Инструмент не годен. Проблемы:

  • Окно самопроизвольно закрывается во время разметки. Это самая главная проблема, которая вообще не дает разметить даже один прямоугольник — достаточно попробовать перемещать любую направляющую в течение пары секунд.
  • Не нашел возможности зума, чтобы задать направляющие с пиксельной точностью.

система: бунта14, гимп 2.8.10 из репов

waker ★★★★★
() автор топика
Последнее исправление: waker (всего исправлений: 1)
Ответ на: комментарий от AP

inkscape в этом плане выглядит перспективно. но не могу разобраться:

1. я загрузил PNG, он правильно выровнялся на пиксельную сетку, с юнитами все ок. но в списке слоев пусто. как его залочить?

2. не удается включить snap to grid. точнее, все включено, но не работает.

3. где найти галку пакетного экспорта? в бунте14 inkscape за версией 0.48, может надо новее, или старее?

waker ★★★★★
() автор топика
Ответ на: комментарий от waker

поставил 0.48.5, разобрался как залочить растровую картинку в слое. snap тоже работает.

waker ★★★★★
() автор топика
Ответ на: комментарий от waker

с пакетным экспортом тоже разобрался. огромное спасибо. похоже, это то что мне надо.

waker ★★★★★
() автор топика
Ответ на: комментарий от AP

ну вот как раз инструкции по установке - это по части сайта. правда, лучше вообще написать «данной программой пользоваться невозможно, т.к. она не работает», чтобы люди зря время не тратили.

waker ★★★★★
() автор топика

Для склейки атласа из набора png я пользуюсь своей тулзой. Она создает атлас и описание к нему в xml.

andreyu ★★★★★
()
Ответ на: комментарий от andreyu

для атласа вроде готовых тулзов полно, правда не уверен насчет онтопика. а твою тулзу можно где-то взять? xml не беда, как нибудь распарсю.

waker ★★★★★
() автор топика
Ответ на: комментарий от waker

для атласа вроде готовых тулзов полно, правда не уверен насчет онтопика. а твою тулзу можно где-то взять? xml не беда, как нибудь распарсю.

Могу попробовать дать доступ на bitbucket, если есть аккаунт.

andreyu ★★★★★
()
Ответ на: комментарий от waker

есть, юзер alexey_yakovenko

Отправил инвайт. Утилита старинная, лет 5 ей уже. Если будут какие-либо замечания/предложения, то с удовольствием выслушаю.

andreyu ★★★★★
()
Ответ на: комментарий от andreyu

сходу замечание: после запуска make произошло нечто странное, пошел бесконечный цикл. скомпилял g++ напрямую:

cd src
g++ *.cpp -o pack-images -lpng

пока еще не разбирался как пользоваться, потому что еще файлы нарезать не успел. как испробую - отпишусь. спасибо за тулзу :)

waker ★★★★★
() автор топика
Ответ на: комментарий от andreyu

да в общем даже и не вижу что улучшать.. XML я выпилил, и записал в более удобный мне формат. остальное и так работает как следует.

waker ★★★★★
() автор топика
Ответ на: комментарий от waker

Я хотел прикрутить поддержку темплейтов для того, что бы выхлоп был в нужном формате, но потом забил на это дело :)

andreyu ★★★★★
()
Ответ на: комментарий от andreyu

да и правильно сделал, незачем усложнять. код проще поправить.

waker ★★★★★
() автор топика
Ответ на: комментарий от AP

уже не пригодится. решил вопрос радикально покупкой mac mini, и экспортом из фотошопа. (генератор атласа использую тот что обсуждали выше).

немного подробнее: в inkscape все кое-как работало, но после нескольких дней работы всплыло несколько багов, из-за которых продуктивность упала ниже плинтуса. иногда просто неправильные области экспортируются (чаще всего со сдвигом на 1px), несмотря на то что координаты 100% точные, а иногда в SVG файл записываются кривые настройки экспорта отдельных объектов, которые приходилось выпиливать в XML editor или в vim. + работа с несколькими разрешениями оказалась весьма геморройной, т.к. все векторные объекты приходилось в каждом разрешении snap-to-grid вручную, с множественными коррекциями.

waker ★★★★★
() автор топика
Последнее исправление: waker (всего исправлений: 2)
Вы не можете добавлять комментарии в эту тему. Тема перемещена в архив.