android -> 将 ImageView 的高度设置为父级的动态高度

Question

我有带有动态高度单元格的回收视图。单元格的高度取决于文本的长度。

我想为这个单元格设置背景封面。 ImageView 的高度必须与父视图的高度相同。令人惊讶的是，这个任务真的很难完成。

这是没有 ImageView 的结果布局

如您所见，单元格的高度取决于文本的长度。

带 ImageView 的结果布局。

如您所见，单元格的高度取决于图像高度。

<?xml version="1.0" encoding="utf-8"?>

<androidx.cardview.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/cardview"
    app:cardBackgroundColor="#FF6B6B"
    android:layout_marginBottom="8dp"
    android:layout_marginTop="8dp"
    android:layout_marginRight="16dp"
    android:layout_marginLeft="16dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardCornerRadius="8dp">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <ImageView
            android:src="@drawable/universe1"
            android:id="@+id/background"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:scaleType="centerCrop">
        </ImageView>
        <LinearLayout
            android:id="@+id/layout_text"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">
            <TextView
                android:layout_marginLeft="8dp"
                android:textColorLink="@color/white"
                android:layout_marginBottom="8dp"
                android:id="@+id/text"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="2dp"
                android:ellipsize="end"
                android:fontFamily="@font/compact_text_regular"
                android:maxLines="4"
                android:text="This sounded nonsense to Alice, so she said nothing, but set off at her being blah blah This sounded nonsense to Alice, so she said nothing, but set off at her being blah blah"
                android:textColor="@color/white"
                android:textSize="14sp"
                android:lineSpacingExtra="4dp" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal">

                <LinearLayout
                    android:visibility="gone"
                    android:id="@+id/like_icon_wrap"
                    android:clickable="true"
                    android:layout_gravity="center"
                    android:layout_width="40dp"
                    android:layout_height="30dp"
                    android:orientation="horizontal">

                    <ImageView
                        android:layout_marginLeft="8dp"
                        android:id="@+id/like_icon"
                        android:layout_gravity="center_vertical"
                        android:layout_width="16dp"
                        android:layout_height="16dp"
                        app:srcCompat="@drawable/heart_white" />

                    <TextView
                        android:id="@+id/likes_count"
                        android:layout_gravity="center"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:fontFamily="@font/compact_text_regular"
                        android:textColor="@color/white"
                        android:textSize="16sp"
                        android:text="0" />
                </LinearLayout>

                <TextView
                    android:layout_marginRight="8dp"
                    android:layout_gravity="center"
                    android:id="@+id/more"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:fontFamily="sans-serif"
                    android:textColor="@color/colorPrimary"
                    android:gravity="right"
                    android:text="show more"
                    android:textSize="12sp"
                    android:visibility="invisible" />
            </LinearLayout>
        </LinearLayout>
    </FrameLayout>
</androidx.cardview.widget.CardView>

我也尝试通过 recyclerview 适配器设置图像高度，但没有成功。

Answer 1

使用 ConstraintLayout，您可以通过将高度设置为 0dp 并将 top/bottom 限制为您要匹配的其他视图来匹配另一个视图高度

我删除了布局的其他部分，因此您必须添加这些部分，但下面是图像和文本的代码。 Produce this

<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView 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:id="@+id/cardview"
    app:cardBackgroundColor="#FF6B6B"
    android:layout_marginBottom="8dp"
    android:layout_marginTop="8dp"
    android:layout_marginRight="16dp"
    android:layout_marginLeft="16dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardCornerRadius="8dp">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/background"
            android:layout_width="0dp"
            android:layout_height="0dp"

            tools:src="@tools:sample/avatars"
            android:scaleType="centerCrop"

            app:layout_constraintStart_toStartOf="@id/text"
            app:layout_constraintEnd_toEndOf="@id/text"
            app:layout_constraintTop_toTopOf="@id/text"
            app:layout_constraintBottom_toBottomOf="@id/text" />

        <TextView
            android:id="@+id/text"
            android:layout_width="0dp"
            android:layout_height="wrap_content"

            android:ellipsize="end"
            android:lineSpacingExtra="4dp"
            android:maxLines="4"
            android:text="This sounded nonsense to Alice, so she said nothing, but set off at her being blah blah This sounded nonsense to Alice, so she said nothing, but set off at her being blah blah"
            android:textSize="14sp"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    </androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>

Answer 2

正确的方法是使用@Håkon Schia 代码。但是，如果你想使用 FrameLayout，然后像这样在 RelativeLayout 中添加它，并在其中添加带有“alignBottom”约束的 ImageView :

<?xml version="1.0" encoding="utf-8"?>

<androidx.cardview.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/cardview"
    app:cardBackgroundColor="#FF6B6B"
    android:layout_marginBottom="8dp"
    android:layout_marginTop="8dp"
    android:layout_marginRight="16dp"
    android:layout_marginLeft="16dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardCornerRadius="8dp">

    <!--
        Code added here...
    -->
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    <ImageView
        android:id="@+id/background"
        android:background="@drawable/universe1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/frameLayout"
        android:scaleType="centerCrop">
    </ImageView>

    <FrameLayout
        android:id="@+id/frameLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <!--<ImageView
            android:src="@drawable/universe1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:scaleType="centerCrop">
        </ImageView>-->
        <LinearLayout
            android:id="@+id/layout_text"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">
            <TextView
                android:layout_marginLeft="8dp"
                android:textColorLink="@color/white"
                android:layout_marginBottom="8dp"
                android:id="@+id/text"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="2dp"
                android:ellipsize="end"
                android:fontFamily="@font/compact_text_regular"
                android:maxLines="4"
                android:text="This sounded nonsense to Alice, so she said nothing, but set off at her being blah blah This sounded nonsense to Alice, so she said nothing, but set off at her being blah blah"
                android:textColor="@color/white"
                android:textSize="14sp"
                android:lineSpacingExtra="4dp" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal">

                <LinearLayout
                    android:visibility="gone"
                    android:id="@+id/like_icon_wrap"
                    android:clickable="true"
                    android:layout_gravity="center"
                    android:layout_width="40dp"
                    android:layout_height="30dp"
                    android:orientation="horizontal">

                    <ImageView
                        android:layout_marginLeft="8dp"
                        android:id="@+id/like_icon"
                        android:layout_gravity="center_vertical"
                        android:layout_width="16dp"
                        android:layout_height="16dp"
                        app:srcCompat="@drawable/heart_white" />

                    <TextView
                        android:id="@+id/likes_count"
                        android:layout_gravity="center"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:fontFamily="@font/compact_text_regular"
                        android:textColor="@color/white"
                        android:textSize="16sp"
                        android:text="0" />
                </LinearLayout>

                <TextView
                    android:layout_marginRight="8dp"
                    android:layout_gravity="center"
                    android:id="@+id/more"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:fontFamily="sans-serif"
                    android:textColor="@color/colorPrimary"
                    android:gravity="right"
                    android:text="show more"
                    android:textSize="12sp"
                    android:visibility="invisible" />
            </LinearLayout>
        </LinearLayout>
    </FrameLayout>
    </RelativeLayout>
</androidx.cardview.widget.CardView>

android -> 将 ImageView 的高度设置为父级的动态高度

android -> set height of ImageView to dynamic height of parent

android

android-layout

android-imageview

android-recyclerview