在Android Studio中导入SVG文件

huangapple go评论159阅读模式
英文:

Import n svg file in Android Studio

问题

我尝试在Android Studio中导入svg文件,通过

新建 - 导入资源...

但似乎对svg没有完全的支持... 它会将文件转换为xml,但文本会消失

例如:

ERROR @ line 27: <text> is not supported
ERROR @ line 27: <tspan> is not supported

是否有其他方法可以实现这个目标?

编辑:
我现在尝试了...

@OptIn(ExperimentalFoundationApi::class)
@Composable
fun Show_map(picName:String) {
    val mContext = LocalContext.current

    Canvas(modifier = Modifier.fillMaxSize()) {
        val svgString = loadSvgFromRaw(mContext, R.raw.nomap)
        val imageBitmap = convertSvgToImageBitmap(mContext,svgString!!)
        imageBitmap?.let {
            drawImage(
                image = it,
                topLeft = Offset.Zero,
                alpha = 1.0f
            )
        }
    }
}

fun loadSvgFromRaw(context: Context, resourceId: Int): String? {
    return try {
        val inputStream = context.resources.openRawResource(resourceId)
        val size = inputStream.available()
        val buffer = ByteArray(size)
        inputStream.read(buffer)
        inputStream.close()
        String(buffer, Charsets.UTF_8)
    } catch (e: Exception) {
        e.printStackTrace()
        null
    }
}

fun convertSvgToImageBitmap(context: Context,svgString: String): ImageBitmap {
    val svgString = loadSvgFromRaw(context, R.raw.nomap)
    val svg = SVG.getFromString(svgString)
    val targetWidth = 200 
    val targetHeight = 200 

    val requestOptions = RequestOptions()
        .override(targetWidth, targetHeight)
        .diskCacheStrategy(DiskCacheStrategy.NONE)
        .skipMemoryCache(true)

    val drawable = Glide.with(context)
        .`as`(Drawable::class.java)
        .load(svg)
        .transition(DrawableTransitionOptions.withCrossFade())
        .apply(requestOptions)
        .submit()
        .get()

    return (drawable as BitmapDrawable).bitmap.asImageBitmap()
}

但在运行时的get()处出现了错误 - 您必须在后台线程上调用此方法 - 之前在Android Studio中没有显示错误

有什么想法吗?- 应用程序显示一个白色的Activity

英文:

I have tried to import svg files in Android Studio via

New - Import Asset ...

but it seems there is no fully support for svg ... it converts the file to xml but the text disappears

e.g.

  ERROR @ line 27: <text> is not supported
ERROR @ line 27: <tspan> is not supported

Are there other ways to achieve the goal?

edit:
I have tried now ...

    @OptIn(ExperimentalFoundationApi::class)
@Composable
fun Show_map(picName:String) {
    val mContext = LocalContext.current

    Canvas(modifier = Modifier.fillMaxSize()) {
        val svgString = loadSvgFromRaw(mContext, R.raw.nomap)
        val imageBitmap = convertSvgToImageBitmap(mContext,svgString!!)
        imageBitmap?.let {
            drawImage(
                image = it,
                topLeft = Offset.Zero,
                alpha = 1.0f
            )
        }
    }
}
fun loadSvgFromRaw(context: Context, resourceId: Int): String? {
    return try {
        val inputStream = context.resources.openRawResource(resourceId)
        val size = inputStream.available()
        val buffer = ByteArray(size)
        inputStream.read(buffer)
        inputStream.close()
        String(buffer, Charsets.UTF_8)
    } catch (e: Exception) {
        e.printStackTrace()
        null
    }
}

fun convertSvgToImageBitmap(context: Context,svgString: String): ImageBitmap {
    val svgString = loadSvgFromRaw(context, R.raw.nomap)
    val svg = SVG.getFromString(svgString)
    val targetWidth = 200 
    val targetHeight = 200 

    val requestOptions = RequestOptions()
        .override(targetWidth, targetHeight)
        .diskCacheStrategy(DiskCacheStrategy.NONE)
        .skipMemoryCache(true)

    val drawable = Glide.with(context)
        .`as`(Drawable::class.java)
        .load(svg)
        .transition(DrawableTransitionOptions.withCrossFade())
        .apply(requestOptions)
        .submit()
        .get()

    return (drawable as BitmapDrawable).bitmap.asImageBitmap()
}

But got an error at get() on runtime - You must call this method on a background thread - before shows Android Studio no error

Any ideas? - app shows a white Activity

答案1

得分: 1

使用 AndroidSVG 库:AndroidSVG 是一个库,允许您在 Android 中直接渲染 SVG 图像。您可以通过在您的应用程序的 build.gradle 文件中包含以下依赖项来将该库添加到您的项目中:

implementation 'com.caverock:androidsvg:1.4'

英文:

Use AndroidSVG library: AndroidSVG is a library that allows you to directly render SVG images in Android. You can add the library to your project by including the following dependency in your app's build.gradle file:

