Каков наилучший способ создания рисования для разных точек на дюйм - PullRequest
6 голосов
/ 20 января 2012

Вы сначала создаете отрисовку MDPI и просто масштабируете ее в соответствии с соотношением 0,075 / 1,00 / 1,50 / 2 по пикселям в фотошопе или воссоздаете каждый отдельный отрисовку?

Также лучше начатьс высококачественным изображением и начните его масштабирование или начните с изображения MDPI и просто увеличьте его?

Вот что я делаю:

Создание изображения в формате MPI в фотошопе с порциями 320x480 и 160как это разрешение.Сохраните 4 изображения и измените разрешение, просто введя 120,160, 240 или 320 в качестве разрешения.

Ответы [ 8 ]

6 голосов
/ 20 января 2012

Из руководящих принципов разработки Android:

Стратегия

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

Для получения более подробной информации по этой теме, ознакомьтесь с Поддержка нескольких экранов.

5 голосов
/ 20 января 2012

Советы для дизайнеров Руководство по проектированию иконок содержит следующие рекомендации:

По возможности используйте векторные фигуры
По возможности,используйте векторные фигуры, чтобы при необходимости активы можно было масштабировать без потери детализации и четкости краев.

Начните с больших монтажных областей
Поскольку вам потребуется создать активы дляПри разных плотностях экрана лучше всего начинать дизайн иконок на больших монтажных площадках с размерами, кратными целевым размерам иконок.Например, значки запуска имеют ширину 96, 72, 48 или 36 пикселей, в зависимости от плотности экрана.Если вы изначально рисуете значки запуска на артборде 864x864, вам будет проще и понятнее настроить иконки, когда вы уменьшите артборд до целевых размеров для окончательного создания ресурса.другие приятные советы в этом разделе.Я думаю, что это хороший совет и для других типов рисования (иконки меню, фоны и т. Д.).

1 голос
/ 20 января 2012

Я использую Inkscape, также работаю с векторными изображениями, затем экспортирую в нужный размер растра для различных разрешений.Статью о создании иконок из Inkscape, которую я написал, можно найти по адресу https://tekeye.uk/android/android-launcher-icons-using-inkscape

1 голос
/ 20 января 2012

Я обычно начинаю с большого, и перехожу на меньшее.

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

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

Любой графический объект в powerpoint позволит вам щелкнуть по нему правой кнопкой мыши и выбрать «Сохранить как рисунок», который выведет его в виде файла png. Осталось только поместить его в draw9patch при необходимости.

0 голосов
/ 02 октября 2016

Похоже, в Android Studio есть инструмент:

Разверните папку вашего проекта в представлении проекта> щелкните правой кнопкой мыши app > New> Image Asset

Тип значка: Значки панели действий и вкладки

Тип актива: Изображение

Выберите Путь для исходного изображения (оно должно быть большим)

Форма: Нет (чтобы сделать фон прозрачным)

И он будет генерировать изображения в соответствующих папках для рисования.

0 голосов
/ 05 ноября 2014

Начиная с Android L существует VectorDrawable, который похож на SHAPE из SVG, но в стиле Android Android

см. Документацию по Android:

https://developer.android.com/training/material/drawables.html#VectorDrawables

0 голосов
/ 30 мая 2014

Я предлагаю написать небольшой скрипт в powershell для Inkscape.

Пример:

Поместите Inkscape в "c: \ bin \ inkscape" (каталог без пробелов) и нарисуйте все свои изображения в разрешении mdpi (1x).

в окне свойств объекта Inkscape (то есть идентификатор в xml) укажите имя для каждого объекта, который вы хотите экспортировать в png.

Сохраните SVG-файл в "C: \ users \ rone \ Pictures \ design-MyApps-forscript.svg"

Создать каталог "d: \ temp".

И поместите этот скрипт в "C: \ app \ scripts \"


Имя сценария Powershell "inkscape_to_png.ps1":

param (
    $inkscape_dir="C:\bin\Inkscape\",
    $inkscape_bin="inkscape.exe",
    $img_id="",
    $fichier_svg="C:\Users\rone\Pictures\design-MyMap-forscript.svg",
    $tmp_dir="d:\temp\"
)

$inkscape=$(Resolve-Path "$inkscape_dir\$inkscape_bin")


function getWidthHeight($img_id) {
    $size=@{}

    $old_pwd=$pwd.path

    cd $inkscape_dir

    write-host -foreground yellow "détermine la taille de $img_id"

    $size.width=invoke-command {./inkscape --file=$fichier_svg --query-id=$img_id --query-width 2>$null}
    $size.height=invoke-command {./inkscape --file=$fichier_svg --query-id=$img_id --query-height 2>$null}

    write-host -foreground yellow "width : $($size.width)"
    write-host -foreground yellow "height : $($size.height)"

    cd $old_pwd

    return $size
}

