Android Program Development: (14) display images-14.1 Gallery and ImageView

Gallery displays a series of images and slides horizontally. The following shows how to use Gallery to display a series of images.
 
1. Create a project, Gallery.
 
2. Code in main. xml.
 
[Html]
<? 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">
 
<TextView
Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"
Android: text = "Images of San Francisco"/>

<Gallery
Android: id = "@ + id/gallery1"
Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"/>
 
<ImageView
Android: id = "@ + id/image1"
Android: layout_width = "320dp"
Android: layout_height = "250dp"
Android: scaleType = "fitXY"/>
 
</LinearLayout>
3. Create a file named attrs. xml under the res/values folder.
4. Code in attrs. xml.
 
[Html]
<? Xml version = "1.0" encoding = "UTF-8"?>
<Resources>
<Declare-styleable name = "Gallery1">
<Attr name = "android: galleryItemBackground"/>
</Declare-styleable>
</Resources>
5. Prepare some images. Place these images under res/drawable-mdpi.
 
 
 
6. Code in GalleryActivity. java.
 
[Java]
Public class GalleryActivity extends Activity {
Integer [] imageIDs = {
R. drawable. pic1,
R. drawable. pic2,
R. drawable. pic3,
R. drawable. pic4,
R. drawable. pic5,
R. drawable. pic6,
R. drawable. pic7
};
 
/** Called when the activity is first created .*/
@ Override
Public void onCreate (Bundle savedInstanceState ){
Super. onCreate (savedInstanceState );
SetContentView (R. layout. main );

Gallery gallery = (Gallery) findViewById (R. id. gallery1 );
 
Gallery. setAdapter (new ImageAdapter (this ));
Gallery. setOnItemClickListener (new OnItemClickListener ()
{
Public void onItemClick (AdapterView <?> Parent, View v,
Int position, long id)
{
Toast. makeText (getBaseContext (),
"Pic" + (position + 1) + "selected ",
Toast. LENGTH_SHORT). show ();

ImageView imageView = (ImageView) findViewById (R. id. image1 );
ImageView. setImageResource (imageIDs [position]);
}
});
}

Public class ImageAdapter extends BaseAdapter
{
Context context;
Int itemBackground;
 
Public ImageAdapter (Context c)
{
Context = c;
// --- Setting the style ---
TypedArray a = obtainStyledAttributes (R. styleable. Gallery1 );

ItemBackground = a. getResourceId (
R. styleable. Gallery1_android_galleryItemBackground, 0 );

A. recycle ();
}
 
// --- Returns the number of images ---
Public int getCount (){
Return imageIDs. length;
}
 

// --- Returns the item ---
Public Object getItem (int position ){
Return position;
}
 
// --- Returns the ID of an item ---
Public long getItemId (int position ){
Return position;
}

// --- Returns an ImageView ---
Public View getView (int position, View convertView, ViewGroup parent ){
ImageView imageView;
If (convertView = null ){
ImageView = new ImageView (context );
ImageView. setImageResource (imageIDs [position]);
ImageView. setScaleType (ImageView. ScaleType. FIT_XY );
ImageView. setLayoutParams (new Gallery. LayoutParams (150,120 ));
} Else {
ImageView = (ImageView) convertView;
}
ImageView. setBackgroundResource (itemBackground );
Return imageView;
}
}
 
}
7. Press F11 to debug the simulator. You can see a series of images that can slide left and right. When you click an image, a message is displayed.
 
 
 
First, add the Gallery and ImageView controls in main. xml:
 
[Html]
<Gallery
Android: id = "@ + id/gallery1"
Android: layout_width = "fill_parent"
Android: layout_height = "wrap_content"/>
 
<ImageView
Android: id = "@ + id/image1"
Android: layout_width = "320dp"
Android: layout_height = "250dp"
Android: scaleType = "fitXY"/>
As mentioned above, Gallery is used to display a series of images and ImageView is used to display the selected images.
The IDS of these images are saved in the imageIDs array:
 
[Java]
Integer [] imageIDs = {
R. drawable. pic1,
R. drawable. pic2,
R. drawable. pic3,
R. drawable. pic4,
R. drawable. pic5,
R. drawable. pic6,
R. drawable. pic7
};
Next, we will create a subclass of BaseAdapter: ImageAdapter. In this way, we can bind Gallery with image resources. This adapter acts as a bridge.
The views using BaseAdapter include:
 
ListView
GridView
Spinner
Gallery
BaseAdapter also has some subclasses:
 
ListAdapter
ArrayAdapter
CursorAdapter
SpinnerAdapter
In ImageAdapter, we mainly implement the following methods:
 
[Java]
Public class ImageAdapter extends BaseAdapter
{
Context context;
Int itemBackground;
 
Public ImageAdapter (Context c)
{
Context = c;
// --- Setting the style ---
TypedArray a = obtainStyledAttributes (R. styleable. Gallery1 );

ItemBackground = a. getResourceId (
R. styleable. Gallery1_android_galleryItemBackground, 0 );

A. recycle ();
}
 
// --- Returns the number of images ---
Public int getCount (){
Return imageIDs. length;
}
 

// --- Returns the item ---
Public Object getItem (int position ){
Return position;
}
 
// --- Returns the ID of an item ---
Public long getItemId (int position ){
Return position;
}

// --- Returns an ImageView ---
Public View getView (int position, View convertView, ViewGroup parent ){
ImageView imageView;
If (convertView = null ){
ImageView = new ImageView (context );
ImageView. setImageResource (imageIDs [position]);
ImageView. setScaleType (ImageView. ScaleType. FIT_XY );
ImageView. setLayoutParams (new Gallery. LayoutParams (150,120 ));
} Else {
ImageView = (ImageView) convertView;
}
ImageView. setBackgroundResource (itemBackground );
Return imageView;
}
}