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

Question

我试图在 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_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/myTV"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        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)
    }
}

Answer 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:width="28sp"
    android:height="28sp"
    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 才能使其看起来正确