tw-S
tw-S

Reputation: 1217

Match ImageView height to TextView height in FrameLayout

I use the following FrameLayout to display some text over an image:

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <ImageView
            android:id="@+id/imageview_picture"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:scaleType="centerCrop"/>
        <TextView
            android:id="@+id/textview_detail_title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:paddingTop="15dp"
            android:paddingBottom="15dp"
            android:layout_gravity="bottom"
            android:textColor="@android:color/white"
            android:background="#55000000" />
    </FrameLayout>

This layout give me the following result:

enter image description here

What I need is, I want the height of the ImageView match the height of the TextView. That is, I want Android to automatically crop the image in such a way that it matches the height of the TextView. I also tried android:adjustViewBounds="true" but it does not give the desired result.

How can I modify the XML to crop the image such that its height matches the text height? Thanks!

Upvotes: 0

Views: 253

Answers (2)

Anupreet Kaur
Anupreet Kaur

Reputation: 101

It worked for me . Here is the xml: Sidenote: This frame layout is in a LinearLayout (vertical). Code (Text):

<FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:srcCompat="@drawable/tvrdjava"
                android:id="@+id/imageView8"
                android:adjustViewBounds="true"
                android:cropToPadding="false" />

            <TextView
                android:text="TrTemp"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/textView3"
                android:textColor="@color/cardview_light_background" />

Upvotes: 0

Vir Rajpurohit
Vir Rajpurohit

Reputation: 1937

You can achieve the same by RelativeLayout. Please use below code

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <ImageView
      android:id="@+id/imageview_picture"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_alignTop="@+id/textview_detail_title"
      android:layout_alignBottom="@+id/textview_detail_title"
      android:scaleType="centerCrop"
     />
    <TextView
      android:id="@+id/textview_detail_title"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_gravity="bottom"
      android:paddingTop="15dp"
      android:paddingBottom="15dp"
      android:paddingLeft="10dp"
      android:paddingRight="10dp"
      android:text="Testing Text"
      android:textColor="@android:color/white"
      />

  </RelativeLayout>

Upvotes: 1

Related Questions