Picasso load images with horizontal lines - android

I have used Picasso for loading images in my Gallery page with Recyclerview and load images from Server. It works great on all devices good,except Samsung S4 device.In S4 device the images are corrupted and it displays some horizontal lines on all images.What is the problem in my code.Also I think on same S4 device it works fine before updating my supports library versions from 22.2.1 to 23.3.0.
GalleryAdapter.java
#Override
public void onBindViewHolder(GalleryViewHolder galleryViewHolder, final int position) {
// Load images from Assets using Picasso library.
Picasso picasso = Picasso.with(context);
//picasso.setLoggingEnabled(true);
//picasso.setIndicatorsEnabled(true);
if(AppUtilities.isNetworkConnected(context)){
picasso.load(imagesArrayList.get(position).getUrl())
.placeholder(android.R.color.darker_gray)
.fit()
.centerCrop()
.memoryPolicy(MemoryPolicy.NO_CACHE)
.networkPolicy(NetworkPolicy.NO_CACHE)
.into(galleryViewHolder.galleryImageView);
}
else{
picasso.load(imagesArrayList.get(position).getUrl())
.placeholder(android.R.color.darker_gray)
.fit()
.centerCrop()
.into(galleryViewHolder.galleryImageView);
}
}
public class GalleryViewHolder extends RecyclerView.ViewHolder {
protected ImageView galleryImageView;
public GalleryViewHolder(View itemView) {
super(itemView);
this.galleryImageView = (ImageView) itemView.findViewById(R.id.gallery_imageview);
}
}


Try this, before setting the image just set it to null like this:
galleryViewHolder.galleryImageView.setImageDrawable(null);

Related

slow application when use setImageBitmap in recyclerview android

I'm using BitmapFactory.decodeFile to set image in imageview in recyclerview it work but slow app when i scroll so i'm using picasso library to load images for my app but it doesn't load image
MyAdapter
#Override
public void onBindViewHolder(MyAdapter.ViewMolder holder, final int position) {
holder.textView3.setText(personArrayList.get(position).name);
int mod=Integer.parseInt(personArrayList.get(position).how);
mod=mod-(mod%5);
holder.textView4.setText(mod+"");
if(!personArrayList.get(position).pathImage.isEmpty()) {
Picasso.with(holder.imageView5.getContext())
.load(personArrayList.get(position).pathImage)
.fit()
.into(holder.imageView5);
}
/*
it is work but slow
holder.imageView5.setImageBitmap(
BitmapFactory.decodeFile(personArrayList.get(position).pathImage));
*/
}

How can I set the density of images loaded with Picasso?

The images I load with Picasso seem to use a density value of DENSITY_NONE. What do I have to change to make Picasso call .setDensity(160) on the loaded images before they are displayed?

Basing myself on another Picasso solution to resize images I implemented a custom transformation object which sets the density of images to a constant of my own:
Transformation changeDensity = new Transformation()
{
#Override public Bitmap transform(Bitmap source)
{
source.setDensity(160);
return source;
}
#Override public String key()
{
return "density";
}
};
// …later…
Picasso
.with(context)
.load(imageUri)
.transform(changeDensity)
.into(imageView);

Picasso loads image with triangle in corner of image

I'm using picasso library for loading images from server into my application. my problem is when image loaded it has a triangle in top-left corner of image with color(like blue,green,red).
this is my code for loading image:
public static void loadDynamicImage(final String url, final Context context, final ImageView imageView, final int width, final int height){
Picasso.with(context).load(url)
.networkPolicy(NetworkPolicy.OFFLINE)
.resize(width,height)
.onlyScaleDown()
.into(imageView, new Callback() {
#Override
public void onSuccess() {
}
#Override
public void onError() {
Picasso.with(context).load(url).resize(width,height).onlyScaleDown().into(imageView);
}
});
}
the image shown is :

You have enabled debug indicators on your Picasso instance (see official website). Look for setIndicatorsEnabled(true) in your code and remove it.

