Android成长日记-使用GridView显示多行数据

本节将实现以下效果

clip_image002

Ps:看起来很不错的样子吧,而且很像九宫格/se

-----------------------------------------------------------------------

下面进入正题[s1]

Step 1:新建Layout,里面创建GridView

<GridView

android:id="@+id/gridView"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginTop="10dp"

android:numColumns="3"

android:horizontalSpacing="10dp"

android:verticalSpacing="10dp" >

</GridView>[s2]

Step 2:创建Java代码

实现这一效果使用的是ListView

所以在需要涉及ListView的有关知识

ListView需要数据源,适配器,监听器

① 考虑到GridView中含有图片,文字,所以事先加入图片,文字

private int[] icon={R.drawable.address_book, R.drawable.calendar,R.drawable.camera, R.drawable.clock, R.drawable.games_control,R.drawable.messenger, R.drawable.ringtone, R.drawable.settings, R.drawable.speech_balloon, R.drawable.weather,

R.drawable.world, R.drawable.youtube};

private String[] iconName={"联系人", "日历", "照相机", "时钟", "游戏", "短信", "铃声", "设置","语音", "天气", "浏览器", "Youtube"};

② 新建适配器

---由于含有图片,文字,所以使用的是SimpleAdapter适配器

Ps:SimpleAdapter的参数讲解

SimpleAdapter(Context context, List<? extends Map<String, ?>> data, int resource, String[] from, int[] to)

* SimpleAdapter()

* ---->>context:上下文

* ---->data:数据源 List<? extends Map<String, ?>> data,一个Map所组成的List集合

* 每一个Map都会对应ListView列表中的一行

* 每一个Map(键~值对)中的键必须包含所有在from中所指定的键

* ---->resource:列表项布局文件的ID

* ---->from:Map中的键名

* ---->to:绑定数据视图中的ID,与from成对应关系

adapter=new SimpleAdapter(this, getData(), R.layout.view_grid[s3] , new String[]{"image","text"}, new int[]{R.id.image,R.id.text});//新建适配器

gridView.setAdapter(adapter);

ps:R.layout.view_grid的样式代码

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical"

android:gravity="center"

android:background="#000000">

<ImageView

android:id="@+id/image"

android:src="@drawable/ic_launcher"

android:layout_width="60dp"

android:layout_height="60dp"/>

<TextView

android:id="@+id/text"

android:layout_marginTop="5dp"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textColor="#ffffff"

android:text="文字"/>

</LinearLayout>

③ 添加数据源

private List<Map<String,Object>>dataList;//声明

dataList=new ArrayList<Map<String,Object>>();

private List<Map<String,Object>> getData() {

for(int i=0;i<icon.length;i++){

Map<String,Object>map=new HashMap<String,Object>();

map.put("image", icon[i]);

map.put("text", iconName[i]);

dataList.add(map);

}

return dataList;

}

④ 创建监听器

实现接口

public class View extends Activity implements OnItemClickListener

gridView.setOnItemClickListener(this);

⑤ 实现监听事件

public void onItemClick(AdapterView<?> arg0, android.view.View arg1,

int position, long id) {

Toast.makeText(this, "我是"+iconName[position],Toast.LENGTH_SHORT).show(); }


[s1] /*

* 1.准备数据源

* 2.新建适配<SimpleAdapter>

* 3.GridView加载适配器

* 4.GridView配置事件监听器(onItemClickListener)

*/

[s2] android:numColumns="" 每一行显示多少列android:horizontalSpacing="" 两列之间的间距

android:verticalSpacing="" 两行之间的间距

[s3]这是新建的Layout

(也就是显示的文字和图片的样式)

原文地址:https://www.cnblogs.com/boy1025/p/4301996.html