views:

512

answers:

5

I'm working on an Android application that needs to download an image and display it inside an image view. The Bitmap is passed to the main java file and added to the image view like this:

comic = (ImageView) findViewById(R.id.comic);
comic.setImageBitmap(c.getImageBitmap());

This works, except that the left side of the image disappears off the screen. The ImageView is in a ScrollView and the scroll view maintains the correct size. This means that there is black space to the right in the ScrollView and the image is cut off to the left.

The XML for the ImageView is this:

    <ScrollView android:layout_width="fill_parent"
  android:layout_height="fill_parent">
  <HorizontalScrollView android:layout_width="fill_parent"
   android:layout_height="fill_parent" >
   <ImageView android:id="@+id/comic" android:layout_height="fill_parent"
    android:layout_width="fill_parent" android:layout_gravity="center"
    android:src="@drawable/xkcdlogo" />
  </HorizontalScrollView>
 </ScrollView>

Any idea why my image is being cut off?

Thanks!

A: 

Have you tried setting android:scaleType="center" rather than android:layout_gravity="center"?

This will center the image in the ImageView without scaling.

Brandon
Thanks! That fixed the problem, however now images that are small enough to fit on the screen are aligned in the top left. Any way to fix this?
Computerish
A: 

android:scaleType="centerCrop"

level32
A: 

I'm having exactly the same issue. If I include the following line

android:layout_width="fill_parent" android:layout_gravity="center"

in as you have it, then images that are smaller than the screen are centered, but images that are larger than the screen are cropped on the left side. If I remove the layout_gravity="center" on the image, then the larger images are no longer cropped, but the smaller images are not centered.

I don't want to use

android:scaleType="centerCrop"

because I don't want the images scaled at all.

To summarize, using the code posted above,

  • using android:layout_gravity="center" (or center_horizontal) causes small images to be centered, but larger images to be cropped on the left side when scrolling horizontally
  • using android:scaleType="centerCrop" or android:scaleType="center" instead of using layout_gravity fixes the cropping issue but smaller images are not centered, they are tied to upper left
  • using them both together ( android:layout_gravity="center" and scaleType="centerCrop" or scaleType="center" ) causes the small images to be centered, but larger images to be cropped on the left side when scrolling horizontally

Have you found a solution? I'm thinking this is a bug in how HorizontalScrollView calculates the size of it's children (?)

For my purposes having the images in the top left was perfect, so I'm afraid I don't have a solution. I would try to center the `ScrollView` rather than the image inside it, but I'm not sure.
Computerish
A: 

The solution that finally worked for me was to set the inner ImageView to have a fixed height and width larger than the largest image, add a lot of padding, and then set android:scrollX and android:scrollY in the xml to get the images placed where I needed them. This fixed the problem with the images getting cropped in the horizontal scroll.

A: 

When I need my images to fit without being cropped, I have found the following works for me:

1) Will not crop and puts the image at the top of the view. Scales it down to the size needed to fit the height and width of your view if needed: android:scaleType = "fitStart"

2) Will not crop and puts the image at the center of the view. Scales it down to the size needed to fit the height and width of your view if needed:android:scaleType = "fitCenter"

I too am interested in this topic, so if anyone else has other ways of doing it, I am listening.

Kirgan