android - 为什么 TextView 中的文本在回收器 View 中被截断？

Question

我正在尝试在回收站 View 中制作一个只有图像和标题的项目。出于某种原因，我的 TextView 的标题在底部被截断了。

见下文:

我已经尝试将 TextView 高度设置为 wrap_content 但这会导致我的图像被推高并且所有项目的大小不一致。此外，我发现 TextView 大小和位置甚至与 Android Studio 中的预览布局不匹配很奇怪。

有什么建议吗？

我的 View 持有者布局:

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

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="4dp"
        android:background="@drawable/thumbnail_frame"
        android:paddingLeft="16dp"
        android:paddingTop="12dp"
        android:paddingRight="16dp"
        android:paddingBottom="12dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:orientation="vertical"
            android:weightSum="100"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintDimensionRatio="5:4"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent">

            <ImageView
                android:id="@+id/thumbnail_item"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="80"
                android:background="@color/dark_red"
                android:scaleType="centerCrop" />

            <TextView
                android:id="@+id/thumbnail_title"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="20"
                android:ellipsize="end"
                android:maxLines="2"
                android:padding="8dp"
                android:text="@string/title_place_holder"
                android:textColor="@color/white"
                android:textSize="12sp" />

        </LinearLayout>

    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

Answer 1

为什么要在约束布局内创建线性布局？

您可以删除线性布局并将您的 ImageView 和 TextView 直接放在约束布局和约束 TextView 的 ImageView 从上到下

您可以像下面这样使用 layout_constraintHeight_percent 而不是使用权重:

app:layout_constraintHeight_percent="0.2"

但我建议您不要使用 height_percant 或 weight，也不要静态调整 View 的宽度/高度。它可能会在不同的屏幕上引起问题

我认为最好删除 LinearLayout 并删除权重并将此行添加到您的 ImageView:

app:layout_constraintDimensionRatio="H,5:4"

像下面这样写你的 TextView 和 ImageView:

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="4dp"
    android:background="@drawable/thumbnail_frame"
    android:paddingLeft="16dp"
    android:paddingTop="12dp"
    android:paddingRight="16dp"
    android:paddingBottom="12dp">

        <ImageView
            android:id="@+id/thumbnail_item"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:background="@color/dark_red"
            android:scaleType="centerCrop"
            app:layout_constraintDimensionRatio="H,5:4"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/thumbnail_title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:ellipsize="end"
            android:maxLines="2"
            android:padding="8dp"
            android:text="@string/title_place_holder"
            android:textColor="@color/white"
            android:textSize="12sp" 
            app:layout_constraintTop_toBottomOf="@id/thumbnail_item"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>