Генерация картинок для Android приложения из SVG

[vovkab]

Проблема с количеством dpi которые нужно поддерживать. Я не знаю сколько было разных dpi на симбиане, но подозреваю что одно, поэтому и проблем не было, так как рисовалось все 1 к 1.

Даже если и добавят поддержку svg, все равно нужно будет создавать svg отдельно для каждого dpi или как минимум для кратных.
Скажем есть у вас картинка c линией, на xhdpi она будет 2px, и она так же будет нормально показана на mdpi, линия будет 1px. Но вот уже на hdpi будут проблемы, так как нужно будет отрисовать 1.5px. Обычно в этом случае рисуется отдельный свг уже с правильной линией равной 1 или 2px, в зависимости что выглядит лучше.

Другая проблема, если много деталей на картинке, то она может хорошо выглядеть на xxhdpi, но отвратительно на mdpi. То есть снова нужна отдельная картинка.

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

Я обычно создаю отдедельный svg для каждого разрешения и подгоняю их в ручную, что бы не было мыла. Если сильно лень, то тогда только для кратных dpi, то есть достаточно сделать две «правильных» картинки для xxhdpi и xhdpi и уже из них нарезать. Из xxhdpi нарезаются hdpi и ldpi, а из xhdpi: mdpi

Для конвертации svg в png пробовал:
1. imagemagic — качество картинки странное,
2. inkscape — качество картинки приемлемо, но вот хотелось бы только больше опций по управлению svg, например, поменять цвет определенного объекта, будь то слой или что то другое.
3. В итоге остановился на библиотеке batik (http://xmlgraphics.apache.org/batik/) качество достаточно приемлемое. Так как эта библиотека парсит весь svg, то вы по сути можете делать что угодно, менять цвета, изменять размеры линий и тд, затем растеризовать конечный svg в png. Но этот способ требует больше времени чем все остальные.

p.s. Но да, при наличие поддержки svg уже не нужно было бы конвертировать в png.

[antonkrasov]

Советую посмотреть на romannurik.github.io/AndroidAssetStudio/, очень удобно. Плюс можно регулировать падинги и переопределять цвет.
Я делаю так: в фотошопе с помощью функции generator: blogs.adobe.com/photoshopdotcom/2013/09/introducing-adobe-generator-for-photoshop-cc.html
Генерирую большие картинки, обычно как 1000% image.png. Потом уже Asset studio делаю нужные мне размеры.

[kriomant]

Я тоже подобное делал, только встраивался в процесс билда: github.com/kriomant/buketan

[wholeman]

Я сделал Makefile и добавил в него несколько правил для вызова Inkscape.

Может, кому пригодится

application_icons: res/drawable-xhdpi/ic_launcher.png res/drawable-hdpi/ic_launcher.png res/drawable-mdpi/ic_launcher.png res/drawable-ldpi/ic_launcher.png

icons: application_icons libs_icons

res/drawable-xhdpi/%.png: images/%.svg
        mkdir -p res/drawable-xhdpi
        inkscape -e $@ -C -w 96 -h 96 $<

res/drawable-hdpi/%.png: images/%.svg
        mkdir -p res/drawable-hdpi
        inkscape -e $@ -C -w 72 -h 72 $<

res/drawable-mdpi/%.png: images/%.svg
        mkdir -p res/drawable-mdpi
        inkscape -e $@ -C -w 48 -h 48 $<

res/drawable-ldpi/%.png: images/%.svg
        mkdir -p res/drawable-ldpi
        inkscape -e $@ -C -w 36 -h 36 $<

icons_clean:
        rm -fv res/drawable-*dpi/ic_launcher.png

distclean: clean icons_clean libs_distclean

SPORT_ANALYSIS_DIR = ../libs/sport_analysis

libs_icons:
        make -C ${SPORT_ANALYSIS_DIR} icons

[RPG]

А ImageMagick чем не подошёл?
mogrify -density 300 -format png *.swg
И дело в шляпе. density по вкусу (в DPI).

P.S. + Makefile как уже писали выше, чтобы переконвертировались только изменившиеся картинки.

[Archi009]

Поэтому и был выбран браузер в качестве средства отрисовки, все современные браузеры полностью поддерживают SVG. Я вот думаю заменить браузер обычный на PantomJS, чтобы не мелькала открывающаяся страница.

[RPG]

Не замечал чтобы актуальный IM что-то плохо рендерил, но чтобы не пользоваться браузером всё равно полно вариантов, самый легковесный — это CairoSVG (на Питоне). Я просто слабо представляю как такое решение будет интегрироваться со сборочным сервером, например, где графики обычно нет.

[jmeprogrammer]

А вот как мы делали
habrahabr.ru/company/twins/blog/166093/

[Archi009]

Читал вашу статью до того как сделал свою небольшую тулзу) статья хорошая, но у меня просто было желание не на лету генерировать нужный размер, а чтобы всё уже по папочкам хорошо лежало, перфекционизм блин…

[esinev]

Используем rsvg-convert, входящий в состав librsvg библиотеки. librsvg была сделана для отрисовки svg в Gnome.
Утилита доступна как для linux, так и Mac OS X.

Пример:
rsvg-convert --width 100 --keep-aspect-ratio --format png photo.svg > photo.png

Единственный недостаток: может генерировать немного отличающиеся png при повторных запусках.
Поэтому лучше отслеживать изменения в svg-файлах, чтобы в репозиторий не сабмитились ненужные png, практически ничем не отличающиеся.