可能大家会遇到一个应用图标过多不好排版也不好处理的问题吧?小马学习了下一个应用图标过多时的一个简单的处理方式,就是用安卓提供的SlidingDrawer来完成漂亮的排版与功能实现,废话不多说,先上效果图再看具体代码实现:

一: 小抽屉未展开时:

二:小抽屉展开时:

 

三:小抽屉中功能图标过多时(这个好神奇,竟然能自己扩充,激动呀)

 


四:如果要实现抽屉中不同图标的不同功能时,更简单,直接给GridView的项加事件实现就可以啦,吼吼

下面我们来看下代码实现:

 


  1. package com.xiaoma.www; 
  2.  
  3. import android.app.Activity; 
  4. import android.os.Bundle; 
  5. import android.view.View; 
  6. import android.widget.AdapterView; 
  7. import android.widget.AdapterView.OnItemClickListener; 
  8. import android.widget.GridView; 
  9. import android.widget.ImageView; 
  10. import android.widget.SlidingDrawer; 
  11. import android.widget.Toast; 
  12. import android.widget.SlidingDrawer.OnDrawerCloseListener; 
  13. import android.widget.SlidingDrawer.OnDrawerOpenListener; 
  14.  
  15. /**   
  16. * @Title: SlidingDrawerDemoActivity.java 
  17. * @Package com.xiaoma.www 
  18. * @Description: 抽屉式控件SlidingDrawer的显示与隐藏 
  19. * @author MZH 
  20. */ 
  21. public class SlidingDrawerDemoActivityActivity extends Activity { 
  22.      
  23.         //声明 
  24.         private SlidingDrawer sDrawer ; 
  25.         private GridView gvGridView ; 
  26.         //点击小抽屉的小标志哦,不然没得点呐 
  27.         private ImageView myImage1; 
  28.          
  29.          
  30.          
  31.         /** 
  32.          * 下面这个两个资源,小马提示下,就是在定义的时候必须一一对应,比如:10:10 
  33.          * 如果少了任何一项的话,会报数组越界异常的,所以稍微注意下 
  34.          * 另外,小马的DEMO本来GridView中内容很少的,但是手闲的,试了下内容撑不下 
  35.          * 一个屏幕时怎么办,没想安卓那么强大,呵,自己扩充,效果图我已经贴上面咯 
  36.          */ 
  37.          
  38.         //声明所有图标资源 
  39.         private int icons[] = { 
  40.                 R.drawable.angry_birds,R.drawable.browser,R.drawable.dropbox, 
  41.                 R.drawable.googleearth,R.drawable.lastfm,R.drawable.xiaoma, 
  42.                 R.drawable.xbmc,R.drawable.youtube,R.drawable.notes, 
  43.                 R.drawable.messages_dock,R.drawable.contacts, 
  44.                 R.drawable.facebook,R.drawable.wapedia 
  45.         }; 
  46.         //声明所有图标资源title 
  47.         private String items[] = { 
  48.                 "愤怒的小鸟","浏览器","dropbox","谷歌地球","AS","小马果的驴子","嘛东西"
  49.                 "YouTuBe","记事本","消息提示","通讯薄","面谱","WAP" 
  50.         }; 
  51.          
  52.      
  53.     /** Called when the activity is first created. */ 
  54.     @Override 
  55.     public void onCreate(Bundle savedInstanceState) { 
  56.         super.onCreate(savedInstanceState); 
  57.         setContentView(R.layout.main); 
  58.         init(); 
  59.     } 
  60.      
  61.     /** 
  62.      * 初始化方法实现 
  63.      */ 
  64.     private void init() { 
  65.         //我的抽屉 
  66.         sDrawer = (SlidingDrawer)findViewById(R.id.mySliding); 
  67.         //点击抽屉时的小图标 
  68.         myImage1 = (ImageView)findViewById(R.id.myImage1); 
  69.         //抽屉中要显示的内容  
  70.         gvGridView = (GridView)findViewById(R.id.gridView); 
  71.          
  72.         //初始化自定义的网格布局适配器并设置到网络布局上 
  73.         GridViewAdapter adapter = new GridViewAdapter(getApplicationContext(), items, icons); 
  74.         gvGridView.setAdapter(adapter); 
  75.         gvGridView.setOnItemClickListener(new OnItemClickListener() { 
  76.  
  77.             @Override 
  78.             public void onItemClick(AdapterView<?> parent, View view, 
  79.                     int position, long id) { 
  80.                 /** 
  81.                  * 此处可以实现单击不同图标时的不同功能哦,小马就不多讲废话,简单提示下 
  82.                  */ 
  83.                 Toast.makeText(getApplicationContext(),  
  84.                         "单击了第"+position+"项", Toast.LENGTH_SHORT).show(); 
  85.             } 
  86.         }); 
  87.          
  88.         /** 
  89.          * 下面给我的抽屉添加两个事件监听器,大家也可以只加载一个,因为考虑到用户体验 
  90.          * 在点击抽屉的小标志打开抽屉时我设置一个打开的图标,关闭时设置关闭图标,这样 
  91.          * 比较好玩,吼吼,下面两个监听大家随意 
  92.          */ 
  93.         //打开抽屉监听 
  94.         sDrawer.setOnDrawerOpenListener(new OnDrawerOpenListener() { 
  95.              
  96.             @Override 
  97.             public void onDrawerOpened() { 
  98.                 myImage1.setImageResource(R.drawable.close); 
  99.             } 
  100.         }); 
  101.          
  102.         //关闭抽屉监听 
  103.         sDrawer.setOnDrawerCloseListener(new OnDrawerCloseListener() { 
  104.              
  105.             @Override 
  106.             public void onDrawerClosed() { 
  107.                 myImage1.setImageResource(R.drawable.open); 
  108.             } 
  109.         }); 
  110.     } 

怎么样?简单吧?吼吼,再来看下我们的抽屉主布局,里面有比较重要的两点,大家仔细看下注释:

 


  1. <?xml version="1.0" encoding="utf-8"?> 
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
  3.     android:layout_width="fill_parent" 
  4.     android:layout_height="fill_parent" 
  5.     android:background="@drawable/background" 
  6.     android:orientation="vertical" > 
  7.     <!-- android:handle指定我们点击抽屉时的小图标,这个必须指定,否则没办法点,
  8. 主要是去哪点出来 ?  所以这个属性必须加
  9.          android:content指定我们的抽屉里面加载的布局 
  10.     --> 
  11.     <SlidingDrawer  
  12.         android:id="@+id/mySliding" 
  13.         android:layout_width="fill_parent" 
  14.         android:layout_height="fill_parent" 
  15.         android:handle="@+id/layout1"   
  16.         android:content="@+id/gridView" 
  17.         android:orientation="horizontal" 
  18.         > 
  19.         <LinearLayout  
  20.             android:id="@+id/layout1" 
  21.             android:layout_width="35px" 
  22.             android:layout_height="fill_parent" 
  23.             android:gravity="center_vertical" 
  24.             > 
  25.             <ImageView  
  26.                 android:id="@+id/myImage1" 
  27.                 android:layout_width="wrap_content" 
  28.                 android:layout_height="wrap_content" 
  29.                 android:src="@drawable/open" 
  30.                 /> 
  31.         </LinearLayout> 
  32.         <GridView  
  33.             android:id="@+id/gridView" 
  34.             android:layout_width="wrap_content" 
  35.             android:layout_height="wrap_content" 
  36.             android:numColumns="3" 
  37.             android:gravity="center" 
  38.             /> 
  39.     </SlidingDrawer> 
  40. </RelativeLayout> 

 下面再来看下我们对网格布局填充的自定义布局,很简单的,对吧,嘿嘿

 


  1. <?xml version="1.0" encoding="utf-8"?> 
  2. <LinearLayout 
  3.   xmlns:android="http://schemas.android.com/apk/res/android" 
  4.   android:orientation="vertical" 
  5.   android:layout_width="fill_parent" 
  6.   android:layout_height="fill_parent" 
  7. > 
  8.   <ImageView  
  9.     android:id="@+id/icon" 
  10.     android:layout_width="wrap_content" 
  11.     android:layout_height="wrap_content" 
  12.     android:layout_gravity="center" 
  13.   /> 
  14.   <TextView  
  15.     android:id="@+id/text" 
  16.     android:layout_width="fill_parent" 
  17.     android:layout_height="20sp" 
  18.     android:gravity="center" 
  19.     android:textColor="@drawable/black" 
  20.   /> 
  21. </LinearLayout> 

   最后,老样子,如果小马代码写得太乱,希望看文章的你我多指正,有错必改的,吼吼,谢谢,希望多提意见给小马,这才是对小马最大的帮助,小DEMO源码小马放附件里面了,有用到的朋友可下载改改后,实现自己想要的完美功能吧,加油加油,谢谢