android学习——GridView实现主界面布局

     GridView（网格视图），用于在界面上按行、列分布的方式显示多个组件。GridView和ListView有相同的父类，因此他们具有相似的特性。他们的主要区别在于：ListView是在一个方向上分布；而GridView 是在两个方向上分布。 

     GridView提供的常用XML属性如下：

XML属性	说明
android:columnWidth	设置列的宽度
android:gravity	设置对其方式
android:horizontalSpacing	设置各元素键的水平间距
android:numColumns	设置列数
android:stretchMode	设置拉伸模式
android:verticalSpacing	设置各元素之间的垂直间距

  实现GridView布局主要分三个步骤：

1、在mian_interface.xml使用GridView布局。

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"  >         < GridView          android:id =  "@+id/gridview"          android:layout_width =  "fill_parent"          android:layout_height =  "fill_parent"          android:columnWidth =  "90dp"          android:gravity =  "center"          android:horizontalSpacing =  "6dp"          android:numColumns =  "2"          android:stretchMode =  "columnWidth"          android:verticalSpacing =  "30dp"  >      GridView  >     LinearLayout >

2、在grid_items.xml中实现主界面的UI

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:layout_height =  "wrap_content"          android:id =  "@+id/itemImage"          android:layout_width =  "wrap_content"          android:src =  "@drawable/gerenxinxiguanli"          android:layout_gravity =  "center"          android:contentDescription =  "@string/gerenxinxiguanli" >      ImageView  >               < TextView          android:text =  "@string/gerenxinxiguanli"          android:id =  "@+id/itemText"          android:layout_width =  "wrap_content"          android:layout_height =  "wrap_content"          android:layout_gravity =  "center" >      TextView  > LinearLayout >

3、接下来就是实现java代码了。

public  class  MainInterfaceActivity  extends  Activity {         //将图片放入数组中       int []  mainInterfaceImageIDs = {                 R.drawable.  gerenxinxiguanli ,                 R.drawable.  xuankeguize ,                 R.drawable.  yixuankecheng ,                 R.drawable.  chengjichaxun ,                 R.drawable.  kechengchaxun ,                 R.drawable.  xuanke      };       //将图片对应的文字内容存入一个数组      String[]  mainInterfaceStr  = {              "个人信息管理"  ,              "选课规则" ,              "已选课程" ,              "成绩查询" ,              "课程查询" ,              "选课"      };             @Override       protected  void  onCreate(Bundle savedInstanceState) {                          super .onCreate(savedInstanceState);            setContentView(R.layout.  mian_interface );            GridView gridView = (GridView) findViewById(R.id. gridview );                          //生成动态数组，传入数据            ArrayList> lstItems =  new  ArrayList>();              for (  int  i = 0;i <  mainInterfaceImageIDs .  length ;i++){                 HashMap map =  new  HashMap();                 map.put(  "itemsImage" ,  mainInterfaceImageIDs [i]);                 map.put(  "itemsText" ,  mainInterfaceStr [i]);                 lstItems.add(map);            }                        SimpleAdapter imageItems =  new  SimpleAdapter(  this , lstItems, R.layout. grid_items  ,                        new  String[]{   "itemsImage" ,  "itemsText" },  new  int []{R.id.  itemImage ,R.id.  itemText });            gridView.setAdapter(imageItems);                         //当点击图片时进入相应的操作，暂时只实现了其中的两个其他的都相似。            gridView.setOnItemClickListener(  new  OnItemClickListener() {                   public  void  onItemClick(AdapterView arg, View v,  int  position,  long  id){                      Intent intent =  new  Intent();                        switch (position){                        case  0:                           intent.setClassName(  "com.example.mobileelectivesystem" ,                                        "com.example.mobileelectivesystem.GeRenXinXiGuanLiActivity"  );                            startActivity(intent);                              break ;                        case  1:                           intent.setClassName(  "com.example.mobileelectivesystem" ,                                        "com.example.mobileelectivesystem.XuanKeGuiZeActivity"  );                            startActivity(intent);                                                        break ;                      }                      Toast. makeText(getBaseContext(),  "pic"  + (position + 1) +  " selected"  ,                                 Toast.  LENGTH_SHORT ).show();                 }            });      } }

 

效果图：