GridView控件的使用(上)

GridView是一种网格控件 

使用GridView要结合Adapter显示数据   并且为GridView设置OnItemClickListener事件

这里我们先说如何将GridView结合在Adapter上显示数据

 注意：这里我们要说明一下GridView的几个属性

首先我们定义布局文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <GridView
        android:id="@+id/gv_pic"
        android:layout_width="fill_parent"                           
        android:layout_height="wrap_content"
        android:numColumns="3"
        android:horizontalSpacing="5dip"
        android:verticalSpacing="10dip"
        >
    </GridView>

</LinearLayout>

这里我们把显示的图片定义的稍微复杂一点 

就是 既要显示图片 又要显示下面和图片相配的文字

这样的话我们要定义第二个xml文件  控制好图片和文字的布局

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/iv_pic"
        android:layout_width="50dip"
        android:layout_height="50dip"
        android:scaleType="centerInside"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        
        />

    <TextView
        android:id="@+id/tv_content"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/iv_pic"
        android:layout_marginTop="44dp"
        android:layout_marginLeft="20dip"
        
         />

</RelativeLayout>

最后我们来定义适配器 并将其绑定到GridView上

public class TestGridView extends Activity {
    private GridView gridView = null;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.gridview_pic);
        gridView = (GridView) findViewById(R.id.gv_pic);
        gridView.setAdapter(new ImageAdatper(TestGridView.this));
    }

    private class ImageAdatper extends BaseAdapter {
        private Context context=null;
        private int[] image = { R.drawable.q1, R.drawable.q2, R.drawable.q3,         注意： 这里我们定义两个数组分别保存图片和名字
                R.drawable.q4, R.drawable.q5 };
        private String[] name = { "尼玛1号", "尼玛2号", "尼玛3号", "尼玛4号", "尼玛5号" };

        public ImageAdatper(Context context) {
            this.context = context;
        } 
        @Override
        public int getCount() {
            // TODO Auto-generated method stub
            return image.length;
        }
        @Override
        public Object getItem(int arg0) {
            // TODO Auto-generated method stub
            return null;

        }
        @Override
        public long getItemId(int arg0) {
            // TODO Auto-generated method stub
            return 0;
        }
        @Override
        public View getView(int position, View view, ViewGroup vg) {
            LayoutInflater lf=LayoutInflater.from(context);
            View v =lf.inflate(R.layout.gridview_item, null);
            
            ImageView imageView=(ImageView)v.findViewById(R.id.iv_pic);
            imageView.setImageResource(image[position]);
            TextView textView=(TextView) v.findViewById(R.id.tv_content);
            textView.setText(name[position]);
            return v;
        }
    }

}

最后效果图