Android中TextView设置自定义Tooltip背景底部截断问题求助

我在Android中创建了类似Tooltip形状的自定义背景，设置给TextView后，背景底部出现截断无法完整显示，求解决办法，谢谢。

自定义背景代码（tool_tip_shape.xml） #

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:gravity="bottom|center_horizontal">
        <rotate android:fromDegrees="45" android:toDegrees="45"
            android:pivotX="50%" android:pivotY="50%" >
            <shape android:shape="rectangle">
                <size android:width="24dp" android:height="24dp" />
                <corners android:bottomRightRadius="2dp"/>
                <gradient android:type="linear"
                    android:angle="0"
                    android:endColor="@color/grey"
                    android:startColor="@color/grey" />
            </shape>
        </rotate>
    </item>

    <item android:bottom="6dp">
        <shape android:shape="rectangle">
            <size android:width="120dp" android:height="40dp" />
            <gradient android:type="linear"
                android:angle="0"
                android:endColor="@color/grey"
                android:startColor="@color/grey" />
            <corners android:radius="10dp" />
        </shape>
    </item>

</layer-list>

布局代码 #

<?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"
    android:id="@+id/main"
    tools:context=".MainActivity">

    <!-- 设置背景的TextView -->
    <TextView
        android:id="@+id/toolTipText"
        style="@style/TextAppearance.AppCompat.Small"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginBottom="4dp"
        android:background="@drawable/tool_tip_shape"
        android:fontFamily="sans-serif-condensed-medium"
        android:gravity="center"
        android:text="gggggbbbb"
        android:textColor="@color/black"
        app:layout_constraintBottom_toTopOf="@+id/constraintLayout"
        app:layout_constraintEnd_toEndOf="@+id/constraintLayout"
        app:layout_constraintStart_toStartOf="@+id/constraintLayout" />

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/constraintLayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="184dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        tools:context=".MainActivity">

        <TextView
            android:id="@+id/txt"
            style="@style/TextAppearance.AppCompat.Medium"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="24dp"
            android:text="00:00"
            android:textColor="@color/black"
            android:visibility="gone"
            app:layout_constraintBottom_toTopOf="@+id/fab"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent" />

        <ProgressBar
            android:id="@+id/progress_bar"
            style="@style/CircularDeterminateProgressBar"
            android:layout_width="120dp"
            android:layout_height="120dp"
            android:progress="0"
            android:visibility="gone"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <com.google.android.material.floatingactionbutton.FloatingActionButton
            android:id="@+id/fab"
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:layout_margin="10dp"
            android:backgroundTint="@color/white"
            android:padding="10dp"
            android:src="@drawable/ic_baseline_mic_24"
            app:borderWidth="0dp"
            app:fabCustomSize="80dp"
            app:layout_constraintBottom_toBottomOf="@+id/progress_bar"
            app:layout_constraintEnd_toEndOf="@+id/progress_bar"
            app:layout_constraintStart_toStartOf="@+id/progress_bar"
            app:layout_constraintTop_toTopOf="@+id/progress_bar"
            app:tint="@color/black" />

    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

效果截图 #

• 自定义背景预览：
  
• 布局中显示效果（底部截断）：
  

问题原因及解决办法 #

原因分析 #

TextView设置wrap_content高度时，仅会根据内部文本高度计算自身高度，自定义背景底部的三角形超出了文本内容范围，导致被截断；同时layer-list中底部矩形的偏移设置没有给三角形留出足够的显示空间。

解决步骤 #

1. 给TextView添加底部内边距
   在TextView中添加底部内边距，让TextView高度覆盖三角形区域：

<TextView
    ...
    android:paddingBottom="12dp"
    ... />

2. 调整layer-list的布局偏移
   修改tool_tip_shape.xml，给矩形区域增加底部偏移，确保三角形完整显示：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:gravity="bottom|center_horizontal" android:bottom="0dp">
        <rotate android:fromDegrees="45" android:toDegrees="45"
            android:pivotX="50%" android:pivotY="50%" >
            <shape android:shape="rectangle">
                <size android:width="24dp" android:height="24dp" />
                <corners android:bottomRightRadius="2dp"/>
                <gradient android:type="linear"
                    android:angle="0"
                    android:endColor="@color/grey"
                    android:startColor="@color/grey" />
            </shape>
        </rotate>
    </item>

    <item android:bottom="12dp">
        <shape android:shape="rectangle">
            <size android:width="120dp" android:height="40dp" />
            <gradient android:type="linear"
                android:angle="0"
                android:endColor="@color/grey"
                android:startColor="@color/grey" />
            <corners android:radius="10dp" />
        </shape>
    </item>

</layer-list>

3. 可选：固定TextView高度
   如果不想用内边距，可直接设置TextView高度为android:layout_height="52dp"（40dp矩形高度+12dp三角形高度），确保容纳整个背景。

内容的提问来源于stack exchange，提问作者Taki