This code displays thumbnail images below a image view. Once click on these thumbnail images, the actual image will be displayed in the image view above.
I have used ImageAdapter class that extends BaseAdapter which sets the images in the gallery below and its corresponding preview in the image view ,according to the array passed to it.
You will also need to declare-styleable in the attributes.xml of res folder.This is used bt ImageAdapater class.
A screenshot is also provided for your refrence.
public class GalleryView extends Activity {
//array of background images that appear in the gallery
Integer[] pics = {
R.drawable.image01,
R.drawable.image02,
R.drawable.image03,
R.drawable.image04
};
ImageView imageView;
private Context ctx;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.gallery);//set layout
// Gallery view shows items in a center-locked, horizontally scrolling list.
Gallery ga = (Gallery)findViewById(R.id.Gallery01);
ga.setAdapter(new ImageAdapter(this));//setting adapter for adding many images
imageView = (ImageView)findViewById(R.id.ImageView01);//fetching image view by id
//when clicking on gallery thumbnail the image is displayed in the image view above
ga.setOnItemClickListener(new OnItemClickListener() {
public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
long arg3) {
imageView.setImageResource(pics[arg2]);//setting image from array passed
}
});
}
public class ImageAdapter extends BaseAdapter {
int imageBackground;
public ImageAdapter(Context c) {
ctx = c;
//TypedArray stores styled attributes
TypedArray ta = obtainStyledAttributes(R.styleable.Gallery1);
// Retrieve the resource identifier for the attribute at index
imageBackground = a.getResourceId(R.styleable.Gallery1_android_galleryItemBackground, 1);
//Give back a previously retrieved StyledAttributes, for later re-use.
ta.recycle();
}
public int getCount() {
return pics.length;//no. of pics in gallery
}
public Object getItem(int arg0) {
return arg0;
}
public long getItemId(int arg0) {
return arg0;
}
@Override
//Get a View that displays the data at the specified position in the data set
public View getView(int arg0, View arg1, ViewGroup arg2) {
ImageView iv = new ImageView(ctx);
iv.setImageResource(pics[arg0]);//setting image thumbnail
// Controls how the image should be resized or moved to match the size of this ImageView.
iv.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
// Set the layout parameters associated with this view
iv.setLayoutParams(new Gallery.LayoutParams(150,120));
// Set the background to a given resource
iv.setBackgroundResource(imageBackground);
return iv;
}
}
}
Attributes.xml in res folder
<?xml version=“1.0” encoding=“utf-8”?>
<resources>
<declare-styleable name=“Gallery1”>
<attr name=“android:galleryItemBackground”/>
</declare-styleable>
</resources>
gallery.xml in layout folder
<?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=“fill_parent”
android:orientation=“vertical” >
<ImageView
android:id=“@+id/ImageView01”
android:layout_width=“fill_parent”
android:layout_height=“2px”
android:layout_margin=“10dip”
android:layout_weight=“1”
android:scaleType=“centerInside” >
</ImageView>
<Gallery
android:id=“@+id/Gallery01”
android:layout_width=“fill_parent”
android:layout_height=“wrap_content”
android:scaleType=“centerInside” >
</Gallery>
</LinearLayout>
Screenshot :
