Найпростіший спосіб використання SVG в Android?


165

Я знайшов безліч бібліотек для того, щоб використовувати svg в Android і уникнути розчарувального створення різних дозволів і видалення файлів для кожної роздільної здатності, це стає дуже прикро, коли у додатку є багато піктограм або зображень.

Хтось може бути люб’язним, щоб надати покроковий процес найпростішої у використанні бібліотеки для використання SVG в Android, я впевнений, що це допоможе і багатьом іншим.

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



Коротке відео про те, як імпортувати svg в студію Android: youtube.com/watch?v=8e3I-PYJNHg
Zohab Ali

Відповіді:


337

Спочатку потрібно імпортувати svgфайли, виконавши нескладні кроки.

  1. Клацніть правою кнопкою миші на рисунку
  2. Клацніть нове
  3. Виберіть векторний актив

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

@drawable/yourimagename

5
Коротка та корисна відповідь, без головного болю, коли ви імпортуєте зовнішні файли svg до проекту.
CodeToLife

2
саме те, що я шукав :)
Mohamed Nageh

5
Nextкнопка завжди відключена. будь-яка ідея чому?
середа

Отже, як ми можемо змінити колір 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 (У ілюстраторі так само просто, як натиснути «Зберегти» та вибрати 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? Я бачу тут hugh червоний прапор помилок. 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. і як ви бачите, немає сенсу завантажувати дані до приватних змінних, до яких не можна отримати доступ.
Nasreddine Galfout



3

Спробуйте плагін SVG2VectorDrawable. Перейдіть у розділ Налаштування-> Плагіни-> Огляд плагінів та встановіть SVG2VectorDravable. Відмінно підходить для перетворення файлів провисань у вектор, що малюється. Після встановлення ви знайдете піктограму для цього в розділі панелі інструментів праворуч від значка довідки (?).


Не працює для мене - шлях до файлу SVG навіть не завантажується у плагін. Найкраща відповідь, подана вище, набагато простіша і виконує роботу.
DaveNOTDavid

Чудовий плагін - швидко перетворив багато SVG у векторні малюнки!
Мортен Холмгаард

2
  1. вам потрібно перетворити SVG в XML для використання в андроїд-проекті.

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 підтримувані функції - це більше, ніж звичайний спосіб. ви можете бачити підтримувані функції та бачити.
sajad abbasi

0

1) Клацніть правою кнопкою миші на директорії, що перетягується, потім перейдіть до нового, потім перейдіть до векторних активів 2) змініть тип об’єкта з графічного зображення на локальний 3) перегляньте файл 4) надайте розмір 5), потім натисніть наступний, потім зроблено. каталог

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.