淘宝(阿里百川)手机客户端开发日记第三篇 SlidingPaneLayout实现侧滑菜单

需要的三个布局文件：

　　activity_main.xml ：主窗体布局

      left.xml : 左侧栏目分类布局

　　right.xml : 右侧内容详情

需要的组件： android.support.v4.widget.SlidingPaneLayout

---

 

 布局代码

activity_main.xml

 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical"

    tools:context="com.example.slidepaneldemo.MainActivity" >



    <LinearLayout 

       		android:layout_width="match_parent"

    		android:layout_height="40dp"

    >

        <Button

            android:id="@+id/button1"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="分类" />

    	

    </LinearLayout>

    

    <View android:layout_width="match_parent"

        	android:layout_height="0.6dp"

        	android:background="#ff0000"

        />

   <LinearLayout 

       		android:layout_width="match_parent"

    		android:layout_height="match_parent"

    >

	    <android.support.v4.widget.SlidingPaneLayout

	        android:id="@+id/slidepanel"

	        android:layout_width="match_parent"

	        android:layout_height="match_parent" >

	    

	    	 <include 

		        android:id="@+id/id_left"

		        layout="@layout/left"/>

		     <include 

		        android:id="@+id/id_left"

		        layout="@layout/right"/>

	     

	     </android.support.v4.widget.SlidingPaneLayout>

	</LinearLayout>

</LinearLayout>

　　其中：left.xml 

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="92dp"

    android:layout_height="match_parent"

    android:orientation="vertical" 

    android:background="#cccccc">

	

    <ListView

        android:layout_width="92dp"

        android:layout_height="match_parent"

        android:entries="@array/menu_list" >

	</ListView>



</LinearLayout>

　　right.xml

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical" >



    <TextView

        android:id="@+id/textView1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignParentTop="true"

        android:layout_centerHorizontal="true"

        android:layout_marginTop="173dp"

        android:text="右侧正文" />



</RelativeLayout>

　　对应的图示效果：左侧图，右侧图 ，主窗体图（第三张图和第二张图差不多，但是第三张图示主窗体图，其中，左侧图默认不显示。）

我们现在需要实现点击分类，将左侧的分类展现出来，如图效果：

实现代码如下（.java）：

 

package com.example.slidepaneldemo;



import android.app.Activity;

import android.os.Bundle;

import android.support.v4.widget.SlidingPaneLayout;

import android.support.v4.widget.SlidingPaneLayout.PanelSlideListener;

import android.view.Menu;

import android.view.MenuItem;

import android.view.View;

import android.view.View.OnClickListener;

import android.widget.Button;



public class MainActivity extends Activity implements PanelSlideListener {

	

	Button button1;

	SlidingPaneLayout slidepanel;

	

	@Override

	protected void onCreate(Bundle savedInstanceState) {

		super.onCreate(savedInstanceState);

		setContentView(R.layout.activity_main);

		

		button1 = (Button)findViewById(R.id.button1);

		slidepanel = (SlidingPaneLayout)findViewById(R.id.slidepanel);

		/*
　　　　　　　　　　* 判断左侧分类是否展示，很简单的逻辑代码吧
　　　　　　　　　　*/

		button1.setOnClickListener(new OnClickListener() {

			

			@Override

			public void onClick(View arg0) {

				if(!slidepanel.isOpen())

				{

					slidepanel.openPane();

				}

				else

				{

					slidepanel.closePane();

				}

			}

		});

	}



	@Override

	public void onPanelClosed(View arg0) {

		// TODO Auto-generated method stub

		

	}



	@Override

	public void onPanelOpened(View arg0) {

		// TODO Auto-generated method stub

		

	}



	@Override

	public void onPanelSlide(View arg0, float arg1) {

		// TODO Auto-generated method stub

		

	}



}

  转载请注明http://www.cnblogs.com/yushengbo,否则将追究版权责任！