I would like so specify both min. width/height and max. width/height for an ImageView. The image should be scaled to fit.
Doing this:
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minWidth="100dp"
android:maxWidth="200dp"
android:minHeight="100dp"
android:maxHeight="200dp"
android:src="@drawable/ic_launcher" />
the min. width and height perform as they should, but max. width and height are ignored.
If I set android:adjustViewBounds="true":
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
android:minWidth="100dp"
android:maxWidth="200dp"
android:minHeight="100dp"
android:maxHeight="200dp"
android:src="@drawable/ic_launcher" />
than, the max. width and height perform as they should, but min. width and height are ignored.
Is there a way to have both?
Tap the image you want to adjust. You can adjust the size of an image or rotate it: Resize: Touch and drag the squares along the edges. Rotate: Touch and drag the circle attached to the image.
Using clickable imagesYou can turn any View , such as an ImageView , into a button by adding the android:onClick attribute in the XML layout. The image for the ImageView must already be stored in the drawable folder of your project.
android:adjustViewBounds—If set to true, the attribute adjusts the bounds of the ImageView control to maintain the aspect ratio of the image displayed through it.
In the end, I created my own view that extands ImageView and overwrites onMeasure():
public class ResizingImageView extends ImageView {
private int mMaxWidth;
private int mMaxHeight;
public ResizingImageView(Context context) {
super(context);
}
public ResizingImageView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public ResizingImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
@Override
public void setMaxWidth(int maxWidth) {
super.setMaxWidth(maxWidth);
mMaxWidth = maxWidth;
}
@Override
public void setMaxHeight(int maxHeight) {
super.setMaxHeight(maxHeight);
mMaxHeight = maxHeight;
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
Drawable drawable = getDrawable();
if (drawable != null) {
int wMode = MeasureSpec.getMode(widthMeasureSpec);
int hMode = MeasureSpec.getMode(heightMeasureSpec);
if (wMode == MeasureSpec.EXACTLY || hMode == MeasureSpec.EXACTLY) {
return;
}
// Calculate the most appropriate size for the view. Take into
// account minWidth, minHeight, maxWith, maxHeigh and allowed size
// for the view.
int maxWidth = wMode == MeasureSpec.AT_MOST
? Math.min(MeasureSpec.getSize(widthMeasureSpec), mMaxWidth)
: mMaxWidth;
int maxHeight = hMode == MeasureSpec.AT_MOST
? Math.min(MeasureSpec.getSize(heightMeasureSpec), mMaxHeight)
: mMaxHeight;
int dWidth = Helpers.dipsToPixels(drawable.getIntrinsicWidth());
int dHeight = Helpers.dipsToPixels(drawable.getIntrinsicHeight());
float ratio = ((float) dWidth) / dHeight;
int width = Math.min(Math.max(dWidth, getSuggestedMinimumWidth()), maxWidth);
int height = (int) (width / ratio);
height = Math.min(Math.max(height, getSuggestedMinimumHeight()), maxHeight);
width = (int) (height * ratio);
if (width > maxWidth) {
width = maxWidth;
height = (int) (width / ratio);
}
setMeasuredDimension(width, height);
}
}
}
This view can now be used like:
<my.package.ResizingImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minWidth="100dp"
android:maxWidth="200dp"
android:minHeight="100dp"
android:maxHeight="200dp"
android:src="@drawable/ic_launcher" />
This works as I wanted, but shouldn't there be an easier solution?
This used to be pretty much impossible with just XML, but now with ConstraintLayout
, it's quite simple.
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintWidth_min="100dp"
app:layout_constraintWidth_max="200dp"
app:layout_constraintHeight_min="100dp"
app:layout_constraintHeight_max="200dp"
app:layout_constrainedWidth="true"
app:layout_constrainedHeight="true"
android:scaleType="centerCrop" />
</androidx.constraintlayout.widget.ConstraintLayout>
You can use a scaleType
of fitXY
or centerCrop
; others will not force the image to fit the ImageView
.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With