Unicode 字符与 TextView 中的文本大小不同

Posted 2023-02-24

【中文标题】Unicode 字符与 TextView 中的文本大小不同

【英文标题】：Unicode character not same size as text in TextView

【发布时间】：2021-03-12 20:27:54

【问题描述】：

我试图在 TextView 中显示一个箭头 unicode 符号，但由于某种原因，该字符与使用 html.fromHtml 代码的文本站点的大小不匹配。有什么办法可以解决这个问题吗？

活动布局

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_
    android:layout_
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/myTV"
        android:layout_
        android:layout_
        android:textAppearance="?android:textAppearanceLarge"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

活动类

class MainActivity : AppCompatActivity() 
    override fun onCreate(savedInstanceState: Bundle?) 
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val mTV = findViewById<TextView>(R.id.myTV)

        mTV.text = Html.fromHtml(getString(R.string.app_name) + " \u2192 " + getString(R.string.app_name), Html.FROM_HTML_MODE_COMPACT)
    

【问题讨论】：

Why is TextView showing the unicode right arrow (\u2192) at the bottom line?

@Onik 尝试在多行上执行相同操作时，这不起作用

【参考方案1】：

Roboto（系统字体）doesn't have arrow glyphs，所以您看到的是某种呃-哦后备，您似乎无法设置样式（包括通过 HTML 字符串中的样式标签） .所以你可以做的就是在其中粘贴一个<img> 标签，使用ImageGetter 为其提供可绘制对象

class MainActivity : AppCompatActivity() 
    @RequiresApi(Build.VERSION_CODES.N)
    override fun onCreate(savedInstanceState: Bundle?) 
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val mTV = findViewById<TextView>(R.id.myTV)
        val appName = getString(R.string.app_name)
        val template = "$appName <img src=\"arrow\"/> $appName"
        mTV.text = Html.fromHtml(template, Html.FROM_HTML_MODE_COMPACT, imageGetter, null)
    

    private val imageGetter = Html.ImageGetter  name ->
        val resId = when (name) 
            "arrow" -> R.drawable.ic_baseline_arrow_right_alt_24
            else -> throw IllegalArgumentException("what the heck is $name")
        

        ResourcesCompat.getDrawable(resources, resId, theme)?.apply 
            // size the arrow here - we need to scale it with the font size,
            // so set its width and height in the XML to sp units
            setBounds(0, 0, intrinsicWidth, intrinsicHeight)
        
    

所以这基本上是使用img标签中的src属性的值并将其传递给imageGetter，这只是对可绘制资源ID的简单映射。

然后它加载并调整可绘制对象的大小——它需要缩放到等效的sp 值，因此它会随着文本大小进行缩放。将其设置在可绘制对象中是最简单的，您可以调整这些值以使其相对于文本大小合适：

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:
    android:
    android:viewportWidth="24"
    android:viewportHeight="24"
    android:tint="?attr/colorOnSurface">
  <path
      android:fillColor="@android:color/white"
      android:pathData="M16.01,11H4v2h12.01v3L20,12l-3.99,-4z"/>
</vector>

这只是baseline_arrow_right drawable，您可以从资源管理器中的矢量资产中获得。注意width和height在sp而不是dp，否则它不会随系统字体大小缩放。

您还需要确保它的主题正确，我将颜色设置为colorOnSurface，但您可以自己解决！有 ?android:attr/textColor，但您可能需要将图像设置为 enabled 才能使其看起来正确

【讨论】：

澄清一下，如果android:fillColor="@android:color/white" 不存在会怎样？

据我所知，它只是将路径定义为有填充，所以它是一个实心形状 - 还有一个 strokeColor 一个，如果你没有，它可能不会显示，因为路径上没有任何东西被绘制。但这就是导入矢量资产时 XML 的外观，我只是更改了色调和尺寸