Resize ImageView height to fill remaining space

Viewed 118

What's the best option to get ImageView take remaining space giving room for rest of the UI elements inside ConstraintLayout? By the below layout, the ImageView doesn't budge and takes space before giving space to its siblings.

<?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:id="@+id/story_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/rounded_corner_bg">

    <androidx.appcompat.widget.AppCompatImageView
        android:id="@+id/story_image"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:adjustViewBounds="true"
        android:scaleType="fitCenter"
        app:layout_constrainedHeight="false"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_default="wrap"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintVertical_bias="0.0" />

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/story_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginHorizontal="12sp"
        android:layout_marginTop="@dimen/story_title_padding_top"
        android:ellipsize="end"
        android:maxLines="3"
        android:textColor="#000"
        android:textSize="@dimen/story_title"
        app:fontFamily="@font/roboto_regular"
        app:layout_constraintTop_toBottomOf="@id/story_image"
        app:lineHeight="@dimen/story_title_line_spacing" />

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/story_summary"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_marginHorizontal="12sp"
        android:layout_marginTop="@dimen/story_body_padding_top"
        android:textColor="#000"
        android:textSize="@dimen/story_body"
        app:autoSizeMaxTextSize="@dimen/story_body"
        app:autoSizeTextType="uniform"
        app:fontFamily="@font/roboto_light"
        app:layout_constraintTop_toBottomOf="@id/story_title"
        app:lineHeight="@dimen/story_body_line_spacing" />

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/story_meta"
        android:layout_width="match_parent"
        android:layout_height="@dimen/toolbar_height"
        android:layout_marginHorizontal="12sp"
        android:background="@color/colorAccent"
        android:maxLines="1"
        android:textColor="@color/colorBackground"
        android:textSize="@dimen/story_footer"
        app:layout_constraintBottom_toBottomOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

In the below screenshot(iOS), the top image yields to bottom text and made itself small. This what expected. enter image description here

In the below screenshot(Android), the top image takes all space and not yielding to bottom text which gets truncated. This needs fix.

enter image description here

1 Answers
Related