implementation 'com.caverock:androidsvg:1.4'

答案2

得分: 0

// 以下是要翻译的内容:

@OptIn(ExperimentalFoundationApi::class)
@Composable
fun Show_map(picName:String) {
    val mContext = LocalContext.current

    Canvas(modifier = Modifier.fillMaxSize()) {
        val svgString = loadSvgFromRaw(mContext, R.raw.nomap)

        GlobalScope.launch {
            val imageBitmap = convertSvgToImageBitmap(mContext,svgString!!)

          //   SVG.registerExternalFileResolver()

            imageBitmap?.let {
                drawImage(
                    image = it,
                    topLeft = Offset.Zero,
                    alpha = 1.0f
                )
            }
        }
    }
}
fun loadSvgFromRaw(context: Context, resourceId: Int): String? {
    return try {
        val inputStream = context.resources.openRawResource(resourceId)
        val size = inputStream.available()
        val buffer = ByteArray(size)
        inputStream.read(buffer)
        inputStream.close()
        String(buffer, Charsets.UTF_8)
    } catch (e: Exception) {
        e.printStackTrace()
        null
    }
}

suspend fun convertSvgToImageBitmap(context: Context,svgString: String): ImageBitmap {
    val svgString = loadSvgFromRaw(context, R.raw.nomap)
    val svg = SVG.getFromString(svgString)
    val targetWidth = 200
    val targetHeight = 200

    val requestOptions = RequestOptions()
        .override(targetWidth, targetHeight)
        .diskCacheStrategy(DiskCacheStrategy.NONE)
        .skipMemoryCache(true)

    val drawable = Glide.with(context)
        .`as`(Drawable::class.java)
        .load(svg)
        .transition(DrawableTransitionOptions.withCrossFade())
        .apply(requestOptions)
        .submit()
        .get()

    return (drawable as BitmapDrawable).bitmap.asImageBitmap()
}
英文:
    @OptIn(ExperimentalFoundationApi::class)
@Composable
fun Show_map(picName:String) {
    val mContext = LocalContext.current

    Canvas(modifier = Modifier.fillMaxSize()) {
        val svgString = loadSvgFromRaw(mContext, R.raw.nomap)

        GlobalScope.launch {
            val imageBitmap = convertSvgToImageBitmap(mContext,svgString!!)

          //   SVG.registerExternalFileResolver()

            imageBitmap?.let {
                drawImage(
                    image = it,
                    topLeft = Offset.Zero,
                    alpha = 1.0f
                )
            }
        }

    }
}
fun loadSvgFromRaw(context: Context, resourceId: Int): String? {
    return try {
        val inputStream = context.resources.openRawResource(resourceId)
        val size = inputStream.available()
        val buffer = ByteArray(size)
        inputStream.read(buffer)
        inputStream.close()
        String(buffer, Charsets.UTF_8)
    } catch (e: Exception) {
        e.printStackTrace()
        null
    }
}

suspend fun convertSvgToImageBitmap(context: Context,svgString: String): ImageBitmap {
    val svgString = loadSvgFromRaw(context, R.raw.nomap)
    val svg = SVG.getFromString(svgString)
    val targetWidth = 200
    val targetHeight = 200

    val requestOptions = RequestOptions()
        .override(targetWidth, targetHeight)
        .diskCacheStrategy(DiskCacheStrategy.NONE)
        .skipMemoryCache(true)

    val drawable = Glide.with(context)
        .`as`(Drawable::class.java)
        .load(svg)
        .transition(DrawableTransitionOptions.withCrossFade())
        .apply(requestOptions)
        .submit()
        .get()

    return (drawable as BitmapDrawable).bitmap.asImageBitmap()
}

I have changed the code it does not work anyway get an error

Failed to find any ModelLoaders registered for model class: class com.caverock.androidsvg.SVG

答案3

得分: 0

已尝试多次 - 太多的代码没有效果

更改为 Coil

implementation("io.coil-kt:coil-compose:2.4.0")
implementation("io.coil-kt:coil-svg:2.4.0")

@Composable
fun ImageExample() {
AsyncImage(
model = R.drawable.boing1,
contentDescription = "这是一个示例图像"
)
}

而且... - 与 svg 文件一起工作非常容易

另一个解决方法是在 Adobe Illustrator 中导出 svg 文件并设置对话框以将文本转换为轮廓

英文:

Tried several times - too much code for nothing

Changed to Coil

implementation("io.coil-kt:coil-compose:2.4.0")
implementation("io.coil-kt:coil-svg:2.4.0")

@Composable
fun ImageExample() {
    AsyncImage(
        model = R.drawable.boing1,
        contentDescription = "This is an example image"
    )

And ... - its working very easy with svg files

another workaround is to export svg files in Adobe Illustrator
and setting dialog to convert text to outline

huangapple
  • 本文由 发表于 2023年5月24日 20:00:39
  • 转载请务必保留本文链接:https://go.coder-hub.com/76323292.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定