Android中SlidingDrawer介绍【安卓进化三十四】

安卓中1.5后加入了SlidingDrawer【隐藏式抽屉】，设计原理在你的UI布局有限的情况下，放不下太多的控件的时候，可以考虑用这个隐藏式抽屉。用SlidingDrawer注意两点，一个是android：handle（委托要展开的图片加载Layout配置）和android：content（要展开的Layout Content），转载请标明出处：

http://blog.csdn.net/wdaming1986/article/details/6898374

下面看程序截图：

程序开始界面：点击右边的箭头后出现的界面：

Android中SlidingDrawer介绍【安卓进化三十四】_第1张图片

点击左边的箭头后出现的界面：

Android中SlidingDrawer介绍【安卓进化三十四】_第3张图片

在SlidingDrawerActivity工程下：

一、在com.cn.daming包下的SlidingDrawerMainActivity.java类中的代码：

package com.cn.daming;import android.app.Activity;import android.content.res.Configuration;import android.os.Bundle;import android.widget.GridView;import android.widget.ImageView;import android.widget.SlidingDrawer;public class SlidingDrawerMainActivity extends Activity {private GridView gridView;private SlidingDrawer slidingDrawer;private ImageView imageView;private int[] icons={R.drawable.title1, R.drawable.title2,R.drawable.title3, R.drawable.title4,R.drawable.title5, R.drawable.title6};private String[] items={"Phone", "Message", "AddImage", "Music", "Telephone", "SMS"};@Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.main);        gridView = (GridView)findViewById(R.id.mycontent);        slidingDrawer = (SlidingDrawer)findViewById(R.id.sliding_drawer);        imageView = (ImageView)findViewById(R.id.my_image);        MyGridViewAdapter adapter = new MyGridViewAdapter(this, items, icons);        gridView.setAdapter(adapter);        slidingDrawer.setOnDrawerOpenListener(new SlidingDrawer.OnDrawerOpenListener() {public void onDrawerOpened() {imageView.setImageResource(R.drawable.right1);}});        slidingDrawer.setOnDrawerCloseListener(new SlidingDrawer.OnDrawerCloseListener() {public void onDrawerClosed() {imageView.setImageResource(R.drawable.left1);}});    }@Overridepublic void onConfigurationChanged(Configuration newConfig) {super.onConfigurationChanged(newConfig);}}

二、在com.cn.daming包下的MyGridViewAdapter.java类中的代码：

package com.cn.daming;import android.content.Context;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.ImageView;import android.widget.TextView;public class MyGridViewAdapter extends BaseAdapter{private Context context;private String[] items;private int[] icons;public MyGridViewAdapter(Context context, String[] items, int[] icons){this.context = context;this.items = items;this.icons = icons;}public int getCount() {return items.length;}public Object getItem(int arg0) {return items[arg0];}public long getItemId(int position) {return position;}public View getView(int position, View convertView, ViewGroup parent) {LayoutInflater layoutInflater = LayoutInflater.from(context);View view = (View)layoutInflater .inflate(R.layout.grid, null);ImageView imageView = (ImageView)view.findViewById(R.id.image_view);TextView textview = (TextView)view.findViewById(R.id.text_view);imageView.setImageResource(icons[position]);textview.setText(items[position]);return view;}}

三、在res包下的layout下的main.xml中的代码：

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    >    <TextView        android:id="@+id/text_view"        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:layout_marginTop="10dip"        android:text="@string/hello"        android:textSize="10pt"        android:gravity="center"    />    <SlidingDrawer        android:id="@+id/sliding_drawer"        android:layout_width="fill_parent"        android:layout_height="fill_parent"        android:handle="@+id/layout1"        android:content="@+id/mycontent"        android:orientation="horizontal"    >        <LinearLayout           android:id="@id/layout1"           android:layout_width="35px"           android:layout_height="fill_parent"           android:gravity="center"           android:background="#00000000"        >           <ImageView               android:id="@+id/my_image"               android:layout_width="wrap_content"               android:layout_height="wrap_content"               android:src="@drawable/left1"           />        </LinearLayout>        <GridView            android:id="@id/mycontent"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:paddingTop="20dip"            android:numColumns="3"            android:gravity="center"            android:background="#ff000000"        />    </SlidingDrawer></RelativeLayout>

四、在res包下的layout下的grid.xml中的代码：

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical"    >    <ImageView        android:id="@+id/image_view"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginBottom="5dip"    />    <TextView        android:id="@+id/text_view"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginBottom="15dip"    /></LinearLayout>

五、在AndroidManifest.xml中的代码：

<?xml version="1.0" encoding="utf-8"?><manifest xmlns:android="http://schemas.android.com/apk/res/android"      package="com.cn.daming"      android:versionCode="1"      android:versionName="1.0">    <uses-sdk android:minSdkVersion="8" />    <application android:icon="@drawable/icon" android:label="@string/app_name">        <activity android:name=".SlidingDrawerMainActivity"                  android:label="@string/app_name"                  android:configChanges="orientation|locale">            <intent-filter>                <action android:name="android.intent.action.MAIN" />                <category android:name="android.intent.category.LAUNCHER" />            </intent-filter>        </activity>    </application></manifest>

补充说明：

也可以设置垂直的隐藏拉抽屉方式，设置SlidingDrawer中的android:orientation="vertical"。

看下截图效果：

点击下拉图标后界面：点击上拉图标后的界面：

修改下res包下的layout下的main.xml文件中的代码：

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"   >    <TextView        android:id="@+id/text_view"        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:layout_marginTop="10dip"        android:text="@string/hello"        android:textSize="10pt"        android:gravity="center"    />    <SlidingDrawer        android:id="@+id/sliding_drawer"        android:layout_width="fill_parent"        android:layout_height="fill_parent"        android:handle="@+id/layout1"        android:content="@+id/mycontent"        android:orientation="vertical"     >        <LinearLayout           android:id="@id/layout1"           android:layout_width="fill_parent"           android:layout_height="35px"           android:gravity="center"           android:background="#00000000"        >           <ImageView               android:id="@+id/my_image"               android:layout_width="wrap_content"               android:layout_height="wrap_content"               android:src="@drawable/up1"           />        </LinearLayout>        <GridView            android:id="@id/mycontent"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:paddingTop="20dip"            android:numColumns="3"            android:gravity="center"            android:background="#ff000000"        />    </SlidingDrawer></RelativeLayout>

修改grid.xml文件中的代码：

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical"    >    <ImageView        android:id="@+id/image_view"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginBottom="5dip"        android:layout_marginLeft="27dip"    />    <TextView        android:id="@+id/text_view"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginBottom="15dip"        android:layout_marginLeft="27dip"    /></LinearLayout>

完整代码下载链接地址：http://download.csdn.net/detail/wdaming1986/3731750

更多相关文章

随机推荐