Android中GridView上图下字.docx

Android中GridView上图下字.docx

《Android中GridView上图下字.docx》由会员分享，可在线阅读，更多相关《Android中GridView上图下字.docx（23页珍藏版）》请在冰豆网上搜索。

Android中GridView上图下字

Android中GridView上面图片下面文字的例子

网上的两个小例子：

你说的是这样子么？

如果是这样子的话就看源码吧：

gridview.xml 

Xml代码  

1.

xml version="1.0" encoding="utf-8"?

>  

2.

android="  

3.    android:

id="@+id/gridview"  

4.    android:

layout_width="fill_parent"  

5.    android:

layout_height="fill_parent"  

6.    android:

numColumns="auto_fit"  

7.    android:

verticalSpacing="10dp"  

8.    android:

horizontalSpacing="10dp"  

9.    android:

columnWidth="90dp"  

10.    android:

stretchMode="columnWidth"  

11.    android:

gravity="center"   

12.    />  

item.xml 

Xml代码  

1.

xml version="1.0" encoding="utf-8"?

>  

2.

android="  

3.    android:

layout_height="wrap_content"  

4.    android:

layout_width="fill_parent"  

5.    android:

paddingBottom="4dip"  

6.    >  

7.    

8.        android:

id="@+id/ItemImage"  

9.        android:

layout_height="wrap_content"  

10.        android:

layout_width="wrap_content"  

11.        android:

layout_centerHorizontal="true"  

12.        />  

13.    

14.        android:

id="@+id/ItemText"  

15.        android:

layout_width="wrap_content"  

16.        android:

layout_below="@+id/ItemImage"  

17.        android:

layout_height="wrap_content"  

18.        android:

layout_centerHorizontal="true"  

19.        android:

text="TextView01"  

20.        />  

21.  

activity 

Java代码  

1.package com.test;  

2.  

3.import java.util.ArrayList;  

4.import java.util.HashMap;  

5.  

6.import android.app.Activity;  

7.import android.os.Bundle;  

8.import android.view.View;  

9.import android.widget.AdapterView;  

10.import android.widget.AdapterView.OnItemClickListener;  

11.import android.widget.GridView;  

12.import android.widget.SimpleAdapter;  

13.  

14.public class TestGridView extends Activity {  

15.    private GridView gridview;  

16.  

17.    public void onCreate（Bundle savedInstanceState） {  

18.        super.onCreate（savedInstanceState）;  

19.        setContentView（R.layout.gridview）;  

20.          

21.        gridview = （GridView） findViewById（R.id.gridview）;  

22.  

23.        // 生成动态数组，并且转入数据  

24.        ArrayList> lstImageItem = new ArrayList>（）;  

25.        for （int i = 0; i < 10; i++） {  

26.            HashMap map = new HashMap（）;  

27.            map.put（"ItemImage", R.drawable.icon）;// 添加图像资源的ID  

28.            map.put（"ItemText", "NO." + String.valueOf（i））;// 按序号做ItemText  

29.            lstImageItem.add（map）;  

30.        }  

31.        // 生成适配器的ImageItem <====> 动态数组的元素，两者一一对应  

32.        SimpleAdapter saImageItems = new SimpleAdapter（this, // 没什么解释  

33.                lstImageItem,// 数据来源  

34.                R.layout.item,// night_item的XML实现  

35.                // 动态数组与ImageItem对应的子项  

36.                new String[] { "ItemImage", "ItemText" },  

37.                // ImageItem的XML文件里面的一个ImageView,两个TextView ID  

38.                new int[] { R.id.ItemImage, R.id.ItemText }）;  

39.        // 添加并且显示  

40.        gridview.setAdapter（saImageItems）;  

41.        // 添加消息处理  

42.        gridview.setOnItemClickListener（new ItemClickListener（））;  

43.    }  

44.  

45.    // 当AdapterView被单击（触摸屏或者键盘），则返回的Item单击事件  

46.    class ItemClickListener implements OnItemClickListener {  

47.        public void onItemClick（AdapterView

> arg0,// The AdapterView where the click happened  

48.                View arg1,// The view within the AdapterView that was clicked  

49.                int arg2,// The position of the view in the adapter  

50.                long arg3// The row id of the item that was clicked  

51.        ） {  

52.            // 在本例中arg2=arg3  

53.            @SuppressWarnings（"unchecked"）  

54.            HashMap item = （HashMap） arg0.getItemAtPosition（arg2）;  

55.            // 显示所选Item的ItemText  

56.            setTitle（（String） item.get（"ItemText"））;  

57.        }  

58.    }  

59.}  

1.

2.    xmlns:

android="

3.    android:

id="@+id/gridview"

4.    android:

layout_width="fill_parent" 

5.    android:

layout_height="fill_parent"

6.    android:

columnWidth="90dp"

7.    android:

numColumns="auto_fit"

8.    android:

verticalSpacing="10dp"

9.    android:

horizontalSpacing="10dp"

10.    android:

stretchMode="columnWidth"

11.    android:

gravity="center">

12.   

13.

复制代码

gridView的子视图,也就是每一个网格的内容页面布局

1.

2.  xmlns:

android="

3.  android:

id="@+id/relaGrid"

4.  android:

orientation="vertical"

5.  android:

layout_width="match_parent"

6.  android:

layout_height="match_parent">

7.        

id="@+id/chooseImage" 

8.            android:

src="@drawable/ph1" 

