一概述
SlidingDrawer(滑动式抽屉)隐藏屏外的内容,并允许用户拖拽一个handle以显示隐藏的内容。SlidingDrawer可以在垂直或者水平使用。它由两个子视图组成:一个是用户拖拽的handle(柄),另一个是随着拖动变化的content(内容)。SlidingDrawer应当作为内部布局的覆盖来使用,也就是说SlidingDrawer内部应该使用FrameLayout或RelativeLayout布局。SlidingDrawer的大小决定了其内容显示时所占空间的大小,所以它的尺寸一般定义为match_parent。在XML布局中SlidingDrawer必须指定handle和content的id:
二 xml属性
属性名称 | 描述 | |||||||||
android:allowSingleTap | 指示是否可通过单击handle打开或关闭(如果是false,刚用户必须通过拖动,滑动或者使用轨迹球,来打开/关闭抽屉。)默认的是true。 | |||||||||
android:animateOnClick | 指示当用户点击handle的时候,抽屉是否以动画的形式打开或关闭。默认的是true。 | |||||||||
android:bottomOffset | Handle距离SlidingDrawer底部的额外距离 | |||||||||
android:content | 标识SlidingDrawer的内容 | |||||||||
android:handle | 标识SlidingDrawer的handle(译者注:如按钮) | |||||||||
android:orientation | SlidingDrawer的方向。必须是下面的一个值:
| |||||||||
android:topOffset | Handle距离SlidingDrawer顶部的额外距离 |
具体实现:
main.xml
- <?xml version="1.0" encoding="utf-8"?>
- <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:background="@drawable/b" >
- <SlidingDrawer
- android:id="@+id/slidingDrawer"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:content="@+id/content"
- android:handle="@+id/handle"
- android:orientation="vertical" >
- <!-- 抽屉把手 -->
- <ImageButton
- android:id="@+id/handle"
- android:layout_width="50dip"
- android:layout_height="44dip"
- android:src="@drawable/arrow_bottom_pressed" />
- <!-- 抽屉内容布局 -->
- <LinearLayout
- android:id="@+id/content"
- android:layout_width="wrap_content"
- android:layout_height="fill_parent"
- android:background="@drawable/a"
- android:orientation="vertical" >
- <LinearLayout
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:orientation="horizontal" >
- <ImageView
- android:layout_width="150dip"
- android:layout_height="100dip"
- android:src="@drawable/free_bg_10" />
- <ImageView
- android:layout_width="150dip"
- android:layout_height="100dip"
- android:src="@drawable/free_bg_8" />
- </LinearLayout>
- <LinearLayout
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:layout_marginTop="20dip"
- android:orientation="horizontal" >
- <ImageView
- android:layout_width="150dip"
- android:layout_height="100dip"
- android:src="@drawable/free_bg_9" />
- <ImageView
- android:layout_width="150dip"
- android:layout_height="100dip"
- android:src="@drawable/free_bg_small_1" />
- </LinearLayout>
- </LinearLayout>
- </SlidingDrawer>
- </RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/b" >
<SlidingDrawer
android:id="@+id/slidingDrawer"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:content="@+id/content"
android:handle="@+id/handle"
android:orientation="vertical" >
<!-- 抽屉把手 -->
<ImageButton
android:id="@+id/handle"
android:layout_width="50dip"
android:layout_height="44dip"
android:src="@drawable/arrow_bottom_pressed" />
<!-- 抽屉内容布局 -->
<LinearLayout
android:id="@+id/content"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:background="@drawable/a"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:layout_width="150dip"
android:layout_height="100dip"
android:src="@drawable/free_bg_10" />
<ImageView
android:layout_width="150dip"
android:layout_height="100dip"
android:src="@drawable/free_bg_8" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dip"
android:orientation="horizontal" >
<ImageView
android:layout_width="150dip"
android:layout_height="100dip"
android:src="@drawable/free_bg_9" />
<ImageView
android:layout_width="150dip"
android:layout_height="100dip"
android:src="@drawable/free_bg_small_1" />
</LinearLayout>
</LinearLayout>
</SlidingDrawer>
</RelativeLayout>
抽屉里的内容是两行图片,一行两个。
- package xiaosi.SlidingDrawer;
- import android.app.Activity;
- import android.os.Bundle;
- import android.widget.ImageButton;
- import android.widget.SlidingDrawer;
- public class SlidingDrawerActivity extends Activity
- {
- private SlidingDrawer slidingDrawer;
- private ImageButton handle = null;
- /** Called when the activity is first created. */
- @Override
- public void onCreate(Bundle savedInstanceState)
- {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.main);
- handle = (ImageButton)findViewById(R.id.handle);
- slidingDrawer = (SlidingDrawer) findViewById(R.id.slidingDrawer);
- /*
- * 打开抽屉
- */
- slidingDrawer.setOnDrawerOpenListener(new SlidingDrawer.OnDrawerOpenListener()
- {
- public void onDrawerOpened()
- {
- /*
- * 给抽屉把手换图片
- */
- handle.setImageResource(R.drawable.arrow_bottom_pressed);
- }
- });
- /*
- * 关闭抽屉
- */
- slidingDrawer.setOnDrawerCloseListener(new SlidingDrawer.OnDrawerCloseListener() {
- public void onDrawerClosed()
- {
- /*
- * 给抽屉把手换图片
- */
- handle.setImageResource(R.drawable.arrow_top_pressed);
- }
- });
- }
- }
package xiaosi.SlidingDrawer;
import android.app.Activity;
import android.os.Bundle;
import android.widget.ImageButton;
import android.widget.SlidingDrawer;
public class SlidingDrawerActivity extends Activity
{
private SlidingDrawer slidingDrawer;
private ImageButton handle = null;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
handle = (ImageButton)findViewById(R.id.handle);
slidingDrawer = (SlidingDrawer) findViewById(R.id.slidingDrawer);
/*
* 打开抽屉
*/
slidingDrawer.setOnDrawerOpenListener(new SlidingDrawer.OnDrawerOpenListener()
{
public void onDrawerOpened()
{
/*
* 给抽屉把手换图片
*/
handle.setImageResource(R.drawable.arrow_bottom_pressed);
}
});
/*
* 关闭抽屉
*/
slidingDrawer.setOnDrawerCloseListener(new SlidingDrawer.OnDrawerCloseListener() {
public void onDrawerClosed()
{
/*
* 给抽屉把手换图片
*/
handle.setImageResource(R.drawable.arrow_top_pressed);
}
});
}
}