android使用抽屉,androidUI进阶之android中隐藏的layout抽屉的使用方法

最近在写一个应用&＃xff0c;想把设置页面和应用页面放在一起&＃xff0c;这样就能实现用户可以实时看到自己的设置对UI的影响&＃xff0c;从而更方便的设置用户喜欢的界面。想了一段时间&＃xff0c;发现用slidingDrawer这个控件可以实现这个效果。也就是一个抽屉。拉开抽屉&＃xff0c;占据半个屏幕&＃xff0c;另外半个屏幕还是显示应用页面。效果还是不错的。

今天就和大家分享一下android中这个抽屉效果。其实在android的lanucher就是一个抽屉&＃xff0c;打开它就可以看到安装的应用。相信大家都见过用过。下面我们就来做个相同的效果&＃xff0c;当然只是UI上差不多相同的效果。

slidingDrawer这个控件使用非常简单&＃xff0c;基本在xml里面配置就可以。代码如下所示。

xmlns:android&＃61;"http://schemas.android.com/apk/res/android"

android:layout_width&＃61;"fill_parent"

android:layout_height&＃61;"fill_parent"

>

android:layout_width&＃61;"fill_parent"

android:layout_height&＃61;"wrap_content"

android:text&＃61;"&＃64;string/hello"

android:textSize&＃61;"20sp"

/>

android:id&＃61;"&＃64;&＃43;id/sd"

android:layout_width&＃61;"match_parent"

android:layout_height&＃61;"match_parent"

android:handle&＃61;"&＃64;&＃43;id/iv"

android:content&＃61;"&＃64;&＃43;id/myContent"

android:orientation&＃61;"vertical"

>

android:id&＃61;"&＃64;&＃43;id/iv"

android:layout_width&＃61;"wrap_content"

android:layout_height&＃61;"wrap_content"

android:src&＃61;"&＃64;drawable/open1"

/>

android:id&＃61;"&＃64;id/myContent"

android:layout_width&＃61;"wrap_content"

android:layout_height&＃61;"wrap_content"

android:numColumns&＃61;"3"

android:background&＃61;"&＃64;drawable/background"

android:gravity&＃61;"center"

/>

在SlidingDrawer这个标签下android:handle&＃xff1a;指示的就是抽屉的图片。android:content:指向的就是抽屉里面的布局。有了这个布局&＃xff0c;其实一个抽屉就出来了。

下面我们看Chouti这个类的代码

public class Chouti extends Activity {

private GridView gv;

private SlidingDrawer sd;

private ImageView iv;

private int[] icons&＃61;{R.drawable.browser,R.drawable.gallery,

R.drawable.camera,R.drawable.gmail,

R.drawable.music,R.drawable.market,

R.drawable.phone,R.drawable.messages,R.drawable.maps};

private String[] items&＃61;{"浏览器","图片","相机","时钟","音乐","市场","拨号","信息","地图"};

/** Called when the activity is first created. */

&＃64;Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

gv &＃61; (GridView)findViewById(R.id.myContent);

sd &＃61; (SlidingDrawer)findViewById(R.id.sd);

iv&＃61;(ImageView)findViewById(R.id.iv);

MyAdapter adapter&＃61;new MyAdapter(this,items,icons);//自定义MyAdapter来实现图标加item的显示效果

gv.setAdapter(adapter);

sd.setOnDrawerOpenListener(new SlidingDrawer.OnDrawerOpenListener()//开抽屉

{

&＃64;Override

public void onDrawerOpened()

{

iv.setImageResource(R.drawable.close1);//响应开抽屉事件 &＃xff0c;把图片设为向下的

}

});

sd.setOnDrawerCloseListener(new SlidingDrawer.OnDrawerCloseListener()

{

&＃64;Override

public void onDrawerClosed()

{

iv.setImageResource(R.drawable.open1);//响应关抽屉事件

}

});

}

}

在整个类里面将布局导入&＃xff0c;同时设置开关抽屉的监听事件。这里面我们需要自定义一个MyAdapter来显示带文字下标的图片。

下面是MyAdapter这个类的代码

public class MyAdapter extends BaseAdapter

{

private Context _ct;

private String[] _items;

private int[] _icons;

public MyAdapter(Context ct,String[] items,int[] icons) //构造器

{

_ct&＃61;ct;

_items&＃61;items;

_icons&＃61;icons;

}

&＃64;Override

public int getCount()

{

return _items.length;

}

&＃64;Override

public Object getItem(int arg0)

{

return _items[arg0];

}

&＃64;Override

public long getItemId(int position)

{

return position;

}

&＃64;Override

public View getView(int position, View convertView, ViewGroup parent)

{

LayoutInflater factory &＃61; LayoutInflater.from(_ct);

View v &＃61; (View) factory.inflate(R.layout.gv, null);//绑定自定义的layout

ImageView iv &＃61; (ImageView) v.findViewById(R.id.icon);

TextView tv &＃61; (TextView) v.findViewById(R.id.text);

iv.setImageResource(_icons[position]);

tv.setText(_items[position]);

return v;

}

}

也是非常的简单&＃xff0c;其中用到的布局如下

xmlns:android&＃61;"http://schemas.android.com/apk/res/android"

android:orientation&＃61;"vertical"

android:layout_width&＃61;"fill_parent"

android:layout_height&＃61;"fill_parent"

>

android:id&＃61;"&＃64;&＃43;id/icon"

android:layout_width&＃61;"wrap_content"

android:layout_height&＃61;"40px"

android:layout_gravity&＃61;"center"

/>

android:id&＃61;"&＃64;&＃43;id/text"

android:layout_width&＃61;"fill_parent"

android:layout_height&＃61;"wrap_content"

android:gravity&＃61;"center"

android:textColor&＃61;"#ffffffff"

/>

这样&＃xff0c;我们的抽屉就完成啦 来看下效果

就写这么多啦。抽屉这个控件非常实用&＃xff0c;除了我在开头所说的我在程序中的应用外&＃xff0c;还有很多的用途&＃xff0c; 发挥你的想象力&＃xff0c;抽屉将为你的应用增色不少。