Android image scale type to fit width and scaleY = scaleX

Question

I have a layout with a background image. The image width should be the same as the screen width (match_parent). But it's ugly, the OS don't stretch the picture in height. I heard about ImageView scaleType, so I have the background image in an ImageView instead of a layout background, but I can't config to be what I want.

How can I set to the layout or ImageView to scale the image (in width) to fit the width of the screen AND scale the height with the same scale?

I want the second screen in the picture: enter image description here

UPDATE:

I'm trying from code, but I get 0 width + I can't believe this can't be done from xml with an ImageView.

    Drawable imageDrawable = getResources().getDrawable(imageResource);
    contentContainer.setBackgroundDrawable(imageDrawable);

    Rect rect = imageDrawable.getBounds();
    int originalWidth = rect.width();
    int originalHeight = rect.height();

    Display display = getActivity().getWindowManager().getDefaultDisplay(); 
    int width = display.getWidth();

    int height = originalHeight * (width/originalWidth);

    RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(width, height);
    contentContainer.setLayoutParams(layoutParams);


    contentContainer.post(new Runnable() {

        @Override
        public void run() {
            contentContainer.setScaleY(contentContainer.getScaleX());

            Rect rect = contentContainer.getBackground().getBounds();
            int originalWidth = rect.width();
            int originalHeight = rect.height();

            Display display = getActivity().getWindowManager().getDefaultDisplay(); 
            int width = display.getWidth();

            int height = originalHeight * (width/originalWidth);

            RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(width, height);
            contentContainer.setLayoutParams(layoutParams);

        }
    }

score 0 · Answer 1 · answered Nov 08 '13 at 10:07

0

Use FrameLayout as parent and then add imageview as child.

answered Nov 08 '13 at 10:07

saa

1,538
2
17
35

2

? Why would a FrameLayout as a parent work instead of a LinerLayout for example? – user2313423 Nov 09 '13 at 12:22

score 0 · Answer 2 · answered Nov 08 '13 at 10:26

0

Give the width match_parent and height fill_parent to the imageView and another ways is apply the android:layout_weight attribute try this may be it's work.

answered Nov 08 '13 at 10:26

karthik

209
1
6
11

I don't really understand, but if I set the height to match_parent (fill_parent is deprecated) it will be the size of the screen, not the same scale as the width – user2313423 Nov 09 '13 at 11:51

Kailash Dabhi · Answer 3 · 2013-11-09T13:23:30.810

0

you can do this at runtime by measuring the width of the device like this:--

    super.onCreate(savedInstanceState);
    setContentView(<layout-resoure-id);
    Display display = getWindowManager().getDefaultDisplay();
    int width = display.getWidth();
    int height = display.getHeight();
    int imageSize = 0;
    if (width > height)
        imageSize = height;
    else
        imageSize = width;

    ImageView imageView = (ImageView) findViewById(R.id.imageView);
    imageView.getLayoutParams().width = imageSize;
    imageView.getLayoutParams().height = imageSize;
    imageView.setImageResource(R.drawable.pattu);

your xml:--

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

   <ImageView
    android:id="@+id/imageView"
    android:layout_width="100dp"
    android:layout_height="100dp" 
    android:scaleType="fitXY"/>

  </LinearLayout>

Enjoy...!

edited Nov 09 '13 at 13:23

answered Nov 08 '13 at 10:37

Kailash Dabhi

3,473
1
29
47

Is it possible from xml? – user2313423 Nov 09 '13 at 12:24
please try it with an image like this: – user2313423 Nov 09 '13 at 12:45
let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/40870/discussion-between-kailash-dabhi-and-user2313423) – Kailash Dabhi Nov 09 '13 at 12:52
you set the layout width and layout height to the same value -> the layout will be a square, but the image is not a square, so it will be the same aspect ratio. please see my update – user2313423 Nov 09 '13 at 16:22

score 0 · Answer 4 · answered Jan 04 '16 at 22:49

Have you tried playing with scaleType in you layout file?

<ImageView
    ...
    android:scaleType="fitStart"
    />

This should scale your image to fit at the top of your layout, stretching or shrinking if necessary. Haven't had a chance to test (and I can't remember the height/width settings--sorry!), but this could be a solution.

score 0 · Answer 5 · answered Aug 13 '16 at 02:58

    ImageView imageView = (ImageView) findViewById(R.id.your_image_id);

    DisplayMetrics displayMetrics = getResources().getDisplayMetrics();
    int width = displayMetrics.widthPixels;
    int height = displayMetrics.heightPixels;
    int imageSize = height>width?width:height;

your configurations go here !

    imageView.getLayoutParams().width = imageSize;
    imageView.getLayoutParams().height = imageSize + (/* additional height logic*/);

you should put the imageView scaletype as fitXY and do this to stretch the image like the way you want!

<ImageView
    ...
    android:scaleType="fitXY"
    />

Android image scale type to fit width and scaleY = scaleX

5 Answers5