You have setIndicatorsEnabled set to true
Picasso picasso = Picasso.with(this);
picasso.setIndicatorsEnabled(false); //Or remove picasso.setIndicatorsEnabled(true);
Check this: Is there any way from which we can detect images are loading from cache in picasso?

PhotoView with Picasso: Some images appears smaller on listview

I am using PhotoView with Picasso and when I load images into ListView
1) It makes some images smaller.
2) not all images are loaded on launch, when i scroll down an then up then all the images are loaded.
Without PhotoView images loads just fine. I tried so many ImageView zooming libraries but PhotoView works better and I have also tried it with Glide the result is same.
Is there anyway I could force PhotoView to fit to ImageView attributes (which are Match_Parent)?
Here is my Adapter
#Override
public void onBindViewHolder( final ViewHolder holder, int position) {
Picasso.with(context)
.load((Integer) data.get(position))
.resize(530,999)
.onlyScaleDown()
.centerInside()
.into(holder.image);
holder.mAttacher = new PhotoViewAttacher(holder.image);
holder.image.setTag(holder);
}
#Override
public int getItemCount() {
return data.size();
}
public class ViewHolder extends RecyclerView.ViewHolder {
public PhotoView image;
public PhotoViewAttacher mAttacher;
public ViewHolder(View view) {
super(view);
image = (PhotoView) view.findViewById(R.id.imagview);
I am loading images from resources/drawable not from any url

Unfortunately, there is an issue at Picasso, more details at issue #364
I switched to another library Glide

You can change your attacher scale type:
holder.mAttacher = new PhotoViewAttacher(holder.image);
holder.mAttacher.setScaleType(ImageView.ScaleType.CENTER_CROP);
CENTER_CROP: Scale the image uniformly (maintain the image's aspect ratio) so that
both dimensions (width and height) of the image will be equal to or
larger than the corresponding dimension of the view (minus padding).
The image is then centered in the view.

Show GIF file with Glide (image loading and caching library)

I try to show a GIF image as loading placeholder in image view - with Glide Library:
Glide.with(context)
.load(ImageUrl())
.placeholder(R.drawable.loading2)
.asGif()
.crossFade()
.into(image);
I try to show this file
loading2.gif
but get this error :
Error:(54, 86) error: cannot find symbol method asGif()
How can I show GIF file with Glide in a imageView?

The above answer didn't work for me. The below code works.
ImageView imageView = (ImageView) findViewById(R.id.imageView);
GlideDrawableImageViewTarget imageViewTarget = new GlideDrawableImageViewTarget(imageView);
Glide.with(this).load(R.raw.sample_gif).into(imageViewTarget);

For Glide 4.+
ImageView imageView = (ImageView) findViewById(R.id.imageView);
Glide.with(this).asGif().load(R.raw.image_gif).into(imageView);

For Glide 3.0 you need to set asGif() earlier:
Glide.with(context)
.load(imageUrl)
.asGif()
.placeholder(R.drawable.loading2)
.crossFade()
.into(imageView);
Keep in mind that just using load() will load either a GIF or a Bitmap depending on the type of the data. Unless you want your load to fail if the given url is not a gif, you don't need to specify asGif()

I had this same problem. You can resolve it by moving where the asGif() is located. It must come directly before .load().
So change:
Glide.with(context)
.load(ImageUrl())
.placeholder(R.drawable.loading2)
.asGif()
....
to
Glide.with(context)
.asGif()
.load(ImageUrl())
.placeholder(R.drawable.loading2)
....

Here is another example. I have observed that Glide doesn't play Gif automatically sometimes. This solution worked for me:
In the example, imageView is one of the members in the RecyclerView's ViewHolder class.
Glide.with(itemView.getContext())
.asGif()
.load(thumbPath)
.placeholder(ResourcesCompat.getDrawable(context.getResources(),
R.drawable.image_loading_placeholder, null))
.centerCrop()
.into(new ImageViewTarget<GifDrawable>(imageView) {
#Override
protected void setResource(#Nullable GifDrawable resource) {
imageView.setImageDrawable(resource);
}
});
The method .asGif() needs to be used earlier or it will not be recognized

Use GlideDrawableImageViewTarget. This code works for me.
GlideDrawableImageViewTarget imageViewTarget = new GlideDrawableImageViewTarget(imageView);
Glide.with(this).load(R.drawable.logo_gif).into(imageViewTarget);

Glide automatically plays animated gif files, no need of extra method
Use below code
Glide.with(this)
.load(R.drawable.logo)
.into(imageView);

put your gif in raw folder and the use this below code also add the below
dependency in your gradle
//for glide
implementation 'com.github.bumptech.glide:glide:4.12.0'
annotationProcessor 'com.github.bumptech.glide:compiler:4.12.0'
ImageView layoutAnim;
//load gif file to imageView where layoutanim is my imageView
Glide.with(this).asGif().load(R.raw.backloader).into(layoutAnim);

From Glide version v4 :
Dependency:
implementation 'com.github.bumptech.glide:glide:4.8.0'
annotationProcessor 'com.github.bumptech.glide:compiler:4.8.0'
Visit this link To create GlideApp class:
You can directly give drawable reference on GlideApp
GlideApp.with(this).load(R.drawable.ic_loader).into(mBinding.progressBar);
If you get any error, please let me know.

I'm using Glide version 4.11 and for me it did work setting .asGif() right after Glide.with(context).
But I had another problem, I've also set .dontAnimate() when loading gif into ImageView. Apparently this doesn't work, so I had to remove .dontAnimate() from my setup, and everything worked after that change.
Here is issue for more info https://github.com/bumptech/glide/issues/3395

Here is The Best Way
Glide.with(a).load(item[position])
.thumbnail(Glide.with(a).load(R.drawable.preloader))
.fitCenter()
.crossFade()
.into(imageView);

Try this. It worked for me and will work for your code too.It works for both images as well as gifs too.
ImageView imageView = (ImageView) findViewById(R.id.test_image);
GlideDrawableImageViewTarget imagePreview = new GlideDrawableImageViewTarget(imageView);
Glide
.with(this)
.load(url)
.listener(new RequestListener<String, GlideDrawable>() {
#Override
public boolean onException(Exception e, String model, Target<GlideDrawable> target, boolean isFirstResource) {
return false;
}
#Override
public boolean onResourceReady(GlideDrawable resource, String model, Target<GlideDrawable> target, boolean isFromMemoryCache, boolean isFirstResource) {
return false;
}
})
.into(imagePreview);
}

This solution is kind of work around
<RelativeLayout
android:layout_width="wrap_content"
android:id="#+id/ImageContainer"
android:background="#fff"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:id="#+id/loadingImageView"
android:layout_centerInParent="true"
android:layout_height="wrap_content"/>
<ImageView
android:id="#+id/mainImageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:layout_centerInParent="true"
/>
</RelativeLayout>
instead of using one, use 2 ImageViews
Put loading gif in first ImageView using the solution given by #Preetam
ImageView loadingImageView = (ImageView) findViewById(R.id.loadingImageView);
GlideDrawableImageViewTarget loadingImageViewTarget = new GlideDrawableImageViewTarget(loadingImageView);
Glide.with(this).load(R.raw.spinner).into(loadingImageViewTarget);
Load Image from network in the second ImageView
(Order is important if you don't want to hide the loading gif once
the image from network is loaded)
ImageView mainImageView = (ImageView) findViewById(R.id.mainImageView);
GlideDrawableImageViewTarget mainImageViewTarget = new GlideDrawableImageViewTarget(mainImageView);
Glide.with(this).load(imageUrl).into(mainImageViewTarget);

Instead of GlideDrawableImageViewTarget use DrawableImageViewTarget
ImageView imageView =findViewById(R.id.imageView);
DrawableImageViewTarget imageViewTarget = new DrawableImageViewTarget (imageView);
Glide.with(this).load(R.raw.image_loader).into(imageViewTarget);
library: implementation 'com.github.bumptech.glide:glide:4.8.0'
annotationProcessor 'com.github.bumptech.glide:compiler:4.8.0'

Categories

Resources