Let's say I'm getting some image from an API. I have no idea what the image's dimensions will be ahead of time, but I know that I want that image to become the src
of an ImageView
I have set to some specific size. I want whatever image I get from the API to fill the entire ImageView
, I want to preserve aspect ratio, and I don't care if one dimension (width or height) becomes too big for the set size of the view—so I use centerCrop
.
<ImageView
android:layout_width="400px"
android:layout_height="300px"
android:scaleType="centerCrop" />
If the image that comes back from the API is this:
When it gets set as the ImageView
's src, the result will be something akin to this (shaded parts are cropped off):
However, I get a request that we should always show the top of the image and crop from the bottom up. So the desired result is something like this:
I'm sure this is possible, but I'm a web guy operating out of his league here. Will it be better to extend ImageView
somehow, or to try scaleType="matrix"
and setImageMatrix()
, or some third, unmentioned option?
Use this TopCropImageView gist
import android.content.Context;
import android.graphics.Matrix;
import android.widget.ImageView;
/**
* ImageView to display top-crop scale of an image view.
*
* @author Chris Arriola
*/
public class TopCropImageView extends ImageView {
public TopCropImageView(Context context) {
super(context);
setScaleType(ScaleType.MATRIX);
}
@Override
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
super.onLayout(changed, left, top, right, bottom);
recomputeImgMatrix();
}
@Override
protected boolean setFrame(int l, int t, int r, int b) {
recomputeImgMatrix();
return super.setFrame(l, t, r, b);
}
private void recomputeImgMatrix() {
final Matrix matrix = getImageMatrix();
float scale;
final int viewWidth = getWidth() - getPaddingLeft() - getPaddingRight();
final int viewHeight = getHeight() - getPaddingTop() - getPaddingBottom();
final int drawableWidth = getDrawable().getIntrinsicWidth();
final int drawableHeight = getDrawable().getIntrinsicHeight();
if (drawableWidth * viewHeight > drawableHeight * viewWidth) {
scale = (float) viewHeight / (float) drawableHeight;
} else {
scale = (float) viewWidth / (float) drawableWidth;
}
matrix.setScale(scale, scale);
setImageMatrix(matrix);
}
}