标签:
细想自己接触android也有一个月了,一直想写blog来敦促自己的进步,供自己之后翻阅,同时想着自己在编写例子的时候会出现各种问题,所以创建blog来记录自己的学习进程,也可以作分享之用。好了,废话不多说了,这篇blog主要是讲解的如何创建gridview的视图。如下图效果所示:
要实现图中的功能,
先介绍gridview几个属性:
第一步:将案例所需的四个图片(注意名字一定要是英文)copy到res/drawable文件夹下。
第二步:在main_activity中添加一个gridview,其中布局代码如下
<span style="font-size:18px;"><?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:orientation="vertical" android:background="#000" tools:context="com.example.amos.gridviewdemo.MainActivity"> <GridView android:id="@+id/gview" android:layout_width="match_parent" android:layout_height="wrap_content" android:numColumns="auto_fit"<span style="white-space:pre"> </span>//列数设置为自动 android:columnWidth="80dp" android:stretchMode="columnWidth"><span style="white-space:pre"> </span>//将拉伸模式调整跟宽度一样 </GridView> </LinearLayout></span>第三步:因为所做效果图中每个item项中都有一个imageiew和textview的控件,所以我们要单独创建一个item的布局以便传入gridview中。
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical"<span style="white-space:pre"> </span>//这一项的作用是让imageview控件和textview控件在竖直方向对齐 android:gravity="center" android:padding="10dp">
<ImageView android:src="#9932CC" android:id="@+id/image" 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>第四步:接着就是最关键的在MainActivity中填写代码。主要分为a.准备数据源 b.新建适配器 c.配置适配器
</pre><pre name="code" class="java">import android.app.Activity; import android.content.Intent; import android.os.Bundle; import android.view.View; import android.widget.AdapterView; import android.widget.GridView; import android.widget.SimpleAdapter; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; public class MainActivity extends Activity { private GridView gview; private List<Map<String, Object>> data_list; private SimpleAdapter sim_adapter; private int[] icon = {R.drawable.sns_qqfriends_icon, R.drawable.sns_sina_icon, R.drawable.sns_weixin_icon, R.drawable.sns_weixin_timeline_icon}; private String[] iconName = {"QQ", "Sina", "Weixin", "SNS"}; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); gview = (GridView) findViewById(R.id.gview); //新建List data_list = new ArrayList<Map<String, Object>>(); //获取数据 getData(); //新建适配器 String[] from = {"image", "text"}; int[] to = {R.id.image, R.id.text}; sim_adapter = new SimpleAdapter(this, data_list, R.layout.item, from, to); //配置适配器 gview.setAdapter(sim_adapter); } public List<Map<String, Object>> getData() { //icon和iconName的长度是相同的,这里任选其一就可以 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]); data_list.add(map); } return data_list; } }
关于setadapter的用法,可以参见官方的API文档,里面的解释是这样的。
public void setAdapter (ListAdapter adapter)
Sets the data behind this GridView.
Parameters
adapter the adapter providing the grid‘s data
好了,结束,这样就可以直接运行了。
最后,拓展一下,比如现在我有这个图标了,那我怎么样去点击图标,然后让他有效果呢,这种情况下,我们可以插入一个
setOnItemClickListener()的方法。那么现在我们在java代码文件夹下创建两个activity,如下图(这是我随意创建的,目的只是让他有东西能显示)
那么接着在Main_Activity中添加setOnItemClickListener方法,这里我只添加了两个点击事件,如下示:
gview.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { //在这里处理每一个item的单击事件 switch (position){ case 0: startActivity(new Intent(MainActivity.this,AnotherAty.class)); break; case 1: startActivity(new Intent(MainActivity.this,LoginActivity.class)); break; default: break; } } });
最后,附上我的源码
标签:
原文地址:http://blog.csdn.net/qq_28579405/article/details/51367435