[Tiny Tut] - Getting a image location in a Gallery View

Basic Tutorials concerning: GUI, Views, Activites, XML, Layouts, Intents, ...

[Tiny Tut] - Getting a image location in a Gallery View

Postby digitalspaghetti » Fri Jan 30, 2009 3:17 pm

The below example is from my recent work with Brightroid - An upcoming post photo feature, I needed to get the users images on the SD card and get the location of the file for the post. Below is a cut down version:


First of all, you need to create your gallery view:

Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1.  
  2. <?xml version="1.0" encoding="utf-8"?>
  3.  
  4. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  5.  
  6.    android:orientation="vertical"
  7.  
  8.    android:layout_width="fill_parent"
  9.  
  10.    android:layout_height="fill_parent"
  11.  
  12.    >
  13.  
  14.         <TextView  
  15.  
  16.    android:layout_width="fill_parent"
  17.  
  18.    android:layout_height="wrap_content"
  19.  
  20.    android:text="Select an image to post"
  21.  
  22.    />
  23.  
  24.         <Gallery
  25.  
  26.                 android:id="@+id/gallery"
  27.  
  28.        android:layout_width="fill_parent"
  29.  
  30.        android:layout_height="wrap_content"
  31.  
  32.        android:gravity="bottom" />
  33.  
  34.        
  35.  
  36. </LinearLayout>
  37.  
  38.  
Parsed in 0.003 seconds, using GeSHi 1.0.8.4


The next, you need to create a style for the gallery, this goes in your res/values/attars.xml file:

Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1.  
  2. <?xml version="1.0" encoding="utf-8"?>
  3.  
  4. <resources>
  5.  
  6.     <!-- These are the attributes that we want to retrieve from the theme
  7.  
  8.         in view/Gallery1.java -->
  9.  
  10.     <declare-styleable name="Gallery1">
  11.  
  12.         <attr name="android:galleryItemBackground" />
  13.  
  14.     </declare-styleable>
  15.  
  16. </resources>
  17.  
  18.  
Parsed in 0.001 seconds, using GeSHi 1.0.8.4


