GridView三个例子

下面有三个例子，第一个是只显示图片的，第二个是显示图片文字的(这里的图片是Android系统自带的图片)，第三个是显示自定义的图片文字。前面两个例子的实现都不是很难，第三个例子的实现有些复杂，学习GridView的时候，就想着能不能自定义自己喜欢的图片加上文字，在网上找些资料，一般都是第二个例子的形式的，最后在视频学习上找到了能实现自定义自己的图片的例子。自己就照着例子去学习，修改成了第三个例子。

第一个例子：

MainActivity.java

package com.android.gridview.activity;

  

import android.app.Activity;

import android.content.Context;

import android.os.Bundle;

import android.view.View;

import android.view.ViewGroup;

import android.widget.AdapterView;

import android.widget.AdapterView.OnItemClickListener;

import android.widget.BaseAdapter;

import android.widget.GridView;

import android.widget.ImageView;

import android.widget.Toast;

  

public class MainActivity extends Activity {

   @Override

   public void onCreate(Bundle savedInstanceState) {

     super .onCreate(savedInstanceState);

     setContentView(R.layout.main);

     GridView gv = (GridView)findViewById(R.id.GridView1);

     //为GridView设置适配器

     gv.setAdapter( new MyAdapter( this ));

     //注册监听事件

     gv.setOnItemClickListener( new OnItemClickListener()

     {

       public void onItemClick(AdapterView<?> parent, View v, int position, long id)

       {

         Toast.makeText(MainActivity. this , "pic" + position, Toast.LENGTH_SHORT).show();

       }

     });

   }

}

   //自定义适配器

   class MyAdapter extends BaseAdapter{

     //上下文对象

     private Context context;

     //图片数组

     private Integer[] imgs = {

         R.drawable.pic0, R.drawable.pic1, R.drawable.pic2, 

         R.drawable.pic3, R.drawable.pic4, R.drawable.pic5,        

         R.drawable.pic6, R.drawable.pic7, R.drawable.pic8, 

         R.drawable.pic0, R.drawable.pic1, R.drawable.pic2, 

         R.drawable.pic3, R.drawable.pic4, R.drawable.pic5,        

         R.drawable.pic6, R.drawable.pic7, R.drawable.pic8,

     };

     MyAdapter(Context context){

       this .context = context;

     }

     public int getCount() {

       return imgs.length;

     }

  

     public Object getItem( int item) {

       return item;

     }

  

     public long getItemId( int id) {

       return id;

     }

      

     //创建View方法

     public View getView( int position, View convertView, ViewGroup parent) {

        ImageView imageView;

         if (convertView == null ) {

           imageView = new ImageView(context);

           imageView.setLayoutParams( new GridView.LayoutParams( 75 , 75 )); //设置ImageView对象布局

           imageView.setAdjustViewBounds( false ); //设置边界对齐

           imageView.setScaleType(ImageView.ScaleType.CENTER_CROP); //设置刻度的类型

           imageView.setPadding( 8 , 8 , 8 , 8 ); //设置间距

         } 

         else {

           imageView = (ImageView) convertView;

         }

         imageView.setImageResource(imgs[position]); //为ImageView设置图片资源

         return imageView;

     }

}

main.xml

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

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

   android:orientation = "vertical"

   android:layout_width = "fill_parent"

   android:layout_height = "fill_parent"

   >

   < GridView 

     android:id = "@+id/GridView1" 

     android:layout_width = "wrap_content" 

     android:layout_height = "wrap_content"

     android:columnWidth = "90dp"

     android:numColumns = "3"

     android:verticalSpacing = "10dp"

     android:horizontalSpacing = "10dp"

     android:stretchMode = "columnWidth"

     android:gravity = "center"    

     />

</ LinearLayout >

效果图：

第二个例子：
MainActivity.java

package com.android.gridview2.activity;

  

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.widget.GridView;

import android.widget.SimpleAdapter;

  

public class MainActivity extends Activity {

  

     private GridView gv;

     @Override

     protected void onCreate(Bundle savedInstanceState) {

      // TODO Auto-generated method stub

      super .onCreate(savedInstanceState);

      setContentView(R.layout.gridview);

  

      //准备要添加的数据条目

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

      for ( int i = 0 ; i < 9 ; i++) {

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

       item.put( "imageItem" , R.drawable.icon); //添加图像资源的ID 

       item.put( "textItem" , "icon" + i); //按序号添加ItemText 

       items.add(item);

      }

  

      //实例化一个适配器

      SimpleAdapter adapter = new SimpleAdapter( this , 

                            items, 

                            R.layout.grid_item, 

                            new String[]{ "imageItem" , "textItem" }, 

                            new int []{R.id.image_item, R.id.text_item});

  

      //获得GridView实例

      gv = (GridView)findViewById(R.id.mygridview);

      //为GridView设置适配器

      gv.setAdapter(adapter);

  

     }

}

gridview.xml

<? 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"

   >

   < GridView 

    android:id = "@+id/mygridview"

    android:numColumns = "3"

    android:gravity = "center_horizontal"

    android:layout_width = "wrap_content"

    android:layout_height = "wrap_content"

    android:stretchMode = "columnWidth"

    />

</ LinearLayout >