9.              android:

layout_width="85dp" 

10.              android:

layout_height="85dp" 

11.              >

12.              

13.  

id="@+id/chooseText" 

14.            android:

layout_height="wrap_content" 

15.            android:

layout_width="85dp" 

16.            android:

text="TextView" 

17.            android:

layout_below="@+id/chooseImage" 

18.            android:

gravity="center"

19.            android:

singleLine="true"

20.            android:

ellipsize="marquee"

21.            android:

marqueeRepeatLimit="marquee_forever"

22.            >

23.  

24.

复制代码

然后在res/drawable放入9张图片资源 

Activity页面代码

1.publicclassWidgetActivityextendsActivity{

2.   

3.    OnItemClickListenerocl_gridview=null;

4.     

5.  @Override

6.  publicvoidonCreate（BundlesavedInstanceState）{

7.      super.onCreate（savedInstanceState）;

8.      setContentView（R.layout.main）;

9.      setTitle（"九宫格布局"）;

10.      

11.      GridViewgridview=（GridView）findViewById（R.id.gridview）;

12.      gridview.setAdapter（newImageAdapter（this））;

13.

14.      gridview.setOnItemClickListener（ocl_gridview）;

15.  }

16.   

17.  publicvoidbindListener（）{

18.      ocl_gridview=newOnItemClickListener（）{

19.        publicvoidonItemClick（AdapterView

>parent,Viewv,intposition,longid）{

20.           

21.        }

22.      };

23.  }

24.}

复制代码

继承BaseAdapter的ImageAdapter类代码

1.publicclassImageAdapterextendsBaseAdapter{

2.    privateContextmContext;

3.

4.  publicImageAdapter（Contextc）{

5.      mContext=c;

6.  }

7.    @Override

8.    publicintgetCount（）{

9.        //TODOAuto-generatedmethodstub

10.        returnmThumbIds.length;

11.    }

12.

13.    @Override

14.    publicViewgetView（intposition,ViewconvertView,ViewGrouparg2）{

15.        Viewview=View.inflate（mContext,R.layout.relagrid,null）;

16.        RelativeLayoutrl=（RelativeLayout）view.findViewById（R.id.relaGrid）;

17.      

18.      ImageViewimage=（ImageView）rl.findViewById（R.id.chooseImage）;

19.      TextViewtext=（TextView）rl.findViewById（R.id.chooseText）;      

20.      

21.      image.setImageResource（mThumbIds[position]）;

22.      text.setText（mTextValues[position]）;

23.      

24.      returnrl;

25.    }

26.     

27.    //referencestoourimages

28.  privateInteger[]mThumbIds={

29.        R.drawable.ph1,R.drawable.ph2,R.drawable.ph3,

30.        R.drawable.ph4,R.drawable.ph5,R.drawable.ph6,

31.        R.drawable.ph7,R.drawable.ph8,R.drawable.ph9

32.  };

33.   

34.  privateString[]mTextValues={

35.          "Button","TextView","EditText",

36.          "CheckBox","Radio","Spinner",

37.          "","",""

38.  };

39.}

下面的讲解更具体一点：

有关gridview的使用和属性很不错

GridView（网格视图）是按照行列的方式来显示内容的，一般用于显示图片，图片等内容，比如实现九宫格图，用GridView是首选，也是最简单的。

主要用于设置Adapter。

GridView常用的XML属性：

属性名称

描述

android:

columnWidth

设置列的宽度。

android:

gravity

设置此组件中的内容在组件中的位置。

可选的值有：

top、bottom、left、right、center_vertical、fill_vertical、center_horizontal、fill_horizontal、center、fill、clip_vertical可以多选，用“|”分开。

android:

horizontalSpacing

两列之间的间距。

android:

numColumns

设置列数。

android:

stretchMode

缩放模式。

android:

verticalSpacing

两行之间的间距。

下面有三个例子，第一个是只显示图片的，第二个是显示图片文字的（这里的图片是Android系统自带的图片），第三个是显示自定义的图片文字。

前面两个例子的实现都不是很难，第三个例子的实现有些复杂，学习GridView的时候，就想着能不能自定义自己喜欢的图片加上文字，在网上找些资料，一般都是第二个例子的形式的，最后在视频学习上找到了能实现自定义自己的图片的例子。

自己就照着例子去学习，修改成了第三个例子。

第一个例子：

MainActivity.java

packagecom.android.gridview.activity; 

importandroid.app.Activity; 

importandroid.content.Context; 

importandroid.os.Bundle; 

importandroid.view.View; 

importandroid.view.ViewGroup; 

importandroid.widget.AdapterView; 

importandroid.widget.AdapterView.OnItemClickListener; 

importandroid.widget.BaseAdapter; 

importandroid.widget.GridView; 

importandroid.widget.ImageView; 

importandroid.widget.Toast; 

publicclassMainActivityextendsActivity{ 

   @Override

   publicvoidonCreate（BundlesavedInstanceState）{ 

       super.onCreate（savedInstanceState）; 

       setContentView（R.layout.main）; 

       GridViewgv=（GridView）findViewById（R.id.GridView1）; 

       //为GridView设置适配器 

       gv.setAdapter（newMyAdapter（this））; 

       //注册监听事件 

       gv.setOnItemClickListener（newOnItemClickListener（） 

       { 

           publicvoidonItemClick（AdapterView

>parent,Viewv,intposition,longid）