Showing Video Thumbnails in Android 2.0

I was trying to generate Video Thumbnails in Android 2.0 for couple of days and then found a solution that is given here step by step:

Step 1:

First create the layout as follows:

<?xml version=”1.0″ encoding=”utf-8″?>

<LinearLayout
android:layout_width=”fill_parent”
android:layout_height=”fill_parent”
android:orientation=”vertical”
android:background=”@color/white”
>
android:id=”@+id/videoGrdVw”
android:layout_width=”fill_parent”
android:layout_height=”fill_parent”
android:numColumns=”auto_fit”
android:verticalSpacing=”5dip”
android:horizontalSpacing=”5dip”
android:columnWidth=”80dip”
android:stretchMode=”columnWidth”

android:gravity=”center”</div>

/>
</LinearLayout>

And Save it as main.xml

Step 2:

Create an activity.  For my case, i named it Start Activity.  I have declared the following variables that will be used later in the program:

private final static Uri MEDIA_EXTERNAL_CONTENT_URI = MediaStore.Video.Media.EXTERNAL_CONTENT_URI;

private final static String _ID = MediaStore.Video.Media._ID;

private final static String MEDIA_DATA = MediaStore.Video.Media.DATA;

private GridView _gallery;

private Cursor _cursor;

private int _columnIndex;

private int[] _videosId;

private Uri _contentUri;

protected Context _context;

Step 3:

Then add a function initVideosId() and call it from Activity OnCreate. This function will take all the IDs of the video files in the SD Card into _videosId array.

private void initVideosId() {

try {

//Here we set up a string array of the thumbnail ID column we want to get back

String [] proj={_ID};

//Now we create the cursor pointing to the external thumbnail store

_cursor = managedQuery(_contentUri,

proj, // Which columns to return

null,       // WHERE clause; which rows to return (all rows)

null,       // WHERE clause selection arguments (none)

null); // Order-by clause (ascending by name)

int count= _cursor.getCount();

// We now get the column index of the thumbnail id

_columnIndex = _cursor.getColumnIndex(_ID);

//initialize

_videosId = new int[count];

//move position to first element

_cursor.moveToFirst();

for(int i=0;i<count;i++)

{

int id = _cursor.getInt(_columnIndex);

//

_videosId[i]= id;

//

_cursor.moveToNext();

//

}

}

catch(Exception ex)

{

showToast(ex.getMessage().toString());

}

}

Step 4:

Then set the Gallery Adapter in a function and call it from Activity OnCreate. Initially there is no ItemClickListener :-):

private void setGalleryAdapter() {

_gallery.setAdapter(new VideoGalleryAdapter(_context));

}

Step 5:

The VideoGalleryAdapter Class:

private class VideoGalleryAdapter extends BaseAdapter

{

public VideoGalleryAdapter(Context c)

{

_context = c;

}

public int getCount()

{

return _videosId.length;

}

public Object getItem(int position)

{

return position;

}

public long getItemId(int position)

{

return position;

}

public View getView(int position, View convertView, ViewGroup parent)

{

ImageView imgVw= new ImageView(_context);;

try

{

if(convertView!=null)

{

imgVw= (ImageView) convertView;

}

imgVw.setImageBitmap(getImage(_videosId[position]));

imgVw.setLayoutParams(new GridView.LayoutParams(96, 96));

imgVw.setPadding(8, 8, 8, 8);

}

catch(Exception ex)

{

System.out.println(“StartActivity:getView()-135: ex ” + ex.getClass() +”, “+ ex.getMessage());

}

return imgVw;

}

// Create the thumbnail on the fly

private Bitmap getImage(int id) {

Bitmap thumb = MediaStore.Video.Thumbnails.getThumbnail(

getContentResolver(),

id, MediaStore.Video.Thumbnails.MICRO_KIND, null);

return thumb;

}

}

Here, the Thumbnail is generated in the getImage() function. And at this stage, if we run the application, for all the videos in the SD Card thumbnails will be shown.

Step 6:

Now its time  to add ItemClickListener in the code:

