Develop Reference

Glide load quality photo depending on size of imageview [low if size small(icon)]

I know this kind question has been aroud but I'm having a specific issue ..
I'm using a glide library to transform image path in my sqlite database to imageviewin myexpendablelistview..and i'm using photoview library to make them zoomable ..the problem is the size of imageviw determine the quality of loaded images ..let me explain:
if the imageview is big then the loaded image is big and in zomming looks good. but if the imageview is small(let's say icon) ..then the loaded quality is bad and when zooming looks really bad.
i want to make a small imageview but when clicked get good quality image zoomable
This is my code:
case R.id.child3 :
ImageView url = (ImageView) view;
String urls;
urls = cursor.getString(cursor.getColumnIndex(Database.DATABASE_CHILD_3));
Glide.with(MainActivity.this).load(urls).into(url);
url.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
AlertDialog.Builder mBuilder = new AlertDialog.Builder(MainActivity.this);
View mView = getLayoutInflater().inflate(R.layout.dialog_custom_layout, null);
PhotoView photoView = mView.findViewById(R.id.imageView);
photoView.setImageDrawable(((ImageView)view).getDrawable());
mBuilder.setView(mView);
AlertDialog mDialog = mBuilder.create();
mDialog.show();
}
});
break;
My list_child.xml
<ImageView
android:layout_width="200dp"
android:layout_height="200dp"
android:id="#+id/child3"
android:layout_centerHorizontal="true"
Dialog_custom_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<com.github.chrisbanes.photoview.PhotoView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
/>
</LinearLayout>

Solved it with adding noTransformation:
Glide.with(MainActivity.this).load(urls).apply(noTransformation()).into(url);
and
public static RequestOptions noTransformation() {
if (noTransformOptions == null) {
noTransformOptions = new RequestOptions()
.dontTransform()
.autoClone();
}
return noTransformOptions;
}

Adding a OnclickListener to ImageViews inside a HorizontalScrollView

This question may have been asked before but I seem to not make much progress.
Basically I want to add an onclicklistener to my HorizontalScrollView that expands the image when pressed.
Here's the current code in the XML file:
<HorizontalScrollView
android:id="#+id/firstscrollview"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_gravity="left"
android:orientation="horizontal"
android:layout_marginTop="50dp">
<LinearLayout
android:id="#+id/firstlinear"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:orientation="horizontal" >
<ImageView
android:id="#+id/Cercie_button"
android:layout_width="100dp"
android:layout_height="100dp"
android:scaleType="fitCenter"
android:src="#drawable/image"/>
I've been trying out different things but I can't seem to get it to work, if anyone knows or can find a good example it would be very much appreciated!

Try this .
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_second);
ImageView Cercie_button = findViewById(R.id.Cercie_button);
Cercie_button.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
// do something here
}
});
}

if i am not getting it wrong then what so difficult in it you have to just do this in your on create method
ImageView btn = findViewById(R.id.Cercie_button);
btn.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
//write what you want to do
}
});

Android Picasso is not loading image when i use fit()

Without fit() it works fine.
Picasso.with(getApplicationContext()).load(url.concat(featureImage)).into(imageView);
ImageView imageView = (ImageView)findViewById(R.id.featureImage);
TextView textTitle = (TextView)findViewById(R.id.title);
TextView textDetail = (TextView)findViewById(R.id.detail);
Picasso.with(getApplicationContext()).load(url.concat(featureImage)).fit().into(imageView);
textTitle.setText(title);
textDetail.setText(detail);

fit() - Attempt to resize the image to fit exactly into the target ImageView's bounds.
So if you set layout_width or layout_height of your ImageView "wrap_content" and don't set minimal possible sizes, height or width of the view will be initially 0 and your image will be resized accordingly.

try this way
Picasso.with(mContext).load(url).centerCrop().fit()
.placeholder(R.mipmap.bg_screen)
.error(R.mipmap.bg_screen)
.into(mImageView, new com.squareup.picasso.Callback() {
#Override
public void onSuccess() {
Log.i(TAG, "onSuccess: TRUE");
}
#Override
public void onError() {
Log.i(TAG, "onError: TRUE");
}
});
your imageview in xml should like ,
<ImageView
android:id="#+id/img_movie"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitXY"
android:adjustViewBounds="true"
android:layout_gravity="center"
/>

