Самый простой способ использовать SVG в Android?


165

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

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

Также я использую Android Studio и Illustrator для создания своих иконок и изображений.



Короткое видео о том, как импортировать svg в андроид-студию: youtube.com/watch?v=8e3I-PYJNHg
Зохаб Али,

Ответы:


337

Сначала вам нужно импортировать svgфайлы, выполнив простые шаги.

  1. Щелкните правой кнопкой мыши на рисовать
  2. Нажмите новый
  3. Выберите векторный актив

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

@drawable/yourimagename

5
Краткий и полезный ответ, без головной боли при импорте внешних файлов SVG в проект.
CodeToLife

2
именно то, что я искал :)
Мохамед Наге

5
Nextкнопка всегда отключена. есть идеи почему?
Mrid

Итак, как мы можем изменить цвет SVG?
Oniya Daniel

Работает как шарм. Ницца!
sud007

19

ОБНОВЛЕНИЕ: НЕ используйте этот старый ответ, лучше используйте это: https://stackoverflow.com/a/39266840/4031815

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

  1. скачать библиотеку с: https://code.google.com/p/svg-android/downloads/list Последняя версия на момент написания этой статьи:svg-android-1.1.jar

  2. Положите банку в libреж.

  3. Сохраните ваш * .svg файл в res/drawabledir (в Illustrator это так же просто, как нажать Save as и выбрать svg)

  4. Используйте в своей деятельности следующее: используйте библиотеку svg:

    ImageView imageView = (ImageView) findViewById(R.id.imgView);
    SVG svg = SVGParser.getSVGFromResource(getResources(), R.drawable.example);
    //The following is needed because of image accelaration in some devices such as samsung
    imageView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
    imageView.setImageDrawable(svg.createPictureDrawable());



Вы можете уменьшить стандартный код, как это

Очень просто, я сделал простой класс, содержащий предыдущий код и уменьшенный шаблонный код, например:

import android.app.Activity;
import android.view.View;
import android.widget.ImageView;

import com.larvalabs.svgandroid.SVG;
import com.larvalabs.svgandroid.SVGParser;

public class SvgImage {

    private static ImageView imageView;
    private Activity activity;
    private SVG svg;
    private int xmlLayoutId;
    private int drawableId;


    public SvgImage(Activity activity, int layoutId, int drawableId) {
        imageView = (ImageView) activity.findViewById(layoutId);
        svg = SVGParser.getSVGFromResource(activity.getResources(), drawableId);
        //Needed because of image accelaration in some devices such as samsung
        imageView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
        imageView.setImageDrawable(svg.createPictureDrawable());
    }
}

Теперь я могу назвать это в действии:

    SvgImage rainSVG = new SvgImage(MainActivity.this, R.id.rainImageView, R.drawable.rain);
    SvgImage thunderSVG = new SvgImage(MainActivity.this, R.id.thunderImageView, R.drawable.thunder);
    SvgImage oceanSVG = new SvgImage(MainActivity.this, R.id.oceanImageView, R.drawable.ocean);
    SvgImage fireSVG = new SvgImage(MainActivity.this, R.id.fireImageView, R.drawable.fire);
    SvgImage windSVG = new SvgImage(MainActivity.this, R.id.windImageView,R.drawable.wind);
    SvgImage universeSVG = new SvgImage(MainActivity.this, R.id.universeImageView,R.drawable.universe);

3
Вы должны пометить свой собственный ответ как принятый вместо предыдущего
Клифф Бертон

1
Когда я пытаюсь добавить файлы SVG, я получаю сообщение об ошибке: Ошибка: имя файла должно заканчиваться на .xml или .png
Sujay UN

1
Почему imageView static? Я вижу здесь огромный красный жук-флаг. SvgImage rainSVG = new SvgImage(MainActivity.this, R.id.rainImageView, R.drawable.rain); SvgImage thunderSVG = new SvgImage(MainActivity.this, R.id.thunderImageView, R.drawable.thunder); rainSVG содержит ссылку, содержащую thunderImageView
DSchmidt

@DSchmidt, это просто указатель на просмотр изображения. Если бы это был мой код, я бы сделал весь класс статическим с помощью одного метода с именем LoadSVG. и, как вы можете видеть, нет смысла загружать данные в частные переменные, к которым нет доступа.
Насреддин Галфут



3

Попробуйте подключаемый модуль SVG2VectorDrawable. Перейдите в Настройки-> Плагины-> Просмотр плагинов и установите SVG2VectorDrawable. Отлично подходит для конвертирования файлов в векторную графику. После установки вы найдете значок для этого в разделе панели инструментов справа от значка справки (?).


У меня не работает - путь к файлу SVG даже не загружается в плагин. Лучший ответ, приведенный выше, намного проще и выполняет свою работу.
DaveNOTDavid

Отличный плагин - быстро конвертирует много SVG в векторные рисунки!
Мортен Холмгаард

2
  1. вам нужно конвертировать SVG в XML для использования в проекте Android.

1.1 вы можете сделать это с этим сайтом: http://inloop.github.io/svg2android/, но он не поддерживает все функции SVG, такие как некоторые градиенты.

1.2 вы можете конвертировать через Android Studio, но он может использовать некоторые функции, которые поддерживают только API 24 и выше, которые могут вызвать сбой вашего приложения на старых устройствах.

и добавьте vectorDrawables.useSupportLibrary = trueв файл Gradle и используйте так:

<android.support.v7.widget.AppCompatImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                app:srcCompat="@drawable/ic_item1" />
  1. используйте эту библиотеку https://github.com/MegatronKing/SVG-Android, которая поддерживает следующие функции: https://github.com/MegatronKing/SVG-Android/blob/master/support_doc.md

добавьте этот код в класс приложения:

public void onCreate() {
    SVGLoader.load(this)
}

и используйте SVG так:

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_android_red"/>

Зачем использовать загрузчик SVG, если у вас прямой подход @ Pallavi? Есть ли преимущество использования загрузчика?
Taslim Oseni

@Taslim поддерживаемых функций больше, чем обычно. Вы можете увидеть поддерживаемые функции и посмотреть.
Саджад Аббаси

0

1) Щелкните правой кнопкой мыши по каталогу рисования, затем перейдите в новый, затем перейдите к векторным активам 2) измените тип ресурса с картинки на локальный 3) просмотрите свой файл 4) укажите размер 5), затем нажмите «Далее», затем готово каталог

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.