Friday, May 6, 2011

Display Video thumbnail in ListView

In this exercise, the path of video sources are hard-coded in a String[]. A ListView with thumbnail, and path of the videos will be implemented.

remark: For minimum API Level 8, Android 2.2.

Display Video thumbnail in ListView

We have to create our custom ArrayAdapter, MyThumbnaildapter. And override getView() method to custom our own view.

Create a file /res/layout/row.xml, it's the layout of individual row in our ListView.
<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="@+id/Thumbnail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/icon"/>
<TextView
android:id="@+id/FilePath"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>


AndroidThumbnailList.java
package com.exercise.AndroidThumbnailList;

import android.app.ListActivity;
import android.content.Context;
import android.graphics.Bitmap;
import android.media.ThumbnailUtils;
import android.os.Bundle;
import android.provider.MediaStore.Video.Thumbnails;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.TextView;

public class AndroidThumbnailList extends ListActivity{

String[] videoFileList = {
"/sdcard/Video/Android 2.0 Official Video_low.mp4",
"/sdcard/Video/Android 2.2 Official Video_low.mp4",
"/sdcard/Video/Android 2.3 Official Video_low.mp4",
"/sdcard/Video/Android 3.0 Preview_low.mp4",
"/sdcard/Video/Android Demo_low.mp4",
"/sdcard/Video/Android in Spaaaaaace!.mp4",
"/sdcard/Video/Android in Spaaaaaace!_low.mp4",
"/sdcard/Video/What is an Android phone-_low.mp4"
};

public class MyThumbnaildapter extends ArrayAdapter<String>{

public MyThumbnaildapter(Context context, int textViewResourceId,
String[] objects) {
super(context, textViewResourceId, objects);
// TODO Auto-generated constructor stub
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
// TODO Auto-generated method stub

View row = convertView;
if(row==null){
LayoutInflater inflater=getLayoutInflater();
row=inflater.inflate(R.layout.row, parent, false);
}

TextView textfilePath = (TextView)row.findViewById(R.id.FilePath);
textfilePath.setText(videoFileList[position]);
ImageView imageThumbnail = (ImageView)row.findViewById(R.id.Thumbnail);

Bitmap bmThumbnail;
bmThumbnail = ThumbnailUtils.createVideoThumbnail(videoFileList[position], Thumbnails.MICRO_KIND);
imageThumbnail.setImageBitmap(bmThumbnail);

return row;
}

}

/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setListAdapter(new MyThumbnaildapter(AndroidThumbnailList.this, R.layout.row, videoFileList));
}
}


Download the files.


Related Article:
- ThumbnailUtils
- Create thumbnail for a video using ThumbnailUtils
- Launch ACTION_VIEW Intent to play mp4

10 comments:

stephy yan said...

Hihi, I want to buy a project with 3 buttons (perhaps 3 link) to be clicked to play 3 videos in raw folder (create by myself) instead of play video in SD card.

Do you have any recommended reference? Thank you ^^

Erik said...

stephy,

MediaPlayer can play video also.

stephy yan said...

I have follow the 'MediaPlayer' link that you recommended to me, but still cannot play the video(no video and no sound).

Am I need to install the MediaPlayer in my emulator?

Erik said...

stephy,

it's not suggested to test on emulator!!!

Unknown said...

please help,
how to load these video thumbnails from path of video url (i.e) youtube url. Thanks

Erik said...

Hello Sangeetha Mohan,

If you target youtube, it's suggested to use YouTube Android Player API.

It support YouTubeThumbnailView.

Unknown said...

hi: great tutorial.
I've done some mods myself like videos name instead of path and layout.

But you think its possible to play videos from expansion .obb package.

been trying foe days now.

Awkwardam said...

Hello,

Thank you for this tutorial. I have tried to use it for myself but it is only displaying the paths for the videos in a list view and not the thumbnails themselves. I am receiving this error:

[DEBUG] get_category: variable seinfo: default sensitivity: NULL, cateogry: NULL

I am wondering if the paths are incorrect? Are the thumbnails coming up as null? I am perplexed on what is going on and would like any insight.

Thank you

Unknown said...

getActivity().getPackageName()
it giving a error that cannot resolve symbol " getActivity() "
and it shows getActivity() in red color

Unknown said...

i am hoping to achieve a simple mod of the newpipe apk. my aim is to compile a slightly simpler "minimal' spin on their app. the idea is to disable the thumbnails within the notification bar, and also the thumbnails in the list area.

what is the best method for achieving this desired result?

Thank you