GridView,顾名思义,就是一个以网格形式展示出来的可滚动的视图组件,最典型的应用就是经常见到的九宫图。GridView的条目是通过关联一个ListAdapter来实现的。
一、常用属性及方法
android:gravity
设置此组件中的内容在组件中的位置。关联的方法为 setGravity (int)。
android:numColumns、android:columnWidth
列数、列的宽度,关联的方法分别为:setNumColumns(int)、setColumnWidth(int)(以像素为单位)。
当不设置numColumns属性时,该属性默认为AUTO_FIT(即自动适应)。
android:horizontalSpacing、android:verticalSpacing
两列之间的间距、两行之间的间距,关联方法分别为setHorizontalSpacing(int)、setVerticalSpacing(int)
android:stretchMode
缩放模式,关联方法为setStretchMode(int)。stretchMode可以选值:
NO_STRETCH
二、GridView的使用
首先,我们在布局文件对GridView进行定义,并将布局文件命名为base_gridview.xml:
接着,我们定义GridView的Item布局文件,将其命名为base_gridview_item:
在GridView中,我们在每个单元格都显示一张图片跟一行文字。
最后,我们通过Adapter为GridView绑定数据。
一、常用属性及方法
android:gravity
设置此组件中的内容在组件中的位置。关联的方法为 setGravity (int)。
android:numColumns、android:columnWidth
列数、列的宽度,关联的方法分别为:setNumColumns(int)、setColumnWidth(int)(以像素为单位)。
当不设置numColumns属性时,该属性默认为AUTO_FIT(即自动适应)。
android:horizontalSpacing、android:verticalSpacing
两列之间的间距、两行之间的间距,关联方法分别为setHorizontalSpacing(int)、setVerticalSpacing(int)
android:stretchMode
缩放模式,关联方法为setStretchMode(int)。stretchMode可以选值:
NO_STRETCH
STRETCH_SPACING
STRETCH_SPACING_UNIFORM
STRETCH_COLUMN_WIDTH二、GridView的使用
首先,我们在布局文件对GridView进行定义,并将布局文件命名为base_gridview.xml:
<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/grdBase"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:numColumns="auto_fit"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:columnWidth="90dp"
android:stretchMode="columnWidth"
android:gravity="center"/>
接着,我们定义GridView的Item布局文件,将其命名为base_gridview_item:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content" android:layout_width="fill_parent">
<ImageView android:id="@+id/ItemImage"
android:layout_height="wrap_content" android:layout_width="wrap_content" android:layout_centerHorizontal="true"/>
<TextView android:id="@+id/ItemText"
android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true"
android:layout_below="@+id/ItemImage" android:text="TextView01"/>
</RelativeLayout>
在GridView中,我们在每个单元格都显示一张图片跟一行文字。
最后,我们通过Adapter为GridView绑定数据。
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.GridView;
import android.widget.SimpleAdapter;
import android.widget.AdapterView.OnItemClickListener;
import cn.youtous.R;
public class BaseGridView extends Activity {
private GridView grdBase;
private List<HashMap<String,Object>> mGrdData;
private void initGridViewData(){
mGrdData = new ArrayList<HashMap<String, Object>>();
for(int i=0;i<this.mImages.length;i++){
HashMap<String, Object> map = new HashMap<String, Object>();
map.put("ItemImage", mImages[i]);
map.put("ItemText", mTexts[i]);
mGrdData.add(map);
}
}
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.base_gridview);
GridView grd = (GridView)findViewById(R.id.grdBase);
this.initGridViewData();
SimpleAdapter adapter = new SimpleAdapter(this,
mGrdData,
R.layout.base_gridview_item,
new String[]{"ItemImage","ItemText"},
new int[]{R.id.imgBaseGridViewItem,R.id.tvwBaseGridViewItem});
grd.setAdapter(adapter);
grd.setOnItemClickListener(new GrdBaseItemClickListener());
}
class GrdBaseItemClickListener implements OnItemClickListener{
@Override
public void onItemClick(AdapterView<?> arg0, View arg1, int position ,
long id) {
}
}
private int[] mImages = {
R.drawable.carlogo_52design_01, R.drawable.carlogo_52design_06, R.drawable.carlogo_52design_09,
R.drawable.carlogo_52design_12, R.drawable.carlogo_52design_19, R.drawable.carlogo_52design_21,
R.drawable.carlogo_52design_27,
R.drawable.carlogo_52design_29, R.drawable.carlogo_52design_31, R.drawable.carlogo_52design_32,
R.drawable.carlogo_52design_34, R.drawable.carlogo_52design_36, R.drawable.carlogo_52design_37
};
private String[] mTexts = {
"本田","起亚","雷克萨斯",
"马自达","日产","标致",
"斯柯达",
"丰田","大众","沃尔沃",
"奥迪","宝马","别克"
};
}