《Android 平板电脑开发实战详解和典型案例》——滑动式抽屉—— SlidingDrawer

本节书摘来自异步社区《Android 平板电脑开发实战详解和典型案例》一书中的第2章,第2.7节滑动式抽屉—— SlidingDrawer,作者 吴亚峰 , 杜化美 , 索依娜,更多章节内容可以访问云栖社区“异步社区”公众号查看

2.7 滑动式抽屉—— SlidingDrawer
Android 平板电脑开发实战详解和典型案例
上一节中,介绍了可展开列表ExpandableListView的基本知识及简单案例,本节将介绍Android 2.0控件滑动式抽屉SlidingDrawer,主要内容包括其基本知识以及一个简单的案例。

2.7.1 滑动式抽屉基本知识
滑动式抽屉SlidingDrawer在UI布局有限或放不下太多控件的时候可以使用,滑动式抽屉SlidingDrawer可以隐藏屏外的内容,在布局文件中必须指定handle和content,并允许用户通过handle以显示隐藏内容。滑动式抽屉SlidingDrawer继承自ViewGroup,其继承树如图2-32所示。


《Android 平板电脑开发实战详解和典型案例》——滑动式抽屉—— SlidingDrawer

对菜单资源中的一些属性,由于篇幅所限,笔者将不再一一赘述,请读者自行查阅相关的api。

2.7.2 滑动式抽屉使用案例
通过前面的基本知识,读者对滑动式抽屉已经有了简单的了解,下面通过案例Sample2_9使读者进一步掌握滑动式抽屉的使用,在正式介绍此案例的开发步骤之前,首先请读者了解一下本案例的运行效果,如图2-33、图2-34和图2-35所示。


《Android 平板电脑开发实战详解和典型案例》——滑动式抽屉—— SlidingDrawer

图2-33为程序运行的初始效果图,单击抽屉会出现图2-34的效果,单击图2-35中的图标会出现图2-30的效果。
了解了案例的运行结果之后,下面开始介绍案例的开发,具体步骤如下。

(1)首先需要编写的是主配置文件main.xml,其代码如下。

1  <?xml version="1.0" encoding="utf-8"?>
2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3  android:layout_width="fill_parent"         <!--充满父控件-->
4  android:layout_height="fill_parent"          <!--充满父控件-->
5  android:orientation="vertical"           <!--垂直放置-->
6     android:layout_gravity="top" 
7     android:background="@drawable/aaa"       <!--设置背景--> 
8 <SlidingDrawer
9  android:id="@+id/sliding01"               <!--设置ID-->
10  android:layout_width="fill_parent"          <!--充满父控件-->
11  android:layout_height="wrap_content"        <!--高度自身决定-->
12  android:handle="@+id/handleImage"          <!--设置手柄-->
13  android:content="@+id/contentShow"         <!--设置隐藏内容-->
14  android:orientation=”vertical">            <!--设置背景图片-->
15 <ImageView
16  android:id="@+id/handleImage"             <!--设置ID-->
17  android:layout_width=" wrap_content"        <!--宽度自身决定-->
18  android:layout_height="wrap_content"         <!--高度自身决定-->
19     android:src=”@drawable/open”>         <!--添加图片-->
20 </ImageView> 
21 <GridView
22  android:id="@+id/contentShowt"           <!--设置ID-->
23  android:layout_width=" wrap_content"        <!--充满父控件-->
24  android:layout_height="wrap_content"        <!--高度自身决定-->
25  android:background="@drawable/gray"         <!--设置背景颜色-->
26    android:numColumns="3"              <!--设置每排有3个-->
27    android:gravity=”center”>            <!--设置中间位置--> 
28 </GridView>
29 </SlidingDrawer>
30 </LinearLayout>

该布局比较简单,在一个LinearLayout里面放了一个SlidingDrawer,在SlidingDrawer里面放了ImageView和GridView。读者如果在模拟器上运行此案例的代码的话请把上述第7行设置背景的代码删除。
(2)完成了配置文件main.xml的开发后,下面将要开发的是设置GridView的布局文件griditem.xml,其代码如下。

1  <?xml version="1.0" encoding="utf-8"?>
2 <LinearLayout
3   xmlns:android="http://schemas.android.com/apk/res/android"
4   android:id="@+id/linarlayout1"        <!--设置ID-->
5   android:layout_width="wrap_content"     <!--宽度自身决定-->
6   android:layout_height="wrap_content"     <!--高度自身决定-->
7   android:orientation="vertical"        <!--垂直排序-->
8   android:gravity="center_horizontal">     <!--设置中间位置-->
9  <ImageView
10   android:id="@+id/icon"              <!--设置ID-->    
11   android:layout_width="100dip"        <!--设置宽度-->
12   android:layout_height="100dip"         <!--设置高度-->
13   android:gravity="center">           <!--设置中间位置-->
14  </ImageView>
15 <TextView             
16   android:id="@+id/text"             <!--设置ID--> 
17   android:layout_width="fill_parent"      <!--充满父控件-->
18   android:layout_height="wrap_content"     <!--高度自身决定-->
19   android:gravity="center">           <!--设置中间位置-->
20  </TextView>
21 </LinearLayout>

