How to set minimum height of image view and keep "wrap_content" as height when using Glide

user_4977669 0
Viewed 887

I get images of different sizes from server, so i used "wrap_content" for imageView height. It works perfectly fine.

The issue is that every images takes some time to load, in that time, images has no height , and it looks weird, so i need to set some minimum height of the "imageView" component.

But if set any height to the "imageView" the "wrap_content" functionality goes away, and it loads the image in same container.

I need to know the possibility to set minimum height of image view but keep the "wrap_contnet" functionality.

Glide Code

    Glide.with(context)
            .load(dataList?.get(position)?.defaultImage)
            .into(holder.ivBackgroundImage)
android-glide android-layout android
7 Answers

Try to use this approach:

  1. use "minHeight/minWidth" properties at the initial state.
  2. start the loading and listen to the end (with a Glide's callback), in that moment change properties "minHeight/minWidth" to default values and set "width/height" to "wrap_content".
user_21540110

Try minHeight and minWidth attribute to set min image height

code

  <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:minHeight="100dp"
        android:minWidth="100dp"/>
user_103854470

You can use placeholder instead of setting min height/min width. It will be efficient and UI will also looks good.

GlideApp
    .with(your context)
    .load(url)
    .centerCrop()
    .placeholder(R.drawable.loading_image)
    .error(R.drawable.error_image)
    .into(myImageView);
user_117329760

You can need to use the two property of the ImageView that are scaleType and adjustViewBounds like below

 <ImageView
            android:id="@+id/YOUR_IMAGE"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:layout_gravity="center"
            android:adjustViewBounds="true"
            android:scaleType="fitXY"/>

You can set the android:scaleType according to your requirements ,please check below image
enter image description here

And another solution, you can use the Glide's property that is Override and set the image height and width accordingly like below

Glide
    .with(context)
    .load(path)
    .apply(new RequestOptions().override(400, 200))
    .into(imageViewResizeCenterCrop);
user_39469580

You can use height and width what you desired.

                    Glide.with(Context)
                   .load(Path)
                   .override(225, 225)
                   .centerCrop() - If u dont' need you can remove it 
                   .into(image);
user_150712360

for the solution to the above question, you can use a placeholder. which will be shown while the images are loading.

 Glide
    .with(myFragment)
    .load(url)
    .centerCrop()
    .placeholder(R.drawable.loading_spinner)
    .into(myImageView);
user_94833490

You can set go with the minimum height approach as many other users have said. Just keep in mind there are two different properties, one of them is android:minHeight="50dp" and the other is app:layout_minHeight="50dp"

Make sure you select the right one and you should be good to go even with wrap_content

user_156903980
Related