fit an image into the screen with out being distorted in android

Question

I want to fit an image of 900x150 into a screen of 1280x800 with out being distorted ..any help will be gr8 ..here is my main.xml file

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <ScrollView
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <RelativeLayout 
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <ImageView
    android:id="@+id/imageView1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:scaleType="centerCrop"
    android:contentDescription="@string/mypicture"
    android:src="@drawable/MyImage"
        />
    </RelativeLayout>
   </ScrollView>
 </LinearLayout>

android:scaleType="fitXY" http://stackoverflow.com/a/9478320/1012284 — Padma Kumar, Nov 28 '12 at 10:25
Please describe exactly the result you want (a drawing would be perfect) — sdabet, Nov 28 '12 at 10:41

score 1 · Answer 1 · answered Nov 28 '12 at 10:27

1

You should probably use fitCenter instead of centerCrop

answered Nov 28 '12 at 10:27

sdabet

18,360
11
89
158

I tried both the 900 dimension is perfectly fitted with the screen but not the 150 dimenstion – xiongdi Nov 28 '12 at 10:29
What result do you want ? Fill both dimensions of the screeen (which will distort the image ratio) or keep image ratio and fill only one dimension ? – sdabet Nov 28 '12 at 10:32
..i want to keep image ratio and fit both dimensions if possible – xiongdi Nov 28 '12 at 10:35
That's not possible...screen ratio and image ratio are different... (screen ratio = 1280/800 = 1.6 and image ratio = 800 / 150 = 6)... – sdabet Nov 28 '12 at 10:39
@xiongdi you mean you want to keep the scale ratio but fill the screen, so in this case, you have scroll vertically? – Simon Nov 28 '12 at 10:40
@Simon i think I should scale the image according to aspect ratio as suggested by @ Awais Tariq below – xiongdi Nov 28 '12 at 11:00

Awais Tariq · Answer 2 · 2012-11-28T11:00:32.393

You can scale up and down the image according to the aspect ratio. Or I see you have used scroll view simple your wrap content for image size which will show the picture completely without being distorted...

EDIT

private void scaleImage()
{
    // Get the ImageView and its bitmap
    ImageView view = (ImageView) findViewById(R.id.image_box);
    Drawable drawing = view.getDrawable();
    if (drawing == null) {
        return; // Checking for null & return, as suggested in comments
    }
    Bitmap bitmap = ((BitmapDrawable)drawing).getBitmap();

    // Get current dimensions AND the desired bounding box
    int width = bitmap.getWidth();
    int height = bitmap.getHeight();
    int bounding = dpToPx(250);
    Log.i("Test", "original width = " + Integer.toString(width));
    Log.i("Test", "original height = " + Integer.toString(height));
    Log.i("Test", "bounding = " + Integer.toString(bounding));

    // Determine how much to scale: the dimension requiring less scaling is
    // closer to the its side. This way the image always stays inside your
    // bounding box AND either x/y axis touches it.  
    float xScale = ((float) bounding) / width;
    float yScale = ((float) bounding) / height;
    float scale = (xScale <= yScale) ? xScale : yScale;
    Log.i("Test", "xScale = " + Float.toString(xScale));
    Log.i("Test", "yScale = " + Float.toString(yScale));
    Log.i("Test", "scale = " + Float.toString(scale));

    // Create a matrix for the scaling and add the scaling data
    Matrix matrix = new Matrix();
    matrix.postScale(scale, scale);

    // Create a new bitmap and convert it to a format understood by the ImageView 
    Bitmap scaledBitmap = Bitmap.createBitmap(bitmap, 0, 0, width, height, matrix, true);
    width = scaledBitmap.getWidth(); // re-use
    height = scaledBitmap.getHeight(); // re-use
    BitmapDrawable result = new BitmapDrawable(scaledBitmap);
    Log.i("Test", "scaled width = " + Integer.toString(width));
    Log.i("Test", "scaled height = " + Integer.toString(height));

    // Apply the scaled bitmap
    view.setImageDrawable(result);

    // Now change ImageView's dimensions to match the scaled image
    LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) view.getLayoutParams(); 
    params.width = width;
    params.height = height;
    view.setLayoutParams(params);

    Log.i("Test", "done");
}

private int dpToPx(int dp)
{
    float density = getApplicationContext().getResources().getDisplayMetrics().density;
    return Math.round((float)dp * density);
}

if i remove the scroll view the image will be distorted ..i want to keep the aspect ratio but don't have a clue how — xiongdi, Nov 28 '12 at 10:37
my image view is scaled but now it's so small instead of fitting the whole screen, i removed the scrollview from the main.xml ..any idea on the bounding — xiongdi, Nov 28 '12 at 11:38

fit an image into the screen with out being distorted in android

2 Answers2