Android GridView九宫图

最新推荐文章于 2024-08-05 22:47:40 发布

weixin_34178244

最新推荐文章于 2024-08-05 22:47:40 发布

阅读量67

点赞数

文章标签：移动开发 java

原文链接：https://my.oschina.net/amigos/blog/62263

版权

为什么80%的码农都做不了架构师？>>>

属性名称	描述
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	两行之间的间距。

案例一：

1.定义一个布局文件：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/gridview_main"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:numColumns="auto_fit"
        android:verticalSpacing="1dp"
        android:horizontalSpacing="1dp"
        android:columnWidth="90dp"
        android:stretchMode="columnWidth"
        android:gravity="center"
        >
    </GridView>
</LinearLayout>

android:numColumns="auto_fit"--列数设置为自动；

android:columnWidth="90dp"--每列的列宽，也就是item的宽度

android:verticalSpacing="1dp"--两行之间的边距

android:horizontalSpacing="1dp"--两列之间的边距

android:stretchMode="columnWidth"--缩放与列宽大小同步

2。接下来定义gridview_item.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"
    android:orientation="vertical"
    >
    <ImageView
        android:id="@+id/gridview_imageview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
     >
    </ImageView>
    <TextView 
        android:id="@+id/gridview_textview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="TextView01"
        android:gravity="center"
      />
</LinearLayout>

3.最后定义Java的源代码了，GridViewDemo.java

package com.test;
import java.util.ArrayList;
import java.util.HashMap;
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;
public class GridViewDemo extends Activity {
	int [] image={R.drawable.android,R.drawable.blackberry,R.drawable.windowshone,R.drawable.windowshone,R.drawable.blackberry,R.drawable.android,R.drawable.windowshone,R.drawable.ios,R.drawable.blackberry};
	private GridView gridView;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		
		setContentView(R.layout.gridview_main);
		
		gridView = (GridView)findViewById(R.id.gridview_main);
		//生成动态数组，并且转入数据 
		ArrayList<HashMap<String, Object>>  list=new ArrayList<HashMap<String,Object>>();
		
		for(int i=0;i<9;i++)
		{
			HashMap<String, Object>  map = new HashMap<String, Object>();
			
			   map.put("ItemImage", image[i]);//添加图像资源的ID  
			   map.put("itemtext","Amigos_pop-"+String.valueOf(i));
			   list.add(map);
		}
		 //生成适配器的ImageItem <====> 动态数组的元素，两者一一对应  
		SimpleAdapter   adapter=new SimpleAdapter(this, //数据来源 
				list,R.layout.gridview_item,//XML实现  
				new String[]{"ItemImage","itemtext"}, //动态数组与ImageItem对应的子项          
				new int[]{R.id.gridview_imageview,R.id.gridview_textview}//  //ImageItem的XML文件里面的一个ImageView,两个TextView ID  
		       );
		 //添加并且显示  
		gridView.setAdapter(adapter);
		//添加消息处理
		gridView.setOnItemClickListener(clickListener);
	}
	  //当AdapterView被单击(触摸屏或者键盘)，则返回的Item单击事件  
	private  OnItemClickListener  clickListener=new OnItemClickListener() {

		@Override
		public void onItemClick(AdapterView<?> arg0,//The AdapterView where the click happened   
                View arg1,//The view within the AdapterView that was clicked  
                int arg2,//The position of the view in the adapter  
                long arg3//The row id of the item that was clicked  
				) 
		{
			
			HashMap<String, Object>  item=(HashMap<String, Object>)arg0.getItemAtPosition(arg2);
			
			setTitle((String)item.get("itemtext"));
		}
	};
}

4：执行效果：

===============================================================================

案例二：同样的效果：

布局文件使用上面一样的：

定义一个ImageAdapter类，此类继承BaseAdapter如下：

package com.test;

import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;

public class GridViewAdapter extends BaseAdapter {

	//定义Context
	private Context  mContext;
	
	//定义整形数组 （图片资源）
	private  int []  mimages=
	{
	 R.drawable.android,R.drawable.blackberry,R.drawable.windowshone,
	 R.drawable.windowshone,R.drawable.blackberry,R.drawable.android,
	 R.drawable.windowshone,R.drawable.ios,R.drawable.blackberry
	
	};
	
	public GridViewAdapter(Context  c) 
	{
		mContext=c;
	}
	
	//获取图片的个数
	@Override
	public int getCount() {
		// TODO Auto-generated method stub
		return mimages.length;
	}
   // 获取图片在库中的位置
	@Override
	public Object getItem(int position) {
		// TODO Auto-generated method stub
		return position;
	}
  
	//获取图片ID
	@Override
	public long getItemId(int position) {
		// TODO Auto-generated method stub
		return position;
	}

	@Override
	public View getView(int position, View convertView, ViewGroup parent) 
	{
       ImageView mimageView;
       if(convertView==null)
       {
    	   //给Imageview设置资源
    	   mimageView = new ImageView(mContext);
    	   //设置布局图片120*120显示
  	 
    	   mimageView.setLayoutParams(new GridView.LayoutParams(85, 85));
    	   
    	   mimageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
    	   
    	   mimageView.setPadding(8, 8, 8, 8);
       }else
       {
    	   mimageView=(ImageView) convertView; 
       }
       mimageView.setImageResource(mimages[position]);
	   return mimageView;
	}
}

package com.test;
import java.util.ArrayList;
import java.util.HashMap;
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 GridViewDemo_2 extends Activity {
	private GridView  gridView;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.gridview_main);
		
		gridView = (GridView)findViewById(R.id.gridview_main);
		
		gridView.setAdapter(new GridViewAdapter(this));//调用GridViewAdapter
		
		gridView.setOnItemClickListener(clickListener);
	}
	
	private  OnItemClickListener  clickListener =new OnItemClickListener() {

		@Override
		public void onItemClick(AdapterView<?> arg0, View arg1, int position,
				long id) {
			Toast.makeText(GridViewDemo_2.this, ""+position,Toast.LENGTH_SHORT).show();//显示信息; 
			
		}
	};
}

效果：