如何根据图片尺寸自动调整ImageView的上下TextView位置？

这个问题我之前也碰到过！要让标题牢牢贴在图片的顶部和底部，核心是要让TextView和ImageView重叠布局，而不是线性排列。下面给你两种最常用的解决方案，都是Android里很稳妥的做法：

方案1：使用ConstraintLayout（推荐） #

ConstraintLayout是现在Android官方主推的布局，灵活性极高，能精准控制控件位置。你只需要把ImageView和两个TextView放在同一个ConstraintLayout里，然后给TextView设置对应的约束即可：

<?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"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- 图片控件 -->
    <ImageView
        android:id="@+id/image_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:scaleType="fitCenter" <!-- 根据需求选择缩放类型，比如centerCrop -->
        android:src="@drawable/your_image"/>

    <!-- 顶部标题 -->
    <TextView
        android:id="@+id/top_text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="顶部标题"
        android:textColor="#FFFFFF"
        android:background="#80000000" <!-- 半透明背景提升文字可读性 -->
        android:padding="8dp"
        app:layout_constraintTop_toTopOf="@id/image_view"
        app:layout_constraintStart_toStartOf="@id/image_view"
        app:layout_constraintEnd_toEndOf="@id/image_view"/>

    <!-- 底部标题 -->
    <TextView
        android:id="@+id/bottom_text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="底部标题"
        android:textColor="#FFFFFF"
        android:background="#80000000"
        android:padding="8dp"
        app:layout_constraintBottom_toBottomOf="@id/image_view"
        app:layout_constraintStart_toStartOf="@id/image_view"
        app:layout_constraintEnd_toEndOf="@id/image_view"/>

</androidx.constraintlayout.widget.ConstraintLayout>

关键说明： #

• 给top_text_view设置app:layout_constraintTop_toTopOf="@id/image_view"，让它的顶部与ImageView顶部完全对齐
• 给bottom_text_view设置app:layout_constraintBottom_toBottomOf="@id/image_view"，让它的底部与ImageView底部完全对齐
• scaleType可根据需求调整（比如centerCrop裁剪图片填满控件、fitCenter保持比例完整显示），无论哪种选择，标题都会跟随图片边缘自动对齐

方案2：使用FrameLayout #

如果你的项目还在使用旧布局体系，FrameLayout也是个简单有效的选择——它的子控件默认重叠，通过layout_gravity就能控制位置：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- 图片控件（放在最底层，确保标题能叠加在上方） -->
    <ImageView
        android:id="@+id/image_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:scaleType="fitCenter"
        android:src="@drawable/your_image"/>

    <!-- 顶部标题 -->
    <TextView
        android:id="@+id/top_text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="顶部标题"
        android:textColor="#FFFFFF"
        android:background="#80000000"
        android:padding="8dp"
        android:layout_gravity="top"/>

    <!-- 底部标题 -->
    <TextView
        android:id="@+id/bottom_text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="底部标题"
        android:textColor="#FFFFFF"
        android:background="#80000000"
        android:padding="8dp"
        android:layout_gravity="bottom"/>

</FrameLayout>

关键说明： #

• FrameLayout的绘制顺序是「先写的控件在底层，后写的在顶层」，所以ImageView要放在代码最上方，确保标题能叠加在图片之上
• android:layout_gravity="top"让顶部标题贴紧父布局（即ImageView的显示范围）顶部，bottom同理实现底部对齐

不管用哪种方案，都要避免给ImageView设置固定高度，用wrap_content或match_parent让图片高度随自身尺寸自动调整，这样标题就能始终精准对齐图片的顶端和底端。

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