I used Glide library to load image into imageView and I don’t know how to make image pinch to zoomable

Tags: , , ,



public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);


    //Variables
    ImageView imageView;
    imageView = (ImageView) findViewById(R.id.imageView);

    //Loading into ImageView
    Glide.with(this)
            .load("http://vrijeme.hr/bradar.gif")
            .into(imageView);
}

I tried using Picasso too and then connecting it with PhotoView library but it didn’t do anything, when I tried pinch to zoom it didn’t zoom at all, here is part of that code:

ImageView imageView;
PhotoViewAttacher photoView;

imageView = (ImageView) findViewById(R.id.imageView);
photoView = new PhotoViewAttacher(imageView);
Picasso.with(this)
       .load("link")
       .resize(1080,80)
       .into(imageView);

Answer

You can for example use this library. https://github.com/MikeOrtiz/TouchImageView

Load your image into this widget, instead of ImageView

Sample usage:

private TouchImageView mContentView;
private private SimpleTarget target;

mContentView = (TouchImageView) findViewById(R.id.fullscreen_content);

target = new SimpleTarget<Bitmap>() {
        @Override
   public void onResourceReady(Bitmap bitmap, GlideAnimation glideAnimation) 
{
            // do something with the bitmap
            // for demonstration purposes, let's just set it to an ImageView
            mContentView.setImageBitmap(bitmap);
        }
    };



    Glide.with(this) // could be an issue!
            .load( imagePath )
            .asBitmap()
            .into(target);

Notice, that i also use SimpleTarget first, it is good practice for using Glide and pinch to zoom effect for large images.

And the layout will be something like this:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.FullscreenActivity">


<com.yourPath.TouchImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/fullscreen_content"/>

</FrameLayout>

Also, sometimes there is an issue with loading the image after this setup. For me works something like this. I override the method from TouchImageView class:

@Override
public void setImageBitmap(Bitmap bm) {
    imageRenderedAtLeastOnce = false;
    super.setImageBitmap(bm);
    savePreviousImageValues();
    fitImageToView();
}


Source: stackoverflow