在Android Studio中导入SVG文件

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

Import n svg file in Android Studio

问题

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

新建 - 导入资源...

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

例如：

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

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

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

  1. @OptIn(ExperimentalFoundationApi::class)
  2. @Composable
  3. fun Show_map(picName:String) {
  4.     val mContext = LocalContext.current
  6.     Canvas(modifier = Modifier.fillMaxSize()) {
  7.         val svgString = loadSvgFromRaw(mContext, R.raw.nomap)
  8.         val imageBitmap = convertSvgToImageBitmap(mContext,svgString!!)
  9.         imageBitmap?.let {
  10.             drawImage(
  11.                 image = it,
  12.                 topLeft = Offset.Zero,
  13.                 alpha = 1.0f
  14.             )
  15.         }
  16.     }
  17. }
  19. fun loadSvgFromRaw(context: Context, resourceId: Int): String? {
  20.     return try {
  21.         val inputStream = context.resources.openRawResource(resourceId)
  22.         val size = inputStream.available()
  23.         val buffer = ByteArray(size)
  24.         inputStream.read(buffer)
  25.         inputStream.close()
  26.         String(buffer, Charsets.UTF_8)
  27.     } catch (e: Exception) {
  28.         e.printStackTrace()
  29.         null
  30.     }
  31. }
  33. fun convertSvgToImageBitmap(context: Context,svgString: String): ImageBitmap {
  34.     val svgString = loadSvgFromRaw(context, R.raw.nomap)
  35.     val svg = SVG.getFromString(svgString)
  36.     val targetWidth = 200 
  37.     val targetHeight = 200 
  39.     val requestOptions = RequestOptions()
  40.         .override(targetWidth, targetHeight)
  41.         .diskCacheStrategy(DiskCacheStrategy.NONE)
  42.         .skipMemoryCache(true)
  44.     val drawable = Glide.with(context)
  45.         .`as`(Drawable::class.java)
  46.         .load(svg)
  47.         .transition(DrawableTransitionOptions.withCrossFade())
  48.         .apply(requestOptions)
  49.         .submit()
  50.         .get()
  52.     return (drawable as BitmapDrawable).bitmap.asImageBitmap()
  53. }

但在运行时的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.

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

Are there other ways to achieve the goal?

edit:
I have tried now ...

  1.     @OptIn(ExperimentalFoundationApi::class)
  2. @Composable
  3. fun Show_map(picName:String) {
  4.     val mContext = LocalContext.current
  6.     Canvas(modifier = Modifier.fillMaxSize()) {
  7.         val svgString = loadSvgFromRaw(mContext, R.raw.nomap)
  8.         val imageBitmap = convertSvgToImageBitmap(mContext,svgString!!)
  9.         imageBitmap?.let {
  10.             drawImage(
  11.                 image = it,
  12.                 topLeft = Offset.Zero,
  13.                 alpha = 1.0f
  14.             )
  15.         }
  16.     }
  17. }
  18. fun loadSvgFromRaw(context: Context, resourceId: Int): String? {
  19.     return try {
  20.         val inputStream = context.resources.openRawResource(resourceId)
  21.         val size = inputStream.available()
  22.         val buffer = ByteArray(size)
  23.         inputStream.read(buffer)
  24.         inputStream.close()
  25.         String(buffer, Charsets.UTF_8)
  26.     } catch (e: Exception) {
  27.         e.printStackTrace()
  28.         null
  29.     }
  30. }
  32. fun convertSvgToImageBitmap(context: Context,svgString: String): ImageBitmap {
  33.     val svgString = loadSvgFromRaw(context, R.raw.nomap)
  34.     val svg = SVG.getFromString(svgString)
  35.     val targetWidth = 200 
  36.     val targetHeight = 200 
  38.     val requestOptions = RequestOptions()
  39.         .override(targetWidth, targetHeight)
  40.         .diskCacheStrategy(DiskCacheStrategy.NONE)
  41.         .skipMemoryCache(true)
  43.     val drawable = Glide.with(context)
  44.         .`as`(Drawable::class.java)
  45.         .load(svg)
  46.         .transition(DrawableTransitionOptions.withCrossFade())
  47.         .apply(requestOptions)
  48.         .submit()
  49.         .get()
  51.     return (drawable as BitmapDrawable).bitmap.asImageBitmap()
  52. }

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

  1. // 以下是要翻译的内容：
  3. @OptIn(ExperimentalFoundationApi::class)
  4. @Composable
  5. fun Show_map(picName:String) {
  6.     val mContext = LocalContext.current
  8.     Canvas(modifier = Modifier.fillMaxSize()) {
  9.         val svgString = loadSvgFromRaw(mContext, R.raw.nomap)
  11.         GlobalScope.launch {
  12.             val imageBitmap = convertSvgToImageBitmap(mContext,svgString!!)
  14.           //   SVG.registerExternalFileResolver()
  16.             imageBitmap?.let {
  17.                 drawImage(
  18.                     image = it,
  19.                     topLeft = Offset.Zero,
  20.                     alpha = 1.0f
  21.                 )
  22.             }
  23.         }
  24.     }
  25. }
  26. fun loadSvgFromRaw(context: Context, resourceId: Int): String? {
  27.     return try {
  28.         val inputStream = context.resources.openRawResource(resourceId)
  29.         val size = inputStream.available()
  30.         val buffer = ByteArray(size)
  31.         inputStream.read(buffer)
  32.         inputStream.close()
  33.         String(buffer, Charsets.UTF_8)
  34.     } catch (e: Exception) {
  35.         e.printStackTrace()
  36.         null
  37.     }
  38. }
  40. suspend fun convertSvgToImageBitmap(context: Context,svgString: String): ImageBitmap {
  41.     val svgString = loadSvgFromRaw(context, R.raw.nomap)
  42.     val svg = SVG.getFromString(svgString)
  43.     val targetWidth = 200
  44.     val targetHeight = 200
  46.     val requestOptions = RequestOptions()
  47.         .override(targetWidth, targetHeight)
  48.         .diskCacheStrategy(DiskCacheStrategy.NONE)
  49.         .skipMemoryCache(true)
  51.     val drawable = Glide.with(context)
  52.         .`as`(Drawable::class.java)
  53.         .load(svg)
  54.         .transition(DrawableTransitionOptions.withCrossFade())
  55.         .apply(requestOptions)
  56.         .submit()
  57.         .get()
  59.     return (drawable as BitmapDrawable).bitmap.asImageBitmap()
  60. }
英文: 
  1.     @OptIn(ExperimentalFoundationApi::class)
  2. @Composable
  3. fun Show_map(picName:String) {
  4.     val mContext = LocalContext.current
  6.     Canvas(modifier = Modifier.fillMaxSize()) {
  7.         val svgString = loadSvgFromRaw(mContext, R.raw.nomap)
  9.         GlobalScope.launch {
  10.             val imageBitmap = convertSvgToImageBitmap(mContext,svgString!!)
  12.           //   SVG.registerExternalFileResolver()
  14.             imageBitmap?.let {
  15.                 drawImage(
  16.                     image = it,
  17.                     topLeft = Offset.Zero,
  18.                     alpha = 1.0f
  19.                 )
  20.             }
  21.         }
  23.     }
  24. }
  25. fun loadSvgFromRaw(context: Context, resourceId: Int): String? {
  26.     return try {
  27.         val inputStream = context.resources.openRawResource(resourceId)
  28.         val size = inputStream.available()
  29.         val buffer = ByteArray(size)
  30.         inputStream.read(buffer)
  31.         inputStream.close()
  32.         String(buffer, Charsets.UTF_8)
  33.     } catch (e: Exception) {
  34.         e.printStackTrace()
  35.         null
  36.     }
  37. }
  39. suspend fun convertSvgToImageBitmap(context: Context,svgString: String): ImageBitmap {
  40.     val svgString = loadSvgFromRaw(context, R.raw.nomap)
  41.     val svg = SVG.getFromString(svgString)
  42.     val targetWidth = 200
  43.     val targetHeight = 200
  45.     val requestOptions = RequestOptions()
  46.         .override(targetWidth, targetHeight)
  47.         .diskCacheStrategy(DiskCacheStrategy.NONE)
  48.         .skipMemoryCache(true)
  50.     val drawable = Glide.with(context)
  51.         .`as`(Drawable::class.java)
  52.         .load(svg)
  53.         .transition(DrawableTransitionOptions.withCrossFade())
  54.         .apply(requestOptions)
  55.         .submit()
  56.         .get()
  58.     return (drawable as BitmapDrawable).bitmap.asImageBitmap()
  59. }

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

  1. implementation("io.coil-kt:coil-compose:2.4.0")
  2. 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

  1. implementation("io.coil-kt:coil-compose:2.4.0")
  2. implementation("io.coil-kt:coil-svg:2.4.0")
  4. @Composable
  5. fun ImageExample() {
  6.     AsyncImage(
  7.         model = R.drawable.boing1,
  8.         contentDescription = "This is an example image"
  9.     )

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
  • android-jetpack-compose
  • android-studio
  • import
  • svg
匿名

发表评论

匿名网友

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

确定