You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Android Auto中MediaItem标题添加类似Spotify标签的实现方案咨询

实现Spotify式带标签的Toolbar标题

先看你提到的效果:
Spotify式标题标签

你尝试用SpannableString+ImageSpan设置builder.setTitle()没成功,核心原因是系统默认的Toolbar Title TextView通常会限制Span渲染,或内部文本处理逻辑导致Span失效。Spotify大概率是通过自定义Toolbar布局实现的,下面给你两种可行方案:

方案一:自定义Toolbar布局(最可靠)

直接抛弃系统默认Title,自行编写Toolbar布局结构,自由控制标题和标签的位置:

  1. 创建自定义Toolbar布局文件res/layout/custom_toolbar.xml:
<androidx.appcompat.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/custom_toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center_vertical"
        android:orientation="horizontal"
        android:paddingHorizontal="16dp">

        <!-- 主标题文本 -->
        <TextView
            android:id="@+id/toolbar_main_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="你的标题"
            android:textColor="@android:color/white"
            android:textSize="?attr/textAppearanceHeadline6"/>

        <!-- 标签图标 -->
        <ImageView
            android:layout_width="22dp"
            android:layout_height="22dp"
            android:layout_marginStart="8dp"
            android:src="@drawable/your_tag_icon"
            android:contentDescription="标签"/>

    </LinearLayout>

</androidx.appcompat.widget.Toolbar>
  1. 在Activity中启用自定义Toolbar:
override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)
    
    val toolbar = findViewById<Toolbar>(R.id.custom_toolbar)
    setSupportActionBar(toolbar)
    // 隐藏系统默认Title
    supportActionBar?.setDisplayShowTitleEnabled(false)
    
    // 设置标题文本
    val titleTv = findViewById<TextView>(R.id.toolbar_main_title)
    titleTv.text = "发现"
}

方案二:强制让系统Toolbar的Title支持ImageSpan

如果不想自定义布局,可以尝试获取Toolbar内部的Title TextView,直接给它设置SpannableString:

val toolbar = findViewById<Toolbar>(R.id.toolbar)
setSupportActionBar(toolbar)

// 遍历Toolbar子View找到Title TextView
for (child in toolbar.children) {
    if (child is TextView && child.text == supportActionBar?.title) {
        val spannable = SpannableString("发现 ")
        val tagDrawable = resources.getDrawable(R.drawable.your_tag_icon, theme).apply {
            setBounds(0, 0, intrinsicWidth, intrinsicHeight)
        }
        val imageSpan = ImageSpan(tagDrawable, ImageSpan.ALIGN_BOTTOM)
        spannable.setSpan(imageSpan, spannable.length - 1, spannable.length, Spannable.SPAN_INCLUSIVE_EXCLUSIVE)
        child.text = spannable
        break
    }
}

注意:这种方法依赖系统Toolbar的内部实现,不同Android版本、AppCompat库版本可能失效,优先推荐方案一。

内容的提问来源于stack exchange,提问作者january

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.31 16:30:46