android组件学习:GridView与SimpleAdapter
【实验目的】
进步掌握SimpleAdapter类的功能及其使用方法;
掌握GridView通过SimpleAdapter关联到数据的方法。
【实验原理】
1.GridView
GridView(网格视图)是Android中常用的UI组件之一,它是按照行、列分布的方式来显示多个组件的,通常用于显示图片或图标等。运行的效果如图1所示。
图1
GridView与ListView类似,一般都是通过Adapter来提供显示的数据。
2.GridView通过SimpleAdapter获取数据进行显示的操作步骤
(1)资源建设,也即准备需要的图片;
(2)在主布局文件中添加GridView控件;
(3)建立GridView的item布局文件
(4)程序编码。
在主Activity的java文件中,建立SimpleAdapter对象,并将之与数据、item布局相关联;实现ListView与自定义的Adapter的关联。
【实验步骤】
1.创建新项目
先建立一个空项目,如HelloWorld项目,然后进行以下修改。
2.UI设计
(1)主布局文件
修改主布局文件activity_main.xml,在其中添加GridView组件,并设置其相关属性,具体内容如下。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp"
tools:context="com.example.administrator.mygridview.MainActivity">
<GridView android:id="@+id/gv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:numColumns="2"
android:verticalSpacing="2dp"
android:horizontalSpacing="2dp" />
</LinearLayout>
(2)创建GridView表项布局文件
修改res/layout目录下,新建GridView表项布局文件item.xml,使其内容如下:
<?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"
android:paddingBottom="4dp"
>
<ImageView android:id="@+id/itemImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:maxHeight="220dp"
android:maxWidth="220dp"
android:layout_gravity="center_horizontal"
android:scaleType="fitCenter"
/>
<TextView android:id="@+id/itemText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/itemImage"
android:layout_gravity="center"/>
</LinearLayout>
3.资源建设
因为本应用中要用到一些图片,从网上下载相关图片文件,放到res/drawable文件夹下,在编译时,系统会自动给这些文件每个文件一个ID,ID的格式为:R.drawable.XXX。XXX是对应的文件名。
本例中,这些图片的文件名分别为:p1.jpg、p2.jpg、p3.jpg、p4.jpg。
4.编写代码
修改MainActivity.java代码,如下:
package com.example.administrator.mygridview;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.GridView;
import android.widget.SimpleAdapter;
import android.widget.Toast;
import java.util.ArrayList;
import java.util.HashMap;
public class MainActivity extends AppCompatActivity {
int[] imgIds={R.drawable.p1,R.drawable.p2,
R.drawable.p3,R.drawable.p4,R.drawable.p5,R.drawable.p6,
R.drawable.p7,R.drawable.p8};
String[] names={"费德勒","纳达尔","德约科维奇","穆雷","莎拉波娃","小威","阿扎伦卡","布沙尔"};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
GridView gridView=(GridView)findViewById(R.id.gv);
ArrayList<HashMap<String,Object>> data=new ArrayList<HashMap<String,Object>>();
for(int i=0; i<names.length; i++){
HashMap<String,Object> map=new HashMap<String,Object>();
map.put("image",imgIds[i]);
map.put("text",names[i]);
data.add(map);
}
SimpleAdapter myAdapter=new SimpleAdapter(this,data,R.layout.item,new String[]{"image","text"},new int[]{R.id.itemImage,R.id.itemText});
gridView.setAdapter(myAdapter);
gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View v, int position, long id)
{
Toast.makeText(MainActivity.this, "你选择了" + (position + 1) + " 号图片"+names[position], Toast.LENGTH_SHORT).show();
}
});
}
}
程序说明:
(1)数据数组
int[] imgIds={R.drawable.p1,R.drawable.p2,
R.drawable.p3,R.drawable.p4,R.drawable.p5,R.drawable.p6,
R.drawable.p7,R.drawable.p8};
String[] names={"费德勒","纳达尔","德约科维奇","穆雷","莎拉波娃","小威","阿扎伦卡","布沙尔"};
(2)将数据放入一个List中
ArrayList<HashMap<String,Object>> data=new ArrayList<HashMap<String,Object>>();
for(int i=0; i<names.length; i++){
HashMap<String,Object> map=new HashMap<String,Object>();
map.put("image",imgIds[i]);
map.put("text",names[i]);
data.add(map);
}
(3)建立一个SimpleAdapter对象
SimpleAdapter myAdapter=new SimpleAdapter(this,
data,
R.layout.item,
new String[]{"image","text"},
new int[]{R.id.itemImage,R.id.itemText});
请注意SimpleAdapter的五个参数的含义,特别是最后两个参数之间的对应关系。
(4)获取GridView对象,并将其关联到SimpleAdapter对象。
GridView gridView=(GridView)findViewById(R.id.gv);
gridView.setAdapter(myAdapter);
(5)点击事件监听与处理
gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View v, int position, long id)
{
Toast.makeText(MainActivity.this, "你选择了" + (position + 1) + " 号图片"+names[position], Toast.LENGTH_SHORT).show();
}
});
5.验证效果
运行,便会出现如图1的效果。