Search code examples
androidlayoutandroid-relativelayout

Android organize RelativeLayout


I want to organize my relative layout like this (black: imageView, red: ImageView, green: textView).

aimed state

But android seems to handle the black ImageView like a quadrat instead of a rectangle.

is state

Here's the important part of the xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingLeft="@dimen/activity_vertical_margin"
    android:paddingRight="@dimen/activity_vertical_margin">

      <RelativeLayout
        android:id="@+id/rl"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/iv1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:contentDescription="@string/iv_cd_default"
            android:src="@drawable/blackImage"
            android:scaleType="centerInside"/>

        <ImageView
            android:id="@+id/iv2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/iv_cd_default"
            android:src="@drawable/redImage"
            android:layout_alignParentTop="true"
            android:layout_alignRight="@+id/iv1"
            android:layout_alignEnd="@+id/iv1" />

        <TextView
            android:id="@+id/tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="some text here"
            android:layout_alignBottom="@+id/iv1"
            android:layout_alignRight="@+id/iv1"
            android:layout_alignEnd="@+id/iv1"/>
    </RelativeLayout>
    ....

Solution

  • Your ImageView should have android:adjustViewBounds="true", like this:

    <ImageView
                android:id="@+id/iv1"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:adjustViewBounds="true"
                android:contentDescription="@string/iv_cd_default"
                android:src="@drawable/blackImage"
                android:scaleType="centerInside"/>