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/image_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.image_1,
                R.drawable.image_2,
                R.drawable.image_3,
                R.drawable.image_4,
                R.drawable.image_5,
                R.drawable.image_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