function convertTo($size, $format) {
    $rsize=@{}

    if ($format -eq "MDPI") {
        $rsize.width=[int]$size.width*1
        $rsize.height=[int]$size.height*1
    } elseif ($format -eq "LDPI") {
        $rsize.width=[int]$size.width*0.75
        $rsize.height=[int]$size.height*0.75
    } elseif ($format -eq "HDPI") {
        $rsize.width=[int]$size.width*1.5
        $rsize.height=[int]$size.height*1.5
    } elseif ($format -eq "XHDPI") {
        $rsize.width=[int]$size.width*2
        $rsize.height=[int]$size.height*2
    } elseif ($format -eq "XXHDPI") {
        $rsize.width=[int]$size.width*3
        $rsize.height=[int]$size.height*3   
    } elseif ($format -eq "XXXHDPI") {
        $rsize.width=[int]$size.width*4
        $rsize.height=[int]$size.height*4
    }

    write-host -foreground yellow "après conversion : $format"

    write-host -foreground yellow "width : $($rsize.width)"
    write-host -foreground yellow "height : $($rsize.height)"

    return $rsize
}

function inkscape_convert() {

    $mdpi_size=getWidthHeight $img_id

    write-host -foreground gray "----------------------------------------"
    "MDPI,LDPI,HDPI,XHDPI,XXHDPI,XXXHDPI" -split ","|% {


        $new_size=convertTo $mdpi_size $_
        if ($new_size.width -eq 0 -or $new_size.height -eq 0) {
            write-host -foreground red "erreur lors de la recherche de la taille de l'image"
            exit
        }
        $w=$new_size.width
        $h=$new_size.height
        $dir="$tmp_dir\drawable-$($_.toLower())"
        if (-not $(test-path $dir)) {
            write-host -foreground yellow "création du répertoire $dir"
            mkdir $dir
        }
        $new_file_name="$dir\$($img_id).png"
        $cmd="$inkscape -z -i $img_id -j -f $fichier_svg -w $w -h $h -e $new_file_name"
        write-host -foreground gray $cmd
        invoke-expression -command $cmd
        if ($? -eq $true) {
            write-host -foreground yellow "conversion OK"
        }

    }
    write-host -foreground gray "----------------------------------------"

}


inkscape_convert

Теперь вызовите этот скрипт как пример:

@("btn_button_name_1","btn_button_name_3","btn_other", "btn_zoom", "btn_dezoom", "btn_center", "btn_wouwou", "im_abcdef", "ic_half", "ic_star", "ic_full") | % { C:\app\scripts\inkscape_to_png.ps1 -img $_ -f design-MyMap-forscript.svg }

И скрипт создаст все ваши чертежи во всех разрешениях (ldpi, mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi) в d: \ temp \ drawable-xyz ...

Так что удобная экономия времени.

0 голосов
/ 09 апреля 2014

Лучший способ: создавать изображения с высоким разрешением, а затем уменьшать их.

Если вы используете Photoshop, это будет кусок пирога!

Моя раздвоенная версия Вывод Android Assets.jsx Сценарий Автоматизируйте процесс уменьшения масштаба для всех точек на дюйм : -)

В один клик создаст :

  • все раскладные - ???? папки
  • со всеми версиями уменьшенных изображений all ваши файлы psd или png в высоком разрешении.

Итак, просто создайте изображения xxxhdpi , а затем уменьшите их с помощью сценария.

Мудрое создание исходных изображений и изображений с высоким разрешением в виде , кратного 16 , целесообразно, поскольку они будут правильно уменьшены , как показано в этой таблице:

ldpi   mdpi   tvdpi     hdpi    xhdpi   xxhdpi  xxxhdpi
0,75   1      1,33     1,5     2       3       4

3      4      5,33     6       8       12      16
6      8      10,67    12      16      24      32
9      12     16       18      24      36      48
12     16     21,33    24      32      48      64
15     20     26,67    30      40      60      80
18     24     32       36      48      72      96
21     28     37,33    42      56      84      112
24     32     42,67    48      64      96      128
27     36     48       54      72      108     144
30     40     53,33    60      80      120     160
etc....

Надеюсь, это поможет

Примечание:

tvdpi - это редкий случай, так что мне все равно, когда его уменьшают до значений " no integer ".

Кредиты:

Предыдущие версии этого скрипта, к которым я добавил поддержку xxxhdpi и xxhdpi, доступны здесь и здесь

...