UI控件之 Gallery 画廊控件的使用

    Gallery控件一般是用于显示图像列表，因此也称为是画廊控件， Gallery只能水平显示一行，而且支持水平滑动效果。也就是说，单击、选中或者拖动Gallery中的图像， Gallery图像中的列表会根据不同的情况向左向右移动，直到显示到最后的一个图像为止。

    1. 在学习Gallery控件之前，我们需要掌握一些准备知识

1) Adapter (适配器)

查看这个 Adapter 的 Android 官方API文档：适配器对象作为AdapterView 和这个视图下数据的桥梁，它提供了返回数据选项的权利，当然它还可以在这些数据集合中添加数据元素。

它是一个接口，可以看出有很多实现这个接口的子类的适配器，为什么Android中的Adapter会有这么多适配器呢？主要是因为android中的UI展示的控件不一样，所以要用到这些不同的适配器来填充数据。如下图所示：

    当我们手机的屏幕想要显示一些数据的时候，它不是直接来源与数据源，而是先从适配器中去取出数据，数据源中的数据则需要填充到适配中，这样Android在展示某些数据就可以用不同的方式来展示，同时也需要不同的适配器来装载这些数据来填充的手机的UI控件中，这个类似于生活中的笔记本电脑。

2) 创建一个类继承 BaseAdapter

了解上面的知识框架之后，我们必须自己创建一个适配器类来继承 BaseAdapter，注意的是我们在声明一个类去继承这个适的时候，一般都不会直接去用这个类去实现Adapter接口，我们一般是去继承BaseAdapter这个抽象类，它是所有适配器中可以自定义的适配器，它里面所填充的格式或者内容都是用户可以自己去定义的。

 

public class ImageAdapter extends BaseAdapter

而后，我们必须实现下面这四个方法

1) getCount() 表示在适配器中有多少个数据选项

2) getItem(int position) 表示根据position位置来得到数据选项的值

3) getItemId(int position)  根据position位置得到所在选项的Id

4) getView(int position, View convertView, ViewGroup parent)【重要】表示在数据集合中指定一个位置得到一个视图来显示数据。更多内容，查看API文档中的这个方法定义。

由于在这里我们设计的是一个自定义的适配器，所以需要用自定义的布局来显示。这种情况下通常Android的通用布局是不能满足需求的，所以可以手工创建一个View视图，也可以用一个inflate来加载一个XML文件，然后从数据中根据position获得每一个Item的值，加载到指定的XML布局中，参数说明如下：

int position：     表示需要显示视图的适配器中选项的位置信息

View convertView： 参数表示一个旧的布局，如果没有新的布局加载的时候，将使用旧的布局

ViewGroup parent： 当前这个填充的布局，会被追加到父布局中。

2. Gallery画廊案例的实现

1) 布局文件

 

<?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" >

    <Gallery android:id="@+id/gallery"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"/>

</LinearLayout>

2) attrs.xml,在values文件下，这个文件主要添加一些属性的信息，替我们找到gallery的设计风格

 

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

    </declare-styleable>
</resources>

 

3) 主程序代码

 

public class GalleryDemo extends Activity {

    private Gallery gallery;
    private ImageAdapter imageAdapter;

    // 声明图片的数组
    private int[] resIds = {
            R.drawable.item1, R.drawable.item2, R.drawable.item3, R.drawable.item4,
            R.drawable.item5, R.drawable.item6, R.drawable.item7, R.drawable.item8,
            R.drawable.item9, R.drawable.item10, R.drawable.item11, R.drawable.item12,
            R.drawable.item13, R.drawable.item14, R.drawable.item15,
    };

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        gallery = (Gallery) findViewById(R.id.gallery);
        imageAdapter = new ImageAdapter(this);
        gallery.setAdapter(imageAdapter);
    }

    public class ImageAdapter extends BaseAdapter {

        private Context context;

        int mGralleryItemBackground; // 使用简单的计数器，主要是完成往每一个Item中去填充背景的图片

        public ImageAdapter(Context context) {
            this.context = context;
            // 使用类型数组来读取属性
            TypedArray typedArray = obtainStyledAttributes(R.styleable.Gallery);
            mGralleryItemBackground = typedArray.getResourceId(
                    R.styleable.Gallery_android_galleryItemBackground, 0);

        }

        @Override
        public int getCount() {
            // TODO Auto-generated method stub
            return Integer.MAX_VALUE; // 返回当前适配器最大值，是整数类型的。
        }

        @Override
        public Object getItem(int position) {
            // TODO Auto-generated method stub
            return resIds[position]; // 返回数组resIds[]的位置信息
        }

        @Override
        public long getItemId(int position) {
            // TODO Auto-generated method stub
            return position;
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {

            ImageView imageView = new ImageView(context);
            // 表示往imageView中填充图片的信息，填充的时候传递是resIds[]的下标
            imageView.setImageResource(resIds[position % resIds.length]);
            // 表示当前ImageView 把图片 不按比例扩大/缩小到View的大小显示
            imageView.setScaleType(ImageView.ScaleType.FIT_XY);
            // 设置ImageView的大小
            imageView.setLayoutParams(new Gallery.LayoutParams(200, 150));
            // 设置ImageView的背景
            imageView.setBackgroundResource(mGralleryItemBackground);
            // TODO Auto-generated method stub
            return imageView;
        }

    }
}

3. 程序执行结果

 

源码下载地址：http://download.csdn.NET/detail/xukunhui2/5527233