Android - Imageviews side by side without stretching

Question

I have a LinearLayout with an another Linearlayout inside. In the second LinearLayout I've got 3 ImageViews but they are all stretched as you can see in the picture.

Layout with stretched ImageViews

Here is my xml code:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_margin="10dp"
android:orientation="vertical" >

<TextView
    android:id="@+id/contact_data"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:background="@drawable/bubble"
    android:gravity="center"
    android:padding="10sp"
    android:text="@string/contact_data"
    android:textColor="#000000" />

<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:layout_margin="10dp"
    android:background="@android:color/darker_gray" />

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

    <ImageView
        android:id="@+id/phonenumber"
        android:layout_width="match_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="@drawable/phone"
        android:clickable="true"
        android:onClick="onClick" />

    <ImageView
        android:id="@+id/emailaddress"
        android:layout_width="match_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="@drawable/email"
        android:clickable="true"
        android:onClick="onClick" />

    <ImageView
        android:id="@+id/internetaddress"
        android:layout_width="match_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="@drawable/internet"
        android:clickable="true"
        android:onClick="onClick" />
  </LinearLayout>

  </LinearLayout>

What's the problem?

PS: I have 3 sizes of each picture: 32x32 in drawable-ldpi, 48x48 in drawable-mdpi and 64x64 in drawable-hdpi.

Change the scaleType to CenterCrop – Stephane Mathis Oct 29 '13 at 23:16 — Stephane Mathis, Oct 29 '13 at 23:16
it doesn't change anything – Deno Agüero Oct 29 '13 at 23:26 — Deno Agüero, Oct 29 '13 at 23:26

score 1 · Accepted Answer · edited May 23 '17 at 12:10

You're currently setting each ImageView's dimensions to android:layout_width="match_parent" and android:layout_height="fill_parent".

Are you sure that you don't want to be using wrap_content?

Also, note that fill_parent means the same things as match_parent, and has been deprecated since API level 8.

On further inspection, you're also setting the background of the ImageView's instead of the src, the latter of which will do a much better maintaining aspect ratios.

Android - Imageviews side by side without stretching

1 Answers1