首页 > 技术文章 > android-GridView控件的使用

iamkk 2016-09-29 10:06 原文

GridView 按行列方式显示多个组件(二维布局界面)

  数据源(集合)-适配器(SimpleAdapter)-视图界面(GridView),加载适配器-配置监听器(OnItemClickListener)

效果图:(图片素材云盘)

源代码:

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.GridView;
import android.widget.SimpleAdapter;
import android.widget.Toast;

public class MainActivity extends Activity implements OnItemClickListener{

private GridView gridView;
private List<Map<String,Object>> dataList;
private int[] icon={R.drawable.address_book,R.drawable.calendar,
R.drawable.camera,R.drawable.games_control,R.drawable.clock,
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={"通讯录","日历","照相机","游戏","时钟","短信","铃声"
,"设置","语音","天气","浏览器","视频"};

private SimpleAdapter adapter;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

gridView=(GridView) findViewById(R.id.gridView);

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

adapter=new SimpleAdapter(this, getData(), R.layout.item, new String[]{"image","text"}, new int[]{R.id.image,R.id.text});

gridView.setAdapter(adapter);
gridView.setOnItemClickListener(this);

}

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

for(int i=0;i<icon.length;i++){
Map<String,Object> map=new HashMap<>();
map.put("image", icon[i]);
map.put("text", iconName[i]);
dataList.add(map);
}

return dataList;

}

@Override
public void onItemClick(AdapterView<?> parent, View view, int position,
long id) {
// TODO Auto-generated method stub
Toast.makeText(this, "我是"+iconName[position], Toast.LENGTH_SHORT).show();
}
}

布局文件

main.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" >

<!-- 常用三个属性
numColumns 每一行显示几列
horizontalSpacing 两列之间的间距
verticalSpacing 两行之间的间距
-->
<GridView
android:layout_marginTop="10dp"
android:id="@+id/gridView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"

android:numColumns="3"
android:horizontalSpacing="10dp"
android:verticalSpacing="10dp"

>

</GridView>
</LinearLayout>

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:gravity="center"
android:background="#000000">

<ImageView
android:id="@+id/image"
android:layout_width="180dp"
android:layout_height="180dp"
android:src="@drawable/clock" />

<TextView
android:layout_marginTop="5dp"
android:id="@+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#ffffff"
android:text="文字"/>

</LinearLayout>

推荐阅读