Android隐式抽屉及缩放控制(20)
- 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来实现这个功能,这就交给读者朋友们。
实现效果如下: