为什么文本视图中的文本在回收器视图中被截断？

Question

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

见下文：

我已经尝试将文本视图高度设置为wrap_content但这会导致我的图像被向上推，并且所有项目的大小不一致。 此外，我觉得奇怪的是，文本视图的大小和位置甚至与 android studios 中的预览布局都不匹配。

有什么建议？

我的视图持有人布局：

<?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

我相信我已经找到了问题所在，它是您在 LinearLayout 中使用的权重。 根据 ImageView 高度 (80)，您已确定 TextView 高度 (20)。 因为 TextView 不能换行，所以文本是从底部剪切的。

方案一：去除线性布局中的权重，设置图片高度为固定高度，TextView为wrap_content。 就像下面一样：

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        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="100dp"
            android:background="@color/dark_red"
            android:scaleType="centerCrop" />

        <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" />
    </LinearLayout>

解决方案2：可以在TextView中去掉padding，或者将其设置为较小的padding，但在较小的屏幕上可能会再次出现该问题。

Answer 2

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

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

您可以使用 layout_constraintHeight_percent 代替权重，如下所示：

app:layout_constraintHeight_percent="0.2"

但我建议您不要使用 height_percant 或 weight 并且避免静态调整视图宽度/高度的大小。 它可能会导致不同屏幕出现问题

我认为最好删除 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>

Answer 3

将 imageview 的权重设为 60，将 textview 的权重设为 40。总之不断调整权重 attr 值以解决您的问题。 仅当您的代码中确实需要 weight attr 时才使用 thia 解决方案。 否则，只需移除重量并将它们的高度设置为 wrap_content 即可。