Query images from SDCard and display them in a GridView

Question

I'm trying to wrap my around this problem. I have some code that uses a CursorLoader to query images from the sdcard and display them in a GridView with a help of a SimpleCursorAdapter. I followed some examples online and read through the documentation. I know I got part things right. The code runs without any errors, however I cannot get the thumbnails to display on the grid. Following is the code I have gotten so far:

GalleryFragment.java

public class GalleryFragment extends Fragment {

    private SimpleCursorAdapter adapter;
    public static final int PHOTO_LIST_ID = 0x01;

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_gallery, container, false);
        // Bind adapter to grid
        setupCursorAdapter();
        // Initialize the loader with a special ID and the defined callbacks
        getLoaderManager().initLoader(PHOTO_LIST_ID,
                new Bundle(), imageLoader);
        GridView gridView = (GridView) view.findViewById(R.id.gridView);
        gridView.setAdapter(adapter);
        return view;

    }

    private void setupCursorAdapter() {
        String[] from = {MediaStore.Images.Thumbnails.DATA};
        int[] to = {R.id.imageView};
        adapter = new SimpleCursorAdapter(getActivity().getBaseContext(),
                R.layout.gallery_image_item,
                null, from, to,
                0);
    }

    private LoaderManager.LoaderCallbacks<Cursor> imageLoader =
            new LoaderManager.LoaderCallbacks<Cursor>() {

                @Override
                public Loader<Cursor> onCreateLoader(int id, Bundle args) {
                    // Define the columns to retrieve
                    String[] projection = {MediaStore.Images.Thumbnails._ID,
                        MediaStore.Images.Thumbnails.DATA};
                    return new CursorLoader(getActivity(),
                            MediaStore.Images.Thumbnails.EXTERNAL_CONTENT_URI,
                            projection, null, null, null);
                }

                @Override
                public void onLoadFinished(Loader<Cursor> loader, Cursor data) {
                    adapter.swapCursor(data);
                }

                @Override
                public void onLoaderReset(Loader<Cursor> loader) {
                    adapter.swapCursor(null);
                }
            };
}

fragment_gallery.xml

<LinearLayout 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="edu.sfsu.csc780.pictachio.GalleryFragment">

    <GridView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/gridView"
        android:numColumns="auto_fit"
        android:verticalSpacing="10dp"/>

</LinearLayout>

gallery_image_item.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">


    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/imageView"
        android:padding="10dp"
        android:adjustViewBounds="true"
        android:contentDescription="ImageView" />
</FrameLayout>

I read in many places, that RecyclerView is the recommended approach instead of a GridView. I had given a shot at it, but I didn't know what kind of model to create for this. Any help with this is appreciated. Thanks.

Answer 1

I do not understand the use of getLoaderManager() and initLoader() for getting images. One way is to get them from the SQLite database. A proper Google documentation is @ SQL query. I provide a sample code using that query method. However I never had to get images in Android.

Uri uri = MediaStore.Audio.Media.EXTERNAL_CONTENT_URI;
String[] cols = new String[]{
                MediaStore.Images.Media.DATA,  // get the image
};
//String where = MediaStore.Images.Media.DATA;

Cursor cursor = getContentResolver().query(uri, cols, null, null, null);
if(cursor.moveToFirst()) {
   int column_image = cursor.getColumnIndexOrThrow(MediaStore.Images.Media.DATA);
   res = cursor.getString(column_image);
}
cursor.close();

Notes:

• The third and fourth parameter of query() is useful for filtering the returned data.
• The cursor object is returned from query and it can be traversed, sample code is listed above.
• Another interesting way is to use @ getExternalStorageDirectory of class Environment. I have used it to find files in a specific directory. This technique may actually be faster since it searches in a specific directory instead of querying the database. However there may be undesired permission issues especially with the SD card.

Try it out, and let us know what happens.

Answer 2

Best way is to use recent-images library. It is so simple. Just add library dependency to your project and then put below lines to your class. Your adapter is ready, you can set it for your gridview.

RecentImages ri = new RecentImages();
ImageAdapter adapter = ri.getAdapter(MainActivity.this);

It has some option for customizing your query on images.