Next create your activity. In the below activity, we use a cursor to get the External Content from the SD card, specificity we first want to get the thumbnails - this allows us to show the gallery of images without running out of memory. When you click on an item, you will get a Toast popup with the file location. We get this by doing the same cursor query, except we change from Thumbnails to Images on the external path.

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.  
  2. package org.ifies.android.example;
  3.  
  4.  
  5.  
  6. import android.app.Activity;
  7.  
  8. import android.content.Context;
  9.  
  10. import android.content.res.TypedArray;
  11.  
  12. import android.database.Cursor;
  13.  
  14. import android.net.Uri;
  15.  
  16. import android.os.Bundle;
  17.  
  18. import android.view.View;
  19.  
  20. import android.view.ViewGroup;
  21.  
  22. import android.widget.AdapterView;
  23.  
  24. import android.widget.BaseAdapter;
  25.  
  26. import android.widget.Gallery;
  27.  
  28. import android.widget.ImageView;
  29.  
  30. import android.widget.Toast;
  31.  
  32. import android.widget.AdapterView.OnItemClickListener;
  33.  
  34. import android.provider.MediaStore;
  35.  
  36.  
  37.  
  38. public class GalleryExample extends Activity {
  39.  
  40.                
  41.  
  42.         private Context mContext;
  43.  
  44.     private Cursor cursor;
  45.  
  46.     private int column_index;
  47.  
  48.     private Gallery g;
  49.  
  50.  
  51.  
  52.     @Override
  53.  
  54.     public void onCreate(Bundle savedInstanceState) {
  55.  
  56.         super.onCreate(savedInstanceState);
  57.  
  58.         setContentView(R.layout.post_gallery);
  59.  
  60.                
  61.  
  62.         String [] proj={MediaStore.Images.Thumbnails._ID};
  63.  
  64.         cursor = managedQuery( MediaStore.Images.Thumbnails.EXTERNAL_CONTENT_URI,
  65.  
  66.                 proj, // Which columns to return
  67.  
  68.                 null,       // WHERE clause; which rows to return (all rows)
  69.  
  70.                 null,       // WHERE clause selection arguments (none)
  71.  
  72.                 null); // Order-by clause (ascending by name)
  73.  
  74.         column_index = cursor.getColumnIndexOrThrow(MediaStore.Images.Thumbnails._ID);
  75.  
  76.         // Reference the Gallery view
  77.  
  78.         g = (Gallery) findViewById(R.id.gallery);
  79.  
  80.  
  81.  
  82.         // Set the adapter to our custom adapter (below)
  83.  
  84.         g.setAdapter(new ImageAdapter(this));
  85.  
  86.        
  87.  
  88.         // Set a item click listener, and just Toast the clicked position
  89.  
  90.         g.setOnItemClickListener(new OnItemClickListener() {
  91.  
  92.             public void onItemClick(AdapterView<?> parent, View v, int position, long id) {
  93.  
  94.                
  95.  
  96.                 String [] proj={MediaStore.Images.Media.DATA};
  97.  
  98.                                 cursor = managedQuery( MediaStore.Images.Media.EXTERNAL_CONTENT_URI,
  99.  
  100.                                 proj, // Which columns to return
  101.  
  102.                                 null,       // WHERE clause; which rows to return (all rows)
  103.  
  104.                                 null,       // WHERE clause selection arguments (none)
  105.  
  106.                                 null); // Order-by clause (ascending by name)
  107.  
  108.                         column_index = cursor.getColumnIndexOrThrow(MediaStore.Images.Media.DATA);
  109.  
  110.                                
  111.  
  112.                         cursor.moveToPosition((int) g.getSelectedItemId());
  113.  
  114.                         String filename = cursor.getString(column_index);
  115.  
  116.                 Toast.makeText(GalleryExample.this, filename, Toast.LENGTH_SHORT).show();
  117.  
  118.             }
  119.  
  120.         });        
  121.  
  122.     }
  123.  
  124.  
  125.  
  126.     public class ImageAdapter extends BaseAdapter {
  127.  
  128.         int mGalleryItemBackground;
  129.  
  130.  
  131.  
  132.         public ImageAdapter(Context c) {
  133.  
  134.             mContext = c;
  135.  
  136.             // See res/values/attrs.xml for the <declare-styleable> that defines
  137.  
  138.             // Gallery1.
  139.  
  140.             TypedArray a = obtainStyledAttributes(R.styleable.Gallery1);
  141.  
  142.             mGalleryItemBackground = a.getResourceId(
  143.  
  144.                     R.styleable.Gallery1_android_galleryItemBackground, 0);
  145.  
  146.             a.recycle();
  147.  
  148.         }
  149.  
  150.  
  151.  
  152.         public int getCount() {
  153.  
  154.                 return cursor.getCount();
  155.  
  156.         }
  157.  
  158.  
  159.  
  160.         public Object getItem(int position) {
  161.  
  162.             return position;
  163.  
  164.         }
  165.  
  166.  
  167.  
  168.         public long getItemId(int position) {
  169.  
  170.             return position;
  171.  
  172.         }
  173.  
  174.  
  175.  
  176.         public View getView(int position, View convertView, ViewGroup parent) {
  177.  
  178.                 ImageView i = new ImageView(mContext);
  179.  
  180.                 if (convertView == null) {
  181.  
  182.                         cursor.moveToPosition(position);
  183.  
  184.                         int id = cursor.getInt(column_index);
  185.  
  186.                         i.setImageURI(Uri.withAppendedPath(MediaStore.Images.Thumbnails.EXTERNAL_CONTENT_URI, ""+id));
  187.  
  188.                         i.setScaleType(ImageView.ScaleType.FIT_XY);
  189.  
  190.                         i.setLayoutParams(new Gallery.LayoutParams(136, 88));
  191.  
  192.                         // The preferred Gallery item background
  193.  
  194.                         i.setBackgroundResource(mGalleryItemBackground);
  195.  
  196.                 }
  197.  
  198.                 return i;
  199.  
  200.         }
  201.  
  202.       }
  203.  
  204. }
  205.  
  206.  
Parsed in 0.046 seconds, using GeSHi 1.0.8.4
digitalspaghetti
Freshman
Freshman
 
Posts: 6
Joined: Sun Jan 04, 2009 11:52 pm

Top

Postby Krizzle85 » Wed Apr 01, 2009 1:24 pm

Hee

This is Great i have been looking for something like for a long time now.

But i have an question i was wondering where you have the R.layout.post_gallery defined. ?

ty for any help.
Krizzle85
Freshman
Freshman
 
Posts: 2
Joined: Thu Mar 26, 2009 11:11 am

Top

Return to Novice Tutorials

Who is online

Users browsing this forum: Google [Bot] and 8 guests