GridView与数据绑定
一个在平面上可显示多个条目的可滚动的视图组件,该组件中的条目通过一个ListAdapter和该组件进行关联。比如android手机中显示的应用:
比如实现九宫格图,用GridView是首选,也是最简单的。
GridView 的 XML属性
属性名称 | 描述 |
android:columnWidth | 设置列的宽度。
关联的方法为: setColumnWidth(int) 以像素为单位 |
android:gravity | 设置控件内容的位置。可选的值有: top、 bottom、 left、 right、 center_vertical、 fill_vertical、 center_horizontal、 fill_horizontal、 center、 fill、 clip_vertical 可以多选,用“ |”分开。
关联方法: setGravity (int gravity); 方法参数的常量定义参考Gravity.* 默认值为:Gravity.LEFT |
android:horizontalSpacing | 两列之间的间距。
关联方法: setHorizontalSpacing(int) |
android:numColumns | 列数。
关联方法: setNumColumns(int) |
android:stretchMode | 设置 grid中的条目以什么缩放模式去填充空间 。
关联方法: setStretchMode(int) 方法参数的常量定义参考GridView.* ,可选值: NO_STRETCH , STRETCH_SPACING , STRETCH_SPACING_UNIFORM ,或 STRETCH_COLUMN_WIDTH |
android:verticalSpacing | 两行之间的间距。
关联方法: setVerticalSpacing(int) |
以下是具体的例子:
例子效果图
main_grid_view.xml配置
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<GridView
android:id="@+id/main_grid_view_gridview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:numColumns="4"
android:verticalSpacing="10dip"
android:horizontalSpacing="10dip"
android:stretchMode="columnWidth"
android:gravity="center"
/>
</LinearLayout>
main_grid_view_item.xml配置
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/RelativeLayout_Item"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:paddingBottom="5dip"
>
<ImageView
android:id="@+id/main_grid_view_item_item_image"
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<TextView
android:layout_below="@id/main_grid_view_item_item_image"
android:id="@+id/main_grid_view_item_item_text"
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</RelativeLayout>
Activity代码
//定义选项菜单
private String[] allOptionsMenuTexts = {"删除","保存","帮助","添加","详细","发送","电话","照相"};
private int[] allOptionsMenuOrders = {5,2,6,1,4,3,7,8};
private int[] allOptionsMenuIds = {Menu.FIRST+1,Menu.FIRST+2,Menu.FIRST+3,Menu.FIRST+4,Menu.FIRST+5,Menu.FIRST+6,Menu.FIRST+7,Menu.FIRST+8};
private int[] allOptionsMenuIcons = {
android.R.drawable.ic_menu_delete,
android.R.drawable.ic_menu_edit,
android.R.drawable.ic_menu_help,
android.R.drawable.ic_menu_add,
android.R.drawable.ic_menu_info_details,
android.R.drawable.ic_menu_send,
android.R.drawable.ic_menu_call,
android.R.drawable.ic_menu_camera
};
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main_grid_view);
//展示GridView
showGridView();
}
/**
* 显示GridView.
*/
public void showGridView(){
final Context context = this;
Integer[] itemImages = new Integer[allOptionsMenuIcons.length];
for(int i=0;i<itemImages.length;i++){
itemImages[i] = new Integer(allOptionsMenuIcons[i]);
}
//绑定GridView组件内容
List<Object[]> itemValues = new ArrayList<Object[]>();
itemValues.add(allOptionsMenuTexts);
itemValues.add(itemImages);
//定义适配器to参数
int[] to = {R.id.main_grid_view_item_item_text,R.id.main_grid_view_item_item_image};
int resource = R.layout.main_grid_view_item;
//生成适配器:使用自定义工具类 SimpleAdapterUtil.java来生成适配器
SimpleAdapter simpleAdapter = SimpleAdapterUtil.create(context,itemValues,resource,to);
GridView gridView = (GridView)findViewById(R.id.main_grid_view_gridview);
gridView.setColumnWidth(50);//列宽
gridView.setNumColumns(3);//列数=3
gridView.setHorizontalSpacing(50);//列间距=50
gridView.setVerticalSpacing(60);//行间距=60
gridView.setGravity(Gravity.CENTER);//展示位置:可以参考Gravity.*中的定义
gridView.setStretchMode(GridView.NO_STRETCH);//设置 grid中的条目以什么缩放模式去填充空间:可以参考GridView.*中的定义
gridView.setAdapter(simpleAdapter);
//监听item点击事件
gridView.setOnItemClickListener(new OnItemClickListener(){
@Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
Toast.makeText(context, "["+allOptionsMenuTexts[position]+"]被点击了", Toast.LENGTH_SHORT).show();
}
});
}
备注:SimpleAdapterUtil工具类的完整代码,可以看这篇文章《1个简单的SimpleAdapter工具类-SimpleAdapterUtil 》。