- SlidingDrawer是一种抽屉型组件,当用户打开这个小抽屉以后会出一个大礼包,就是一系列的程序集,玩过手机版的植物大战僵尸的知道手机界面本来就小,而为了节省空间就会用一个小小抽屉或箭头标志,这样就解决了布局空间紧张问题。
其方法有这几种:
首先定义main.xml布局文件:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
tools:context=".MainActivity" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/hello_world" />
<SlidingDrawer
android:orientation="horizontal"
android:id="@+id/slidingdrawer1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:content="@+id/content"
android:handle="@+id/handle" >
<ImageView
android:id="@+id/handle"
android:src="@drawable/ic"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<LinearLayout
android:id="@+id/content"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</LinearLayout>
</SlidingDrawer>
</RelativeLayout>
之后我们想要添加的组件添加到linearlayout:content里面,它相当于抽屉,把软件程序集藏得好好地,图片imageview相当于抽屉拉手,一个标志作用
现在定义Activity:
public class MainActivity extends Activity {
private SlidingDrawer slid=null;
private ImageView image=null;
private ImageView handle=null;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
image=new ImageView(this);
image.setImageResource(R.drawable.draw);
LinearLayout layout = (LinearLayout) super.findViewById(R.id.content) ;
layout.addView(image);
this.slid = (SlidingDrawer) super.findViewById(R.id.slidingdrawer1) ;
this.handle = (ImageView) super.findViewById(R.id.handle) ;
//打开隐藏抽屉
this.slid.setOnDrawerOpenListener(new OnDrawerOpenListenerImpl()) ;
//关闭隐藏抽屉
this.slid.setOnDrawerCloseListener(new OnDrawerCloseListenerImpl()) ;
//拖动隐藏抽屉组件
this.slid.setOnDrawerScrollListener(new OnDrawerScrollListenerImpl()) ;
}
private class OnDrawerOpenListenerImpl implements OnDrawerOpenListener {
@Override
public void onDrawerOpened() {
MainActivity.this.handle.setImageResource(R.drawable.right) ;
}
}
private class OnDrawerCloseListenerImpl implements OnDrawerCloseListener {
@Override
public void onDrawerClosed() {
MainActivity.this.handle.setImageResource(R.drawable.ic) ;
}
}
private class OnDrawerScrollListenerImpl implements OnDrawerScrollListener {
@Override
public void onScrollEnded() {
Toast.makeText(MainActivity.this, "窗口拖动结束。", Toast.LENGTH_SHORT).show() ;
}
@Override
public void onScrollStarted() {
Toast.makeText(MainActivity.this, "正在拖动窗口。", Toast.LENGTH_SHORT).show() ;
}
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
}
这里为了简单起见只显示一张图片,读者可以随意加组件。
- 缩放组件
就是下面这个组件
现在我们来完成一个实例,文字放大器,这一方面做好了我们就能轻松实现图片放大缩小了
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/hello_world" />
<ZoomControls
android:id="@+id/zoomControls1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
Activity代码:
public class MainActivity extends Activity {
private ZoomControls zoomControls;
private int size;
private TextView text;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
this.zoomControls=(ZoomControls)super.findViewById(R.id.zoomControls);
this.text=(TextView)super.findViewById(R.id.text);
this.zoomControls.setOnZoomInClickListener(new ZoomIn());
this.zoomControls.setOnZoomOutClickListener(new ZoomOut());
}
//更改文字大小
private class ZoomIn implements OnClickListener{
@Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
MainActivity.this.size=size+2;
MainActivity.this.text.setTextSize(size);
}
}
//更改文字大小
private class ZoomOut implements OnClickListener{
@Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
MainActivity.this.size=size-2;
MainActivity.this.text.setTextSize(size);
}
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
}
仔细发现缩放组件其实就是按钮,所用的监听方法也是按钮的,那么得到的启示就是我们可以用更漂亮的imagebutton来实现这个功能,这就交给读者朋友们。
实现效果如下: