在 Android 中使用 SVG 图像的最简单方法是什么？

Question

为了在 Android 中使用 SVG 图像并避免令人沮丧的创建不同分辨率和为每个分辨率删除文件，我找到了无数的库。当应用程序有很多图标或图像时，这会变得非常烦人。

在 Android 中使用 SVG 图像的最简单易用的库的分步过程是什么？

我还使用 Android Studio 和 Illustrator 来生成我的图标和图像。

Answer 1

UPDATE: DO NOT use this old answer. Better use

我发现 svg-android 非常容易使用，所以一步一步的说明在这里：

从以下位置下载库：https://code.google.com/p/svg-android/downloads/list。撰写本文时的最新版本是：svg-android-1.1.jar
将 JAR 文件放在 lib 目录中。
将您的 *.svg 文件保存在 res/drawable 目录中（在 Illustrator 中，只需按 保存即可as 和 select .svg)

使用 SVG 库在 activity 中编写以下代码：

 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());

您可以像这样减少样板代码：

我很容易地制作了一个简单的 class 来包含过去的代码并减少样板代码，如下所示：

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 acceleration in some devices, such as Samsung
        imageView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
        imageView.setImageDrawable(svg.createPictureDrawable());
    }
}

现在我可以在activity中这样调用它了：

    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);

Answer 2

Android Studio 从 1.4 onwards

开始支持 SVG

这是 how to import 上的视频。

Answer 3

首先您需要通过以下简单步骤导入 SVG 文件。

右键单击项目的可绘制文件夹(app/res/drawable)
单击新建
Select 矢量资产

如果图像在您的计算机中可用，则 select 本地 svg 文件。

之后，select图片路径。如果需要，对话框右侧还提供更改图像大小的选项。这样SVG图片就导入到你的项目中了

之后，要使用此图像，请使用相同的步骤：

@drawable/yourimagename

Answer 4

试用 SVG2VectorDrawable 插件。转到 首选项 → 插件 → 浏览插件 并安装 SVG2VectorDrawable。它非常适合将 svg 文件转换为矢量绘图。

安装完成后，您会在帮助 (?) 图标右侧的工具栏部分找到一个图标。

Answer 5

而不是添加库来增加你的APK file size, I will suggest you to convert SVG to drawable using Android SVG to VectorDrawable。

并在Gradle中添加vectorDrawables.useSupportLibrary = true。

Answer 6

1。您需要将 SVG 转换为 XML 才能在 Android 项目中使用。

1.1 你可以用Android SVG to VectorDrawable来做到这一点，但它不支持SVG的所有特性，比如一些渐变。

1.2 您可以通过 Android Studio 进行转换，但它可能会使用一些仅支持 API 24 及更高版本的功能，这会导致您的应用程序在旧设备上崩溃。

并在Gradle文件中添加vectorDrawables.useSupportLibrary = true并像这样使用它：

<android.support.v7.widget.AppCompatImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                app:srcCompat="@drawable/ic_item1" />

2。使用这个库 SVG-Android that supports these features

在应用程序中添加此代码class:

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

并像这样使用 SVG：

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

Answer 7

右键单击drawable目录，按New，然后转到Vector assets
将资产类型从剪贴画更改为本地
浏览您的文件
输入尺码
然后单击下一步，然后单击完成

您可用的 SVG 图像将在 drawable 目录中生成。

Answer 8

您可以使用线圈库加载 SVG 文件。只需在文件 build.gradle:

中添加这些行

// ... Coil (https://github.com/coil-kt/coil)
implementation("io.coil-kt:coil:0.12.0")
implementation("io.coil-kt:coil-svg:0.12.0")

然后添加一个扩展函数：

fun AppCompatImageView.loadSvg(url: String) {
    val imageLoader = ImageLoader.Builder(this.context)
        .componentRegistry { add(SvgDecoder(this@loadSvg.context)) }
        .build()

    val request = ImageRequest.Builder(this.context)
        .crossfade(true)
        .crossfade(500)
        .data(url)
        .target(this)
        .build()

    imageLoader.enqueue(request)
}

然后在您的 activity 或片段中调用此方法：

your_image_view.loadSvg("your_file_name.svg")

Answer 9

试试这个：

下一步：

现在编辑图像或图标名称并保存：

在 Android 中使用 SVG 图像的最简单方法是什么？

What is the easiest way to use SVG images in Android?

svg

android

androidsvg

您可以像这样减少样板代码：

1。您需要将 SVG 转换为 XML 才能在 Android 项目中使用。

2。使用这个库 SVG-Android that supports these features