CODEWITHSUNDEEP
androidandroid-layoutimageview
Mariano L
Mariano L

Reputation: 1879

Imageview not scaling picture

I have the following imageview with a image smaller than the RelativeLayout that contains this ImageView. I want the image scalled to fit the width of the imageView but I cannot make this works. For example I have this relativeLayout with 350dp width:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="350dp"
    android:layout_height="wrap_content"
    android:background="@drawable/selector_button_grey"
    android:clickable="true"
    android:padding="5dp">

    <ImageView
        android:id="@+id/image_selector"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:scaleType="fitCenter"
        android:background="@color/black"
        android:src="@drawable/Nachos"
         />

    <TextView
        android:id="@+id/image_selector_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_below="@+id/image_selector"
        android:gravity="center_horizontal|center_vertical"
        android:paddingBottom="5dp"
        android:paddingLeft="5dp"

        android:textSize="18sp" />


</RelativeLayout>

As you can see in the picture the image is in the center. The problem with fitXY is that the width works, but doesn't change the height. I want somehitng like, fitX. I have also tried centerInside but it looks the same.

enter image description here

Upvotes: 0

Views: 1363

Answers (6)

Manthan Patel
Manthan Patel

Reputation: 1852

Because your Relative layout and Imageview both have wrap content height so you have to make them match parent and make scaletype fitXY..

as follow code :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="350dp"
    android:layout_height="match_parent"
    android:background="@drawable/selector_button_grey"
    android:clickable="true"
    android:padding="5dp">

<ImageView
    android:id="@+id/image_selector"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:adjustViewBounds="true"
    android:scaleType="fitXY"
    android:background="@color/black"
    android:src="@drawable/Nachos"
     />

<TextView
    android:id="@+id/image_selector_text"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentStart="true"
    android:layout_below="@+id/image_selector"
    android:gravity="center_horizontal|center_vertical"
    android:paddingBottom="5dp"
    android:paddingLeft="5dp"
    android:textSize="18sp" />
</RelativeLayout>

Upvotes: 1

Mariano L
Mariano L

Reputation: 1879

I have used another method. First, I obtaing the dimesions without loading from memory :

   BitmapFactory.Options bitmapOptions = new BitmapFactory.Options();
                bitmapOptions.inJustDecodeBounds = true;
                try {
                    BitmapFactory.decodeStream(new FileInputStream(f), null, bitmapOptions);
                    BitmapFactory.decodeFile(f.getName(), bitmapOptions);
                    float scale = (bitmapOptions.outHeight * 1f) / (bitmapOptions.outWidth);
                    cache.put(image, value);
                } catch (Throwable e) {
                    e.printStackTrace();
                }

Then used that value scale

    imageView.setLayoutParams(new android.widget.RelativeLayout.LayoutParams(IMAGE_SIZE, Math.round(IMAGE_SIZE * imageData.getScale())));
    imageView.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
    imageView.setAdjustViewBounds(true);
    imageView.setCropToPadding(true);

Upvotes: 0

Xenolion
Xenolion

Reputation: 12717

There is some padding set on the RelativeLayout they may be also a cause to ImageView not touching the sides in your layout RelativeLayout:

Remove this:

android:padding="5dp"

And if you real want some padding set on Top and Bottom but NOT on the Right and Left so if you want padding Top and Bottom ADD these:

android:paddingTop="5dp"
android:paddingBottom="5dp"

And if you do not want padding at all do not ADD them!

Upvotes: 0

Dambakk
Dambakk

Reputation: 665

I would also use centerCropor similar. If that does not work for you, check this image and see if you can find anything interesting: enter image description here

If this is nothing for you, consider to check out image customazations in Android: https://developer.android.com/guide/topics/graphics/2d-graphics.html

Upvotes: 2

P. Jaiswal
P. Jaiswal

Reputation: 205

Hope this helps! In my case it is working fine.

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="350dp"
    android:layout_height="match_parent"
    android:background="@drawable/Nachos">
</RelativeLayout>

Upvotes: 0

KeLiuyue
KeLiuyue

Reputation: 8237

You should change the android:scaleType attribute to your ImageView.

If you want to display the pictures in proportion, you can use centerCrop.

If you don't want to display the pictures in proportion, you can use fitXY. 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="350dp"
                android:layout_height="wrap_content"
                android:background="@drawable/selector_button_grey"
                android:clickable="true"
                android:padding="5dp">

    <ImageView
        android:id="@+id/image_selector"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:background="@color/black"
        android:scaleType="fitXY"
        android:src="@drawable/Nachos" />

    <TextView
        android:id="@+id/image_selector_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_below="@+id/image_selector"
        android:gravity="center_horizontal|center_vertical"
        android:paddingBottom="5dp"
        android:paddingLeft="5dp"
        android:textSize="18sp"/>

</RelativeLayout>

Upvotes: 0

Related Questions