grid_item.xml

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

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

   android:id = "@+id/RelativeLayout1"

   android:layout_width = "wrap_content" 

   android:layout_height = "fill_parent"

   android:paddingBottom = "6dip"

   >

   < ImageView 

    android:id = "@+id/image_item"

    android:layout_width = "wrap_content"

    android:layout_height = "wrap_content"

    android:layout_centerHorizontal = "true"

    />

   < TextView 

    android:id = "@+id/text_item"

    android:layout_below = "@+id/image_item"

    android:layout_height = "wrap_content"

    android:layout_width = "wrap_content"

    android:layout_centerHorizontal = "true"  

    />

</ RelativeLayout >

效果图：

第三个例子：
MainActivity.java

package com.android.gridview3;

  

import java.util.ArrayList;

import java.util.List;

import android.app.Activity;

import android.content.Context;

import android.os.Bundle;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.AdapterView;

import android.widget.BaseAdapter;

import android.widget.GridView;

import android.widget.ImageView;

import android.widget.TextView;

import android.widget.Toast;

import android.widget.AdapterView.OnItemClickListener;

  

public class MainActivity extends Activity

{

   private GridView gridView;

   //图片的文字标题

   private String[] titles = new String[]

   { "pic1" , "pic2" , "pic3" , "pic4" , "pic5" , "pic6" , "pic7" , "pic8" , "pic9" };

   //图片ID数组

   private int [] images = new int []{    

       R.drawable.pic1, R.drawable.pic2, R.drawable.pic3, 

       R.drawable.pic4, R.drawable.pic5, R.drawable.pic6, 

       R.drawable.pic7, R.drawable.pic8,R.drawable.pic9 

   };

  

   @Override

   public void onCreate(Bundle savedInstanceState){

     super .onCreate(savedInstanceState);

     setContentView(R.layout.main);

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

     PictureAdapter adapter = new PictureAdapter(titles, images, this );

     gridView.setAdapter(adapter);

  

     gridView.setOnItemClickListener( new OnItemClickListener()

       {

         public void onItemClick(AdapterView<?> parent, View v, int position, long id)

         {

           Toast.makeText(MainActivity. this , "pic" + (position+ 1 ), Toast.LENGTH_SHORT).show();

         }

       });

   }

}

//自定义适配器

class PictureAdapter extends BaseAdapter{

   private LayoutInflater inflater;

   private List<Picture> pictures;

  

   public PictureAdapter(String[] titles, int [] images, Context context)

   {

     super ();

     pictures = new ArrayList<Picture>();

     inflater = LayoutInflater.from(context);

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

     {

       Picture picture = new Picture(titles[i], images[i]);

       pictures.add(picture);

     }

   }

  

   @Override

   public int getCount()

   {

     if ( null != pictures)

     {

       return pictures.size();

     } else

     {

       return 0 ;

     }

   }

  

   @Override

   public Object getItem( int position)

   {

     return pictures.get(position);

   }

  

   @Override

   public long getItemId( int position)

   {

     return position;

   }

  

   @Override

   public View getView( int position, View convertView, ViewGroup parent)

   {

     ViewHolder viewHolder;

     if (convertView == null )

     {

       convertView = inflater.inflate(R.layout.picture_item, null );

       viewHolder = new ViewHolder();

       viewHolder.title = (TextView) convertView.findViewById(R.id.title);

       viewHolder.image = (ImageView) convertView.findViewById(R.id.image);

       convertView.setTag(viewHolder);

     } else

     {

       viewHolder = (ViewHolder) convertView.getTag();

     }

     viewHolder.title.setText(pictures.get(position).getTitle());

     viewHolder.image.setImageResource(pictures.get(position).getImageId());

     return convertView;

   }

  

}

  

class ViewHolder

{

   public TextView title;

   public ImageView image;

}

  

class Picture

{

   private String title;

   private int imageId;

  

   public Picture()

   {

     super ();

   }

  

   public Picture(String title, int imageId)

   {

     super ();

     this .title = title;

     this .imageId = imageId;

   }

  

   public String getTitle()

   {

     return title;

   }

  

   public void setTitle(String title)

   {

     this .title = title;

   }

  

   public int getImageId()

   {

     return imageId;

   }

  

   public void setImageId( int imageId)

   {

     this .imageId = imageId;

   }

}

main.xm

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

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

   android:id = "@+id/gridview"

   android:layout_width = "fill_parent" 

   android:layout_height = "fill_parent"

   android:columnWidth = "90dp"

   android:numColumns = "auto_fit"

   android:verticalSpacing = "10dp"

   android:horizontalSpacing = "10dp"

   android:stretchMode = "columnWidth"

   android:gravity = "center"

   />

picture_item.xml

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

< LinearLayout

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

   android:id = "@+id/root"

   android:orientation = "vertical" 

   android:layout_width = "wrap_content"

   android:layout_height = "wrap_content" 

   android:layout_marginTop = "5dp"

   >

   < ImageView 

     android:id = "@+id/image"

     android:layout_width = "100dp"

     android:layout_height = "150dp" 

     android:layout_gravity = "center"

     android:scaleType = "fitXY"

     android:padding = "4dp"

     />

   < TextView 

     android:id = "@+id/title"

     android:layout_width = "wrap_content"

     android:layout_height = "wrap_content" 

     android:layout_gravity = "center"

     android:gravity = "center_horizontal"

     />

</ LinearLayout >

效果图：