android之Gallery

Gallery:就是画廊，在android手机上我们经常会看到有个图片画廊，当我们点击后就会将我们点击的图片设置为手机的背景。今天我们就来实现这么有个功能，在这个工程中只设了点击事件，还没设置划屏功能（划屏之后会跟进），在程序中我们设置当我们点击了图片之后，我们将点击的图片设成背景图片，并且实现了画廊图片能够循环滚动的效果。

先看效果：

程序开始，未点击时的效果：

 

当点击画廊上的图片后，我们将点击的图片设置成背景图片，并且用一个Toast将点击的图片的id显示出来

 

 

 

在这个程序里我是放了6张图片，先将这六张图片放到上图上方的Gallery中，当点击后，就显示点击的图片，并且将Gallery中的图片不断循环。

首先，要建个GalleryProject工程，在工程的res/drawable下面放入你作为显示的图片，我这里是放了6张图片。

layout中xml文件：

在文件中设置了一个ImageView，这个是拿来显示你点击的图片后的大图的，还设置了一个Gallery，这是个画廊，是用来显示你放在res/drawable中的小图片的。

<?xml version="1.0" encoding="utf-8"?> 
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
     > 
 
    <ImageView 
        android:id="@+id/myImageView" 
        android:layout_width="fill_parent" 
        android:layout_height="fill_parent" 
        android:src="@drawable/p_w_picpath_1"> 
          
    </ImageView> 
     
   <Gallery 
       android:id="@+id/gallery" 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       //这里是设置在Gallery中每张图片之间的间隔的
       android:spacing="5dp" > 
 
   </Gallery> 
 
</FrameLayout> 

 

 

在values文件中添加attrs.xml文件

attrs.xml文件：

下面的代码就是设置Gallery的背景风格

<?xml version="1.0" encoding="utf-8"?> 
<resources> 
    <declare-styleable name="MainActivity"> 
        <attr name="android:galleryItemBackground"> 
              
        </attr> 
    </declare-styleable> 
</resources> 

再来看看Activaty.java 文件：

 

package com.cheng.gallerytest;  
 
 
import java.lang.System;  
import android.os.Bundle;  
import android.R.integer;  
import android.app.Activity;  
import android.content.Context;  
import android.content.res.TypedArray;  
import android.view.Menu;  
import android.view.View;  
import android.view.ViewGroup;  
import android.widget.AdapterView;  
import android.widget.AdapterView.OnItemClickListener;  
import android.widget.BaseAdapter;  
import android.widget.Gallery;  
import android.widget.ImageView;  
import android.widget.Toast;  
 
 
public class MainActivity extends Activity {  
 
    //定义一个Gallery和一个Imageview  
    private Gallery mGallery;  
    private ImageView mImageView;  
    @Override 
    protected void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        super.setContentView(R.layout.activity_main);  
          
        //通过程序获得我们在xml文件中定义的Gallery和ImageView  
        mImageView = (ImageView)findViewById(R.id.myImageView);  
        mGallery = (Gallery)findViewById(R.id.gallery);  
        //给Gallery设置一个图片适配器，通过适配器去找到我们点击的图片  
        mGallery.setAdapter(new ImageAdapter(this));  
        //设置点击事件监听  
        OnItemClickListener oicl = new OnItemClickListener() {  
 
            @Override 
            public void onItemClick(AdapterView<?> parent, View view, int position,  
                    long id) {  
                // TODO Auto-generated method stub  
                //当点击时将被点击的图片作为背景显示出来  
                mImageView.setImageResource(((ImageView)view).getId());  
                Toast.makeText(getApplicationContext(), "getId:"+((ImageView)view).getId() +"当前图片:"+ position, Toast.LENGTH_LONG).show();  
                  
                  
                  
            }  
        };  
        //将监听事件绑定到我们的Gallery上面  
        mGallery.setOnItemClickListener(oicl);  
    }  
 
    @Override 
    public boolean onCreateOptionsMenu(Menu menu) {  
        // Inflate the menu; this adds items to the action bar if it is present.  
        getMenuInflater().inflate(R.menu.activity_main, menu);  
        return true;  
    }  
    //这是自己实现的图片适配器，它是继承BaseAdapter  
    public class ImageAdapter extends BaseAdapter  
    {  
        int mGalleryItemBackground;  //Item的修饰背景      
        private Context mContext;    //上下文对象  
        private int[] mImage ={     //图片数组  
                R.drawable.p_w_picpath_1,  
                R.drawable.p_w_picpath_2,  
                R.drawable.p_w_picpath_3,  
                R.drawable.p_w_picpath_4,  
                R.drawable.p_w_picpath_5,  
                R.drawable.p_w_picpath_6  
        };   
        public ImageAdapter(Context c)  
        {  
            mContext = c;  
            //通过我们定义的背景风格设置Gallery背景风格  
            TypedArray a = obtainStyledAttributes(R.styleable.MainActivity);  
            mGalleryItemBackground = a.getResourceId(R.styleable.MainActivity_android_galleryItemBackground, 0);  
            a.recycle();  
        }  
        @Override 
        public int getCount() {  
            // TODO Auto-generated method stub  
              
            return Integer.MAX_VALUE;  //为了实现图片的循环，将总数设置的很大，position的值是不断加的，通过position%mImage.length的方式得到图片的位置  
        }  
 
        @Override 
        public Object getItem(int position) {  
            // TODO Auto-generated method stub  
            return position;  
        }  
 
        @Override 
        public long getItemId(int position) {  
            // TODO Auto-generated method stub  
            return position;  
        }  
 
        @Override 
        public View getView(int position, View convertView, ViewGroup parent) {  
            // TODO Auto-generated method stub  
            ImageView i = new ImageView(mContext);  
            //设置ImageView  
            i.setImageResource(mImage[position%mImage.length]);  
            //设置id  
            i.setId(mImage[position%mImage.length]);  
            i.setScaleType(ImageView.ScaleType.FIT_XY);  
            //设置Gallery的布局  
            i.setLayoutParams(new Gallery.LayoutParams(240, 320));  
            //设置背景风格  
            i.setBackgroundResource(mGalleryItemBackground);  
              
            return i;  
        }  
    }  
}  

      在ImageAdapter类中有两个非常重要的方法：getCount和getView。其中getCount方法用于返回图像总数，要注意的是这个总数是不能大于图像的实际数（可以小于图像的实际数），否则会有越界异常。当Gallery组件要显示某一个图像时，就会调用getView方法，并将当前的图像索引（position）传入该方法。一般getview方法用于返回每一个显示图像的组件，由此可以看出，Gallery组件是及时显示图像的，而不是一下将所有的图像都显示出来。在getView方法中除了创建了ImageView对象，还用从mImage数组中获得了相应的图像资源ID来设置在ImageView中显示的图像。最后设置了Gallery组件的背景显示风格。在这里为了能让我们的Gallery能够循环的显示，我们将GetCount方法中的return返回的值设置了一个很大的整数，但是position是不断的向上加的，所以我将position%mImage.length作为我们图片的position，这样我们的Gallery就可以循环的显示了。

 

ok，睡觉了。

工程下载地址：

http://down.51cto.com/data/672711