Android 修改SVG属性并显示图片（AndroidSvg）

引入依赖：

dependencies {
	implementation 'com.caverock:androidsvg-aar:1.4'
}

核心代码：

import com.caverock.androidsvg.SVG
import org.w3c.dom.Document
import java.io.StringWriter
import javax.xml.transform.OutputKeys
import javax.xml.transform.TransformerFactory
import javax.xml.transform.dom.DOMSource
import javax.xml.transform.stream.StreamResult
import java.io.InputStream
import javax.xml.parsers.DocumentBuilderFactory


/**
 * 打开svg文件并设置（修改）某个属性
 */
fun openSvgAndSetAttribute(
    svgInputStream: InputStream,
    elementId: String,
    attrName: String,
    value: String
): SVG {
    // 解析 SVG 文件为 Document
    val document: Document = DocumentBuilderFactory.newInstance().newDocumentBuilder().parse(svgInputStream)
    // 修改某个元素，例如更改颜色
    val element = document.getElementById(elementId)
    element?.setAttribute(attrName, value) // 将填充色修改为红色
    val s = documentToString(document)
    return SVG.getFromString(s)
}

/**
 * 将 Document 转换为字符串
 */
private fun documentToString(document: Document): String {
    val transformer = TransformerFactory.newInstance().newTransformer()
    //设置是否省略 XML 声明。OMIT_XML_DECLARATION这是一个常量，表示是否在输出的 XML 文件顶部包含 XML 声明（例如 <?xml version="1.0" encoding="UTF-8"?>）。
    transformer.setOutputProperty(OutputKeys.OMIT_XML_DECLARATION, "yes")
    //设置是否在生成的 XML 中启用缩进格式。
    transformer.setOutputProperty(OutputKeys.INDENT, "yes")
    val writer = StringWriter()
    transformer.transform(DOMSource(document), StreamResult(writer))
    return writer.toString()
}

使用方法：

override fun onCreate(savedInstanceState: Bundle?) {
	//代码省略...
	
	val svgImageView = findViewById<SVGImageView>(R.id.svg_image_view)
	val svg = openSvgAndSetAttribute(assets.open("example.svg"),"exampleCircle","fill","#00ff00")
	// 显示修改后的 SVG
	svgImageView.setSVG(svg)
}

布局文件：

	<com.caverock.androidsvg.SVGImageView
        android:id="@+id/svg_image_view"
        android:layout_width="400dp"
        android:layout_height="300dp"/>

example.svg 示例：

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200" viewBox="0 0 200 200">
    <!-- 定义一个矩形 -->
    <rect x="10" y="10" width="180" height="180" fill="#87CEEB" stroke="#000" stroke-width="2" />

    <!-- 定义一个圆形 -->
    <circle id="exampleCircle" cx="100" cy="100" r="50" fill="#FF6347" stroke="#000" stroke-width="2" />

    <!-- 定义一条直线 -->
    <line x1="50" y1="150" x2="150" y2="50" stroke="#000" stroke-width="2" />

    <!-- 添加文本 -->
    <text x="50" y="190" font-family="Arial" font-size="14" fill="#000">这是一个示例 SVG</text>
</svg>

如果启用了混淆，需要在 proguard-rules.pro 中添加：

-keep class javax.xml.** { *; }
-keep class org.w3c.dom.** { *; }
-keep class org.xml.sax.** { *; }

假如直接使用如下方式操作元素属性：

// 获取SVG的根元素
val svgRoot = svg.getRootElement()

// 可以进一步操作SVG元素，例如设置宽高等属性
svgRoot.setDocumentWidth("100%")
svgRoot.setDocumentHeight("100%")

则会提示：

Cannot access 'getRootElement': it is package-private in 'SVG'

官网地址：https://bigbadaboom.github.io/androidsvg/index.html