I'm showing images from the server with RecyclerView. When a user clicks in RecyclerView item it open with ViewPager and FullImage fragment. There is a button that user can save that image.
For now, when user click on a button, I get the image position and save it with another glide request like this -
GlideApp.with(container.getContext())
.asBitmap()
.load(image.getUrl())
.diskCacheStrategy(DiskCacheStrategy.ALL)
.into(new SimpleTarget<Bitmap>() {
#Override
public void onResourceReady(#NonNull Bitmap resource, Transition<? super Bitmap> transition) {
// I want here the trigger option. When user click btn
// saveImage(resource, image.getTitle());
imageViewPreview.setImageBitmap(resource);
}
});
It takes time and data cause it sending another req. I want that when a user clicks on a button, It should save from that original Glide resource. Now how can I trigger that option?
GlideApp.with(container.getContext())
.asBitmap()
.load(image.getUrl())
.diskCacheStrategy(DiskCacheStrategy.ALL)
.into(new SimpleTarget<Bitmap>() {
#Override
public void onResourceReady(#NonNull Bitmap resource, Transition<? super Bitmap> transition) {
// I want here the trigger option. When user click btn
// saveImage(resource, image.getTitle());
imageViewPreview.setImageBitmap(resource);
}
});
You can use a global Bitmap variable, and after first load (when user switch to the current picture) set that bitmap. So, onResourceReady you will do something like currentBitmap = resource.
Eventually, if you are on the ViewPager, you can get the image based on current position using getAdapterPosition(); (which I suppose you already do)
Related
I load ad image in a map of Google with Glide. I want hide/ the image on same condition. How can I do? there is a something as Visible and Invisible?
Glide.with(getApplicationContext())
.asBitmap()
.load(url)
.error(null)
.into(new SimpleTarget<Bitmap>() {
public void onResourceReady(Bitmap resource, Transition<? super Bitmap> transition) { //code }
}
i dont find anything useful but myself do something like load empty.png that just have 24 * 24 emplty transparent for marker this make your marker seems invisible
You can hold the view reference and change the visibility of it.
SimpleTarget imageView = new SimpleTarget<Bitmap>() {
public void onResourceReady(Bitmap resource, Transition<? super Bitmap> transition) { //code }
};
Glide.with(getApplicationContext())
.asBitmap()
.load(url)
.error(null)
.into(imageView);
Then you can hide/show imageView using setVisibility(View.GONE) or setVisibility(View.VISIBLE) method
I use Glide to load my image. I need to modify my image with a SimpleTarget callback, however when the image loaded to my list, and I scroll the list shows first always an other image, and than animate the right image after 1 second to the place. Without image modification and SimpleTarget everything works just fine. Here is my code.
#BindingAdapter("imageSrc")
public static void setImage(ImageView imageView, String url) {
Glide.with(imageView.getContext()).load(url).asBitmap().into(new SimpleTarget<Bitmap>() {
#Override
public void onResourceReady(Bitmap bitmap, GlideAnimation anim) {
//the bitmap modified here
imageView.setImageBitmap(bmp);
}
});
}
is there any solution to avoid the flickering?
I'm trying to load a large hi-res (3225x4800) image from URL into glide for a newspaper company. The image I wanted to load is this High Res Image.
String url = "http://www.businessweekmindanao.com/content/wp-content/uploads/2015/10/fitness-and-wellness-poster-final.jpg";
Glide.with(getActivity()).load(url).asBitmap().into(new SimpleTarget<Bitmap>() {
#Override
public void onResourceReady(Bitmap resource, GlideAnimation<? super Bitmap> glideAnimation) {
imageView.setImageBitmap(resource);
}
});
I'm using Mike Ortiz' TouchImageView from the solution offered here: https://github.com/MikeOrtiz/TouchImageView/issues/135 when loading resource from url. But it seems to only work on small resolution image and it does not load high quality image.
There is an alternative solution I tried from stackoverflow: Android: not displayed ImageView with UIL and TouchImageView which tries to modify the onMeasure() method of Mike's library. It works with:
Glide.with(getActivity()).load(url)
.into(imageViewPreview);
The problem is it loads the image in very low resolution.
Is there a way to load high resolution image like: 7480x3740 for instance using Glide and TouchImageView? How do I do that?
I have found a solution that worked for my requirement. The override() method does the trick. Setting higher numbers for the target resolution seems to be the final workaround, but the bigger the numbers, the longer the time it would take to display the image(s), so it would be wise to implement a preloader/progressbar.
Glide.with(getContext())
.asBitMap() //[for new glide versions]
.load(url)
//.asBitmap()[for older glide versions]
//.placeholder(R.drawable.default_placeholder)
.override(1600, 1600) // Can be 2000, 2000
.into(new BitmapImageViewTarget(imageViewPreview) {
#Override
public void onResourceReady(Bitmap drawable, GlideAnimation anim) {
super.onResourceReady(drawable, anim);
progressBar.setVisibility(View.GONE);
}
});
Custom centered preloader/progressbar placeholder indicator on relativeLayout xml:
<ProgressBar
android:id="#+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" />
This is neat because another issue related about loading image asBitmap() in Glide will not show placeholders for error and preloader/progress indicator:
Glide.with(getActivity())
.load(url).asBitmap()
.placeholder() //<== will simply not work:
.error() // <== is also useless
.into(new SimpleTarget<Bitmap>() {
#Override
public void onResourceReady(Bitmap resource, GlideAnimation<? super Bitmap> glideAnimation) {
imageView.setImageBitmap(resource);
}
});
In my research, I have also tried a Picasso solution to handle high quality image:
Picasso.with(getContext())
.load(url)
.resize(1500, 0)
.placeholder(R.drawable.default_placeholder)
.error(R.drawable.download_error)
.into(imageViewPreview);
In the end, I was happy with the Glide version.
I hope this will be helpful to anyone that might be facing the same challenge.
I had issue while loading image from url into TouchImageView using Glide. It would show a black screen.
I found a fix which works like this. Pass width and height in Glide override method and after setting bitmap call setZoom of TouchImageView with value 1.
Here is the complete code:
Glide.with('context')
.asBitmap()
.load('url')
.apply(new RequestOptions().override(1600, 1600)) //This is important
.into(new BitmapImageViewTarget('imageview') {
#Override
public void onResourceReady(#NonNull Bitmap resource, #Nullable Transition<? super Bitmap> transition) {
super.onResourceReady(resource, transition);
'imageview'.setImageBitmap(resource);
'imageview'.setZoom(1); //This is important
}
});
Add android:usesCleartextTraffic="true"
Glide will start loading images in android 10
I have same issue and it is due to large image size. resolved it by following way:
Glide
.with(imageView.context)
.load(url)
.placeholder(R.drawable.placeholder)
.apply(RequestOptions().transform(CenterCrop(), RoundedCorners(if (applyCorner) 32 else 1)))
.into(object : CustomTarget<Drawable>(200, 200) {
override fun onLoadCleared(placeholder: Drawable?) {
// called when imageView is cleared. If you are referencing the bitmap
// somewhere else too other than this imageView clear it here
}
override fun onResourceReady(resource: Drawable, transition: Transition<in Drawable>?) {
imageView.setImageDrawable(resource)
}
I'm using Glide to load images on Scale ImageView - it is a custom view with pan and zoom gestures. I should pass Bitmap object to this custom view in order to set picture.
So I can use Glide's .asBitmap() with SimpleTarget:
private SimpleTarget target = new SimpleTarget<Bitmap>() {
#Override
public void onResourceReady(Bitmap bitmap, GlideAnimation glideAnimation) {
scaleImageView.setImage(ImageSource.bitmap(bitmap));
}
};
private void loadImageSimpleTarget() {
Glide
.with(context)
.load(url)
.asBitmap()
.into(target);
}
This code snippet works well, but I will get fullsize Bitmap, which can lead to OutOfMemoryErrors. Also I could specify desired Bitmap size on constructor like this: ...new SimpleTarget<Bitmap>(250, 250)..., but I would have to manually calculate dimensions.
Is there a possibility to pass view (instance of CustomView) to Glide's request, so dimensions will calculated automatically and receive Bitmap object as a result?
Continuing the discussion from the comments, you get 0 for width and height when calling it from onCreateView. However, you can set a listener to be notified when the bounds of the view are actually calculated and then you can get the real width and height by calling getWidth or getHeight:
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
// ...
// your other stuff
// ...
// set listener
customView.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
#Override
public void onGlobalLayout() {
Log.d("debug", "width after = " + customView.getHeight());
// pass the width and height now that it is available
target = new SimpleTarget<Bitmap>(customView.getWidth(), customView.getHeight()) {
#Override
public void onResourceReady(Bitmap bitmap, GlideAnimation glideAnimation) {
scaleImageView.setImage(ImageSource.bitmap(bitmap));
}
};
// remove listener, we don't need to be notified again.
customView.getViewTreeObserver().removeOnGlobalLayoutListener(this);
}
});
}
I have a fully working shared element transition between 2 fragments, lets say A to B, and they both share an ImageView. Everything works out except when I replace the shared ImageView on B. Currently I'm changing it using the following code:
Glide.with(getActivity())
.load(getArguments().getString(Constants.APPVIEW_FEATURE_IMAGE_URL)).asBitmap()
.into(new SimpleTarget<Bitmap>() {
#Override
public void onResourceReady(Bitmap resource, GlideAnimation<? super Bitmap> glideAnimation) {
if (getView() != null) {
((ImageView) getView().findViewWithTag(Constants.TAG_FGRAPHIC)).setImageBitmap(resource);
}
}
});
I replace the ImageView that I received from A on B with a higher definition one, since this is a header Image that will extend from a listView to a full width header.
The problem is that when returning from B to A, the animation goes wrong because when I press Back, the image changes size right away to it's size on A instead of using the animation scaling down from it's B size to A size. It still moves from the header to the A location correctly, it's just the size problem.
If I don't replace the image, no problem happens and everything goes normal.
Any idea? Thanks.
I am not sure how to do it with Glide, but this is how I did it with Picasso.
Picasso.with(context)
.load(AppController.getInstance().getThumbor().buildImage(url)
.resize(widthPlaceholder, heightPlaceholder)
.fitIn()
.toUrl())
.placeholder(R.color.light_gray)
.centerCrop()
.noFade()
.config(Bitmap.Config.RGB_565)
.into(target);
Target target = new Target() {
#Override
public void onBitmapLoaded(Bitmap bitmap, Picasso.LoadedFrom from) {
Drawable d = new BitmapDrawable(context.getResources(), bitmap);
Picasso.with(context)
.load(AppController.getInstance().getThumbor().buildImage(url)
.resize(width, height)
.fitIn()
.toUrl())
.placeholder(d)
.centerCrop()
.noFade()
.config(Bitmap.Config.RGB_565)
.into(imageView);
}
#Override
public void onBitmapFailed(Drawable errorDrawable) {
Picasso.with(context)
.load(AppController.getInstance().getThumbor().buildImage(url)
.resize(width, height)
.fitIn()
.toUrl())
.placeholder(R.color.light_gray)
.config(Bitmap.Config.RGB_565)
.centerCrop()
.noFade()
.into(imageView);
}
#Override
public void onPrepareLoad(Drawable placeHolderDrawable) {
Picasso.with(context)
.load(AppController.getInstance().getThumbor().buildImage(url)
.resize(width, height)
.fitIn()
.toUrl())
.placeholder(placeHolderDrawable)
.config(Bitmap.Config.RGB_565)
.centerCrop()
.noFade()
.into(imageView);
}
};
I am loading lower resolution picture and I am putting it as placeholder (background image), and than triggering higher res picture loading.