Eventually the following code fulfilled my requirement.
Picasso.with(getApplicationContext()).load(url.concat(featureImage)).centerCrop().fit()
.placeholder(R.mipmap.nrum_logo)
.error(R.mipmap.nrum_logo)
.into(imageView, new com.squareup.picasso.Callback() {
#Override
public void onSuccess() {
Log.i("Picasso", "onSuccess: TRUE");
}
#Override
public void onError() {
Log.i("Picasso", "onError: TRUE");
}
});
My imageView:
<ImageView
android:layout_width="match_parent"
android:layout_height="200dp"
android:scaleType="fitCenter"
android:id="#+id/featureImage" />

Image from network with Glide too small on Android

I am trying to download an image from the network and display in the ImageView with Glide using scaleType="centerInside" option.
For some reason, the image, when downloaded from the network, looks much smaller on the screen than when the same image is put into the ImageView from resources.
Example:
Both images can be found here. I would argue that even those images that have been set from resources look smaller than they could actually be when compared to what I see on my laptop. I understand that there is something related to the screen density in play, but how can I make these images be of "user-friendly size", e.g., a bit larger?
Even a different image of 600x250 px size is ridiculously small on the phone (with ImageView's layout_height and layout_width set to "wrap_content").
Code from the Activity:
public class DisplayImagesActivity extends AppCompatActivity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.display_image_activity);
setSupportActionBar((Toolbar) findViewById(R.id.toolbar));
setTitle("Hello StackOverflow!");
ImageView top_left = (ImageView) findViewById(R.id.top_left);
ImageView top_right = (ImageView) findViewById(R.id.top_right);
ImageView bottom_left = (ImageView) findViewById(R.id.bottom_left);
ImageView bottom_right = (ImageView) findViewById(R.id.bottom_right);
String[] urls = new String[] {
"http://imgur.com/6jMOdg0.png",
"http://imgur.com/AhIziYr.png"
};
top_left.setImageResource(R.drawable.top_left);
top_right.setImageResource(R.drawable.top_right);
Glide.with(this)
.load(urls[0])
.signature(new StringSignature(new Date().toString()))
.into(bottom_left);
Glide.with(this)
.load(urls[1])
.signature(new StringSignature(new Date().toString()))
.into(bottom_right);
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case android.R.id.home:
this.finish();
return true;
default:
return super.onOptionsItemSelected(item);
}
}
}
display_image_activity.xml file:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
style="#style/match_parent"
android:orientation="vertical">
<include layout="#layout/_toolbar" />
<ScrollView
style="#style/match_parent">
<RelativeLayout
style="#style/match_parent"
android:padding="16dp">
<TextView
style="#style/wrap_content"
android:id="#+id/text_resources"
android:layout_marginBottom="10dp"
android:text="From Resources"/>
<ImageView
android:id="#+id/top_left"
android:background="#color/Linen"
android:layout_width="150dp"
android:layout_height="120dp"
android:layout_marginBottom="20dp"
android:layout_below="#id/text_resources"
android:scaleType="centerInside"/>
<ImageView
android:id="#+id/top_right"
android:background="#color/Linen"
android:layout_width="150dp"
android:layout_height="120dp"
android:layout_toRightOf="#id/top_left"
android:layout_toEndOf="#id/top_left"
android:layout_below="#id/text_resources"
android:layout_marginLeft="20dp"
android:layout_marginStart="20dp"
android:scaleType="centerInside"/>
<TextView
style="#style/wrap_content"
android:id="#+id/text_network"
android:layout_below="#id/top_left"
android:layout_marginBottom="10dp"
android:text="From Network"/>
<ImageView
android:id="#+id/bottom_left"
android:background="#color/Linen"
android:layout_width="150dp"
android:layout_height="120dp"
android:layout_below="#id/text_network"
android:scaleType="centerInside" />
<ImageView
android:id="#+id/bottom_right"
android:background="#color/Linen"
android:layout_width="150dp"
android:layout_height="120dp"
android:layout_toRightOf="#id/bottom_left"
android:layout_toEndOf="#id/bottom_left"
android:layout_below="#id/text_network"
android:layout_marginLeft="20dp"
android:layout_marginStart="20dp"
android:scaleType="centerInside" />
</RelativeLayout>
</ScrollView>
</LinearLayout>

I faced the same problem. Glide tries to interpret what my app needs and transforms the images accordingly, resulting in too small images in some places. In my case the ImageViews use adjustViewBounds="true" and MaxWdth/Height leading to problems
While I am not anything close to being a Glide Expert, I found a quick fix working for me.
I simply added a .dontTransform() mehod call, which in my case is OK since I use thumbnails that already have been pre-scaled.
GlideApp.with(context).load(fireStorage).dontTransform().into(imgView);
(Using a Placeholder would probably also have helped, but again, for me this was the easiest way)

Your images cannot be bigger than what you defined:
android:layout_width="150dp"
android:layout_height="120dp"
Try
android:layout_width="match_parent"
android:layout_height="wrap_content"

Your ImageViews can be that fixed size if you want although they should be flexible with match_parent/wrap_content.
I don't know what Glide does for sure but it looks like the resolution of the images from the network is smaller than the ones from resources. The android:scaleType="centerInside" gives you the behaviour that the image will be SHRUNK until both dimensions of the image fit in the ImageView and it's aspect ratio is maintained. If you want the images to expand to fit the ImageView you probably want android:scaleType="fitCenter" instead. You might also want android:adjustViewBounds to be true/false depending on how you want it to behave if you decide to make the dimensions flexible.
The documentation for scaleType is useful here:
https://developer.android.com/reference/android/widget/ImageView.ScaleType.html
https://developer.android.com/reference/android/graphics/Matrix.ScaleToFit.html#CENTER

This code saved my time. It works for me!
//Get actual width and height of image
StrictMode.ThreadPolicy policy = new StrictMode.ThreadPolicy.Builder().permitAll().build();
StrictMode.setThreadPolicy(policy);
Bitmap bitmap = null;
try {
URL url = new URL(imgUrl);
bitmap = BitmapFactory.decodeStream((InputStream)url.getContent());
} catch (IOException e) {
Timber.e("Image Loading Error %s", e.getLocalizedMessage());
}
if (bitmap != null) {
final float scale = resources.getDisplayMetrics().density;
final int dpWidthInPx = (int) (bitmap.getWidth() * scale + 0.5f);
final int dpHeightInPx = (int) (bitmap.getHeight() * scale + 0.5f);
//Set result width and height to image
GlideApp.with(imgAns.getContext())
.load(imgUrl)
.override(dpWidthInPx, dpHeightInPx)
.into(imgAns);
}

picasso and glide are not loading the image from web

picasso and glide are not loading the image from web. Below is the jave and xml. First i use picasso which is commented out now, then i use the glide library, but the problem is same. nothing appears on screen. if i ad image source from assets it appears on preview of android studio but i want to load image from web and show it in the image view. please correct my mistake if any..? Thanks.
JAVA:
ImageView imageBanner1 = (ImageView) findViewById(R.id.imageBanner1);
ImageView imageBanne2 = (ImageView) findViewById(R.id.imageBanner2);
Glide.with(getApplicationContext()).load("http://example.com/appBanner1.jpg")
.diskCacheStrategy(DiskCacheStrategy.NONE)
.skipMemoryCache(true)
.into(imageBannerl);
/*Picasso.with(getApplicationContext())
.load("http://example.com/appBanner1.jpg")
.skipMemoryCache()
.into(imageBannerl);*/
imageBanner1.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
Intent inttv=new Intent(MainActivity.this,Play.class);
inttv.putExtra("url","http://example.com");
startActivity(inttv);
}
});
Glide.with(getApplicationContext()).load("http://example.com/appBanner2.jpg")
.diskCacheStrategy(DiskCacheStrategy.NONE)
.skipMemoryCache(true)
.into(imageBanner2);
/*Picasso.with(getApplicationContext())
.load("http://example.com/appBanner2.jpg")
.skipMemoryCache()
.into(imageBanner2);*/
imageBannerAd.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
Intent imageBannerBrowserIntent = new Intent(Intent.ACTION_VIEW, Uri.parse("http://google.com"));
startActivity(imageBannerBrowserIntent);
}
});
XML:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_below="#+id/tabHost"
android:layout_centerHorizontal="true"
android:id="#+id/imageBannerLayout">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageBanner1"
android:layout_gravity="center_horizontal"
android:clickable="true"
android:background="#color/app_background" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageBanner2"
android:layout_gravity="center_horizontal"
android:clickable="true"
android:background="#color/app_background" />
</LinearLayout>

ImageView imageView = (ImageView) findViewById(R.id.my_image_view);
Glide.with(this).load("url").into(imageView);
I think you need to check your ImageView variable name.
You have used ImageView imageBanner1 and ImageView imageBanne2 as variable name but never used it.Instead you have used imageBannerChannel and imageBannerAd as variable name. Once Check your code again. And make sure your url is fine.