private AdapterView.OnItemClickListener _itemClickLis = new OnItemClickListener()

public void onItemClick(AdapterView parent, View v, int position, long id)

{

// Now we want to actually get the data location of the file

String [] proj={MEDIA_DATA};

// We request our cursor again

_cursor = managedQuery(_contentUri,

proj, // Which columns to return

null,       // WHERE clause; which rows to return (all rows)

null,       // WHERE clause selection arguments (none)

null); // Order-by clause (ascending by name)

// We want to get the column index for the data uri

int count = _cursor.getCount();

_cursor.moveToFirst();

_columnIndex = _cursor.getColumnIndex(MEDIA_DATA);

// Lets move to the selected item in the cursor

_cursor.moveToPosition(position);

// And here we get the filename

String filename = _cursor.getString(_columnIndex);

//*********** You can do anything when you know the file path :-)

showToast(filename);

//

}

};

Oops!, I forgot the showToast() method. Its nothing but shows a toast. :-)

protected void showToast(String msg)

{

Toast.makeText(_context, msg, Toast.LENGTH_LONG).show();

}

And modify the setGalleryAdapter() function as follows:

private void setGalleryAdapter() {

_gallery.setAdapter(new VideoGalleryAdapter(_context));

_gallery.setOnItemClickListener(_itemClickLis);

}

Now run the code and enjoy happy coding! I have just left the File Path to be shown in the Toast. You can use this for your requirement.

N.B. This is my first blog post. Sorry if you find it boring.

For your ease of coding the whole file is given here.

About these ads

28 thoughts on “Showing Video Thumbnails in Android 2.0

  1. aditi says:

    i run it in android 2.2 but it showing message box that”the application thumbnailvideo (process com.thumbnailvideo)has stopped unexpectedly.please try again”

    i dont know the reason why?

    can anybody help me please..

  2. balaji says:

    System.out.println(“StartActivity:getView()-135: ex ” + ex.getClass() +”, “+ ex.getMessage());

    this line error for me

  3. R.balaji says:

    ok how to create you tube format media player. can u help me i am fresher…..new for android application….please help me….

  4. Huda says:

    hai…
    i’ve download your sourcecode…
    but there is one missing thing…

    int count = _cursor.getCount (); in public void onItemClick is never read locally

    and AdapterView is a raw type

    can you explain me why…
    thank you…

    • Actually its a part of a huge Project. The count was taken to see if there are videos in the Device. so, you can use it as if(count > 0) then do something….

      And AdapterView is raw Type, so you can flatten it to your implemented type as needed.

      Sorry, forgot to check this while copying here. :-)

      • Huda says:

        hai…
        sorry i have to ask you again… :)
        i have to implemented your code…it’s work…i tried it in my galaxy tab…

        my question is..when the video thumbnail clicked/touched the video is won’t play…why? is there any source code i miss??
        or it must be add with some code again?

        please help me…this is for my final task…
        thank you very much…

  5. Suhail Larik says:

    Hi Sadeqbillah,
    Nice tutorial! But i have a problem, actually i want to display thumbnails of videos stored in ‘abc’ folder on sd card, i tried your code it also displays the thumbnails of all video files store in sd card but out of folder ‘abc’. I want thumbnails of only videos in ‘abc’ folder. I think may be i wrong that MediaStore.Video.Media.EXTERNAL_CONTENT_URI references all video files stored on sd card. How can i achieve that? I am googling since more days but failed:(.
    Thanks in advance……

    • Hi,

      thanks that you liked my post. Actually I am quite busy. Can you please look at this post? May be this will help you. Please let me know what happens mailing me at sadeqbillah[at]gmail.com.

      Sorry,

      Meer

      • Suhail Larik says:

        Hi,
        I have mentioned my problem which i am facing on your email.
        Please check it and give me reply if there is any possibility to solve the problem.
        Thanks.

  6. Suhail Larik says:

    Sadeqbillah you have said that ‘look at this post’. But i cant find any link of post as given by you. So please let me know the link of that post.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s