步步为营_Android开发课[22]_用户界面之GridView(网格视图)

原创 2015年04月12日 12:31:09

Focus on technology, enjoy life!—— QQ:804212028
浏览链接:http://blog.csdn.net/y18334702058/article/details/44624305


  • 主题:用户界面之GridView(网格视图)
    -九宫格布局就是用它来实现的。

GridView实现九宫格(实例):
activity_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/gridview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:columnWidth="90dp"
        android:gravity="center"
        android:padding="30dp"
        android:numColumns="3"
        android:stretchMode="columnWidth"
        android:verticalSpacing="10dp"
        android:horizontalSpacing="10dp"
        />

</LinearLayout>

给gridview中的item自定义布局:
gridview_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" >

    <ImageView 
        android:id="@+id/image"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_centerHorizontal="true"/>
    <TextView 
        android:id="@+id/str"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_centerHorizontal="true"/>
</LinearLayout>

MainActivity.java:

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 MainActivity extends Activity{

    private int[] image = {R.drawable.myimage,R.drawable.myimage,R.drawable.myimage,R.drawable.myimage
            ,R.drawable.myimage,R.drawable.myimage,R.drawable.myimage,R.drawable.myimage};
    private String[] str = {"宫式布局1", "宫式布局2", "宫式布局3", "宫式布局4", "宫式布局5",
            "宫式布局6", "宫式布局7", "宫式布局8" };
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

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

        ArrayList<HashMap<String,Object>> item = new ArrayList<HashMap<String,Object>>();
        for(int i=0; i<image.length; i++){
            HashMap<String,Object> map = new HashMap<String,Object>();
            map.put("image", image[i]);
            map.put("str", str[i]);
            item.add(map);
        }

        SimpleAdapter simpleAdapter = new SimpleAdapter(this, item, R.layout.gridview_item, new String[] { "image", "str" }, new int[] {
                R.id.image, R.id.str });
        gridView.setAdapter(simpleAdapter);
        gridView.setOnItemClickListener(new ItemClickListener());

    }      

    class ItemClickListener implements OnItemClickListener{

        @Override
        public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
                long arg3) {
            // TODO Auto-generated method stub
            //这里写监听事件
        }

    }
}

运行结果:

这里写图片描述

Focus on technology, enjoy life!—— QQ:804212028
浏览链接:http://blog.csdn.net/y18334702058/article/details/44624305

步步为营_Android开发课[36]_用户界面之屏幕适配

Focus on technology, enjoy life!—— QQ:804212028 浏览链接:http://blog.csdn.net/y18334702058/article/det...
  • y18334702058
  • y18334702058
  • 2015年05月16日 20:56
  • 474

步步为营_Android开发课[34]_用户界面之Fragment

Focus on technology, enjoy life!—— QQ:804212028 浏览链接:http://blog.csdn.net/y18334702058/article/det...
  • y18334702058
  • y18334702058
  • 2015年04月15日 20:52
  • 618

高级控件之网格视图(GridView)

GridView网格视图是按照行,列分布的方式来显示多个组件,通常用于显示图片或是图标等,在使 用网格视图时,首先需要要在屏幕上添加GridView组件。...
  • wenzhi20102321
  • wenzhi20102321
  • 2016年12月06日 19:48
  • 744

网格视图(GridView)的功能与用法

GridView用于在界面上按行、列分布的方式显示多个组件。GridView和ListView有共同的父类:AbsListView,因此GridView和ListView具有很高的相似性,它们都是列表...
  • u011026329
  • u011026329
  • 2015年12月01日 14:25
  • 1035

步步为营_Android开发课[19]_用户界面之ListView(列表视图)

Focus on technology, enjoy life!—— QQ:804212028 浏览链接:http://blog.csdn.net/y18334702058/article/det...
  • y18334702058
  • y18334702058
  • 2015年04月08日 22:30
  • 521

步步为营_Android开发课[37]_用户界面之theme和style

Focus on technology, enjoy life!—— QQ:804212028 浏览链接:http://blog.csdn.net/y18334702058/article/det...
  • y18334702058
  • y18334702058
  • 2015年05月19日 21:56
  • 484

步步为营_Android开发课[32]_用户界面之Toast(吐司)

Focus on technology, enjoy life!—— QQ:804212028 浏览链接:http://blog.csdn.net/y18334702058/article/det...
  • y18334702058
  • y18334702058
  • 2015年04月15日 10:30
  • 581

步步为营_Android开发课[13]_用户界面之view(视图)

Focus on technology, enjoy life!—— QQ:804212028 浏览链接:http://blog.csdn.net/y18334702058/article/det...
  • y18334702058
  • y18334702058
  • 2015年04月07日 11:15
  • 733

步步为营_Android开发课[26]_用户界面之PopupWindow(弹出窗口)

Focus on technology, enjoy life!—— QQ:804212028 浏览链接:http://blog.csdn.net/y18334702058/article/det...
  • y18334702058
  • y18334702058
  • 2015年04月14日 10:56
  • 648

步步为营_Android开发课[16]_用户界面之EditText(编辑视图)

Focus on technology, enjoy life!—— QQ:804212028 浏览链接:http://blog.csdn.net/y18334702058/article/det...
  • y18334702058
  • y18334702058
  • 2015年04月07日 16:46
  • 590
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:步步为营_Android开发课[22]_用户界面之GridView(网格视图)
举报原因:
原因补充:

(最多只允许输入30个字)