该布局比较简单,在一个LinearLayout里面放了一个放置图标的ImageView和一个放置标题的TextView。
(3)完成了配置文件griditem.xml的开发后,下面将要开发的是主Activity对应的类SlidingActivity,其代码如下。

1   package com.bn.sample2_9;            //声明包
2 ……//该处省略了部分类的导入代码,读者可自行查看随书光盘中的源代码
3 public class SlidingActivity extends Activity {
4   @Override
5   public void onCreate(Bundle savedInstanceState) {
6     super.onCreate(savedInstanceState);
7     setContentView(R.layout.main);       //设置布局
8     final SlidingDrawer mDrawer;        //声明滑动式抽屉对象的引用
9     final LinearLayout mLinearLayout;     //声明水平布局对象的引用
10     mDrawer=(SlidingDrawer)findViewById(R.id.slidingDrawer);   //获取滑动式抽屉对象
11     Final ImageView im=(ImageView)findViewById(R.id.handleImage);//获取图片视图对象
12    int[]icon={R.drawable.dayviewicon,R.drawable.messagicon,R.drawable.monthviewicon,
13    R.drawable.selecticon,R.drawable.systemicon,R.drawable.weekviewicon};//图片资源数组
14   String[]text={"日试图","软件信息","月视图","查询日程","系统设置","周视图"}; //文本数组
15   GridAdapter gp=new GridAdapter(this,icon,text);     //获取适配器对象
16   GridView gv=(GridView)findViewById(R.id.contentShow); //获取格视图对象
17   gv.setAdapter(gp);                      //添加适配器
18 mDrawer.setOnDrawerOpenListener(new SlidingDrawer.OnDrawerOpenListener(){//打开抽屉时调用
19    @Override
20    public void onDrawerOpened() {
21       im.setImageResource(R.drawable.close);}});   //更换图片 
22  mDrawer.setOnDrawerCloseListener(newSlidingDrawer.OnDrawerCloseListener(){//关闭抽屉时调用
23     @Override
24   public void onDrawerClosed(){
25    im.setImageResource(R.drawable.open);}});        //更换图片
26  class GridAdapter extends BaseAdapter{          //自定义适配器
27     SlidingActivity ac;                   //声明Activity引用
28    int[] icon;                         //声明整数数组用来存放图片
29    String[] text;                       //声明字符串数组用来存放文本
30  public GridAdapter(Context context,int[] icon,String[] text){   //声明构造器
31  this.ac=(SlidingActivity)context;           //转换为SlidingActivity
32  this.icon=icon;                       //赋值到整数数组
33  this.text=text;}                     //赋值到字符串数组
34 @Override
35 public int getCount(){return 6;}             //返回内容个数
36 @Override
37 public Object getItem(int arg0){ return null;}
38 @Override
39 public long getItemId(int position){return 0;}
40 @Override
41 public View getView(int position, View convertView, ViewGroup parent){
42  LayoutInflater factory=LayoutInflater.from(ac);  
43  View view=(View)factory.inflate(R.layout.griditem,null);  //获取布局文件
44  ImageView iv=(ImageView)view.findViewById(R.id.icon);   //获取图像视图对象
45  TextView tv=(TextView)view.findViewById(R.id.text);      //获取文本视图对象
46  iv.setImageResource(icon[position]);               //设置图片
47  tv.setText(text[position]);                    //设置文本
48  tv.setTextSize(40);                         //设置字体大小
49  tv.setTextColor(ac.getResources().getColor(R.color.white));  //设置字体颜色
50  view.setPadding(5,5,5,5);                       //设置四周留白
51  select(ac,view,position);                        //调用方法
52  return view;}                 
53 public void select(Context context,View view,int position){   
54  final SlidingActivity sc=(SlidingActivity)context;   //获取Activity引用
55   final int index=position;                  //获取所在位置
56  view.setOnClickListener(                    //设置监听器
57   new OnClickListener(){          
58   @Override
59   public void onClick(View v){
60   switch(index){              //设置单击不同的图标时显示不同的Toast
61   case 0:Toast.makeText(sc,"您单击了日试图",Toast.LENGTH_SHORT). show();break;
62   ……//以下代码与上面基本相似,故此处省略,读者有需要可自行查看随书光盘的源代码
63   case 5:Toast.makeText(sc,"您单击了周试图",Toast.LENGTH_SHORT).show ();break;}}});}}

第7行为设置布局界面,第8~11行为声明滑动式抽屉对象和水平布局对象的引用,并获取对象,第12~14行为设置图片资源和文本,第18~25行为打开或关闭滑动式抽屉的监听器,并更换图片。
第26~63行为自定义适配器。第42~52行为获取图像视图和文本视图,并设置相应属性,第57~63行为单击图片时的监听器,按不同图片显示不同的Toast。

上一篇:天猫天猫,今年双11哪些最值得买?


下一篇:暑假打工赚了数十亿的3岁小孩,要上云啦!