CODEWITHSUNDEEP
androidandroid-imageviewvimeo-apivimeo-android
Sandeep Yohans
Sandeep Yohans

Reputation: 983

Vimeo Video Thumbnail in an ImageView

I am developing an Android app which should display a list of video thumbnails in RecyclerView. A new activity will then play the video for selected thumbnail. How do I set com.vimeo.networking.model.Picture to Android ImageView?

My code:

mVimeoClient.fetchNetworkContent(VIDEO_URI, new ModelCallback<VideoList>(VideoList.class) {
           @Override
           public void success(VideoList videoList) {
                ArrayList<Video> videoArrayList = videoList.data;
               Video video = videoArrayList.get(0);
               ArrayList<com.vimeo.networking.model.Picture> arrayListPics = video.pictures.sizes;
               // imageView.setImageDrawable((Drawable) pictureAL.get(0));
               imageView.setImageBitmap( (Bitmap) arrayListPics.get(0));
           }
           @Override
           public void failure(VimeoError error) {
           }
        });
}

The setImageBitmap() And setImageDrawable() throws 

java.lang.ClassCastException

Upvotes: 3

Views: 1183

Answers (3)

Mauker
Mauker

Reputation: 11497

Here's a solution using Glide 4.x.

First of all, import the lib on your project:

implementation 'com.github.bumptech.glide:glide:4.6.1'

Since the Pictures class contains an Uri as the others stated, you can use Glide to download the image for you effortlessly as follows.

// Get your ImageView
ImageView iv = findViewById(R.id.your_image_view);
// Get your thumbnails
ArrayList<com.vimeo.networking.model.Picture> arrayListPics = video.pictures.sizes;
// Load them using Glide
Glide.with(this) // Assuming "this" is your Activity, but you can also use any context here
        .load(arrayListPics.get(0).getLink())
        .into(iv);

That way it won't matter where is the thumbnail located (Network, file, resources), Glide will load it for you.

You can also apply some transformations or use placeholders by using Glide's RequestOptions class. Read more on how to use it here.

Upvotes: 2

Kyle Venn
Kyle Venn

Reputation: 8078

The Picture object (the one returned from arrayListPics.get(0)) in the vimeo-networking library isn't a Bitmap and therefore can't be cast to one. The Picture object has a field on it called mLink which can be access via Picture#getLink(). This will return a URI string which you then can set on your ImageView.

The simplest code you could use to get this working is:

    // The ImageView you want to put the thumbnail in
    ImageView yourImageView = <insert your ImageView here>;
    // The video whose thumbnail you want
    Video yourVideo = <insert your Video here>;
    // The collection of `Picture` objects associated with this video.
    // Each `Picture` in this "collection" is a different size
    PictureCollection yourVideosPictures = yourVideo.getPictures();
    // Get the first thumbnail/picture from this collection (not recommended)
    Picture videoThumbnailPicture = yourVideosPictures.getPictures().get(0);
    // The URI to the image of the thumbnail
    String videoThumbnailUri = videoThumbnailPicture.getLink();
    // Convert the String URI to an actual URI object
    final Uri uri = Uri.parse(videoThumbnailUri);
    yourImageView.setImageURI(uri);

I say this is the simplest because there are more things you should do when setting an image uri. One thing is you should base the Picture your grab from yourVideosPictures based on the width of your ImageView so that you're not needlessly pulling down a larger image than you need.

You should also probably not just set the image URI directly onto yourImageView, but instead you should use some image caching library (or some caching implementation).

I'd suggest looking into Picasso, Glide, or Fresco. Or just google "Image caching on Android".

Upvotes: 3

Ejaz Ahmad
Ejaz Ahmad

Reputation: 644

Please user Picasso library to load image in Image-view.

In gradle 

implementation 'com.squareup.picasso:picasso:2.71828'

in your adapter class

mVimeoClient.fetchNetworkContent(VIDEO_URI, new ModelCallback<VideoList>(VideoList.class) {
           @Override
           public void success(VideoList videoList) {
                ArrayList<Video> videoArrayList = videoList.data;
               Video video = videoArrayList.get(0);
               ArrayList<Pictures> arrayListPics = video.pictures.sizes;


Picasso.get().load(arrayListPics.get(0).getpath).into(view);
           }
           @Override
           public void failure(VimeoError error) {
           }
        });
}

Upvotes: 1

Related Questions