android之SlidingDrawer

 */

概述

       为了方便操作、美观、节约空间等多方面原因的考虑，Android提供了SlidingDrawer这样的控件。SlidingDrawer——一个像抽屉一样的控件，我们暂且就称之为抽屉。这种抽屉的效果随处可见，比如Android通知栏的下拉效果，比如某个网页工具箱的弹出框等等。

       我们来看一下SDK中是如何定义的：SlidingDrawer隐藏了再屏幕外的一些内容，并且允许用户用拖拽“手柄”的方式使得内容再次显示于屏幕中。SlidingDrawer可以用于水平和垂直两个方向。一个SlidingDrawer控件由两个子View来组成，一个是“手柄”一个就是拖拽出来的内容。SlidingDrawer应该覆盖在layout上面，这就是说SlidingDrawer应该只被用于一个FrameLayout或者是 RelativeLayout之中。SlidingDrawer的大小定义了它被拖拽出来的内容将占据多大的空间。因此，SlidingDrawer通常使用match_parent来定义其大小。SlidingDrawer还必须定义“手柄”和其内容这两个View的id号。

例如下面的布局文件就是一个简单的SlidingDrawer的描述:

[html]  view plain copy

1. <SlidingDrawer  
2.     android:id="@+id/drawer"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent"  
5.      android:handle="@+id/handle"  
6.     android:content="@+id/content">  
7.      <ImageView  
8.         android:id="@+id/handle"  
9.         android:layout_width="88dip"  
10.         android:layout_height="44dip" />  
11.      <GridView  
12.         android:id="@+id/content"  
13.          android:layout_width="match_parent"  
14.         android:layout_height="match_parent" />  
15.  </SlidingDrawer>  

XML文件中的属性

属性名称	描述
android:allowSingleTap	是否可通过单击handle打开或关闭抽屉。 默认是true。（如果是false，用户必须通过拖动，滑动或者使用轨迹球。）
android:animateOnClick	顾名思义，点击的时候是否有动画。默认是true。
android:bottomOffset	“手柄”距离SlidingDrawer底部的额外距离 。
android:content	SlidingDrawer的内容。
android:handle	SlidingDrawer的“手柄”。
android:orientation	SlidingDrawer的方向。
android:topOffset	“手柄”距离SlidingDrawer顶部的额外距离 。

 

一些重要的方法：

void setOnDrawerCloseListener (SlidingDrawer.OnDrawerCloseListener onDrawerCloseListener)

设置一个监听器，用来接收当抽屉被关闭时候的通知。

void setOnDrawerOpenListener (SlidingDrawer.OnDrawerOpenListener onDrawerOpenListener)

Since: API Level 3

设置一个监听器，用来接收当抽屉被打开的时候的通知。

void setOnDrawerScrollListener (SlidingDrawer.OnDrawerScrollListener onDrawerScrollListener)

设置一个监听器，用来接收当抽屉处于正在打开或者正在结束的滚动时候的通知。

animateClose()：

使用动画关闭抽屉。

animateOpen ()：

使用动画打开抽屉

getContent()：

获取内容

isMoving()：

指示SlidingDrawer是否在移动。

isOpened()：

指示SlidingDrawer是否已全部打开

lock()：

屏蔽触摸事件。

unlock()：

解除屏蔽触摸事件。

toggle()：

切换打开和关闭的抽屉SlidingDrawer。

 

一个简单的例子

我们可以引用SDK中给我们提供的XML文件。

在JAVA文件中如下编写：

[java]  view plain copy

1. public class SlidingDrawerDemoActivity extends Activity {    
2.             private SlidingDrawer myDrawer;  
3.             private ImageView myImageView;  
4.             private GridView myGridView;  
5.             @Override  
6.             protected void onCreate(Bundle savedInstanceState) {  
7.                 super.onCreate(savedInstanceState);  
8.                 setContentView(R.layout.main);  
9.                 myDrawer = (SlidingDrawer) findViewById(R.id.drawer);  
10.                 myImageView = (ImageView)findViewById(R.id.handle);  
11.                 myGridView = (GridView)findViewById(R.id.content);  
12.                 myDrawer.setOnDrawerOpenListener(newSlidingDrawer.OnDrawerOpenListener() {  
13.                     @Override  
14.                     public void onDrawerOpened() {  
15.                         myImageView.setImageResource(R.drawable.down);  
16.                     }  
17.                 });  
18.                 myDrawer.setOnDrawerCloseListener(newSlidingDrawer.OnDrawerCloseListener() {  
19.                     @Override  
20.                     public void onDrawerClosed() {  
21.                         myImageView.setImageResource(R.drawable.up);  
22.                     }  
23.                 });      
24.                 myGridView.setAdapter(new ImageAdapter(this));     
25.                 myGridView.setOnItemClickListener(newOnItemClickListener(){   
26.                     @Override   
27.                     public void onItemClick(AdapterView<?> arg0, Viewarg1, int arg2,   
28.                             long arg3) {   
29.                         // TODO Auto-generated method stub   
30.                         Toast.makeText(SlidingDrawerDemoActivity.this, "你选择了"+(arg2+1)+" 号图片 ", Toast.LENGTH_SHORT).show();   
31.                     }   
32.                 });  
33.     }  
34. }  

对于ImageAdapter这个类前面我们已经讨论过，这里就不再赘述。上面代码的效果如下：

当然，还需要在GridView的XML文件中添加如下几个参数：            

android:numColumns="auto_fit" 

android:verticalSpacing="10dp" 

android:horizontalSpacing="10dp" 

android:columnWidth="90dp" 

android:stretchMode="columnWidth" 

android:gravity="center"

如果将SildingDrawer的高度属性改变一下例如：android:layout_height="100dip"，则效果就会变成如下图所示：

如果将SildingDrawer的topOffset属性改变一下例如：android:topOffset="150dip"，则效果就会变成如下图所示：

小结

上述简单的例子显然不能够满足应用开发的需求，我们在写程序的时候，经常遇见从左到右，从上到下，控制SlidingDrawer的大小等需求，要完成这个操作，我们需要自定义一个SlidingDrawer。自定义的SlidingDrawer则相当于是继承了一个LinearLayout，我们会在后面的章节详细讨论如何自定义一个SlidingDrawer。