需要的三个布局文件:

  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,否则将追究版权责任!

淘宝(阿里百川)手机客户端开发日记第三篇 SlidingPaneLayout实现侧滑菜单的更多相关文章

  1. 淘宝(阿里百川)手机客户端开发日记第十一篇 JSP+Servlet

    由于本人从事.net开发已有多年经验,今天由于工作需要,我只能学习下JSP+Servlet,至于java web提供了更好的开发框架MVC,现在由于时间关系,我只好用JSP+Servlet来搭建服务器 ...

  2. 淘宝(阿里百川)手机客户端开发日记第五篇 SharedPreferences使用详解

    我们知道,Android中数据存储技术由于如下几种 1 使用SharedPreferences存储数据 2 文件存储数据 3 SQLite数据库存储数据 4 使用ContentProvider存储数据 ...

  3. 淘宝(阿里百川)手机客户端开发日记第十篇 阿里百川服务器环境介绍之API文档的快速链接(四)

    个人感觉比较重要的快速链接: http://open.taobao.com/doc/detail.htm?id=102513 http://open.taobao.com/doc/detail.htm ...

  4. 淘宝(阿里百川)手机客户端开发日记第十三篇 mysql的连接

    首先,我建立了一个包,里面存放了三个类文件,这三个文件是我从网络中找的,经过自己的整理.(我刚才查找想把这三个文件传上去,可能是自己对cnblogs的博客不太熟悉吧,没有找到,我只好粘贴代码了) 三个 ...

  5. 淘宝(阿里百川)手机客户端开发日记第八篇 Handler的使用方法

    首先,我们先看下API文档的说明: A Handler allows you to send and process Message and Runnable objects associated w ...

  6. 淘宝(阿里百川)手机客户端开发日记第七篇 Service,Handler和Thread

    现在我们已经已经知道android有Service,Handler和Thread这些内容了,但是我想应该还有很多人对此并不是很清楚他们之间的区别! (1)Service 是运行在后端的程序,不与UI直 ...

  7. 淘宝(阿里百川)手机客户端开发日记第六篇 Service详解(六)

    Service和Thread的关系 不少初学者都可能会有这样的疑惑,Service和Thread到底有什么关系呢?什么时候应该用Service,什么时候又应该用Thread? 答案是Service和T ...

  8. 淘宝(阿里百川)手机客户端开发日记第六篇 Service详解(五)

    我们现在对上一节中的DEMO进行改进,在服务中开启线程来执行. package com.example.service; import android.app.Service; import andr ...

  9. 淘宝(阿里百川)手机客户端开发日记第六篇 Service详解(四)

    DEMO1:在Activity里声明一个回调方法,当service完成任务后,调用这个回调方法. 首先,我们先继承service,来创建服务,代码如下: package com.example.ser ...

随机推荐

  1. 【niubi-job——一个分布式的任务调度框架】----niubi-job这下更牛逼了!

    niubi-job迎来第一次重大优化 niubi-job是一款专门针对定时任务所设计的分布式任务调度框架,它可以进行动态发布任务,并且有超高的可用性保证. 有多少人半夜被叫起来查BUG,结果差到最后发 ...

  2. ios9+xcode7 适配笔记

    升级了xcode7,最近ios9上马,又到了草泥马的时间,apple开放团队每次系统更新,都是无数个草泥马的适配夜晚,现在ios9上线以前的app竟然启动crash,这是要闹哪样. 1.微信和微博的s ...

  3. Javascript基础系列之(六)循环语句(while语句)

    循环语句的作用是反复的执行同一段代码,尽管分几种不同的类型,但其原理几乎相同:只要给定的条件满足,包含在循环体内的语句会不断执行,一旦条件不再满足则终止. while循环是前测试循环,这意味着是否终止 ...

  4. IOS 判断日期是今天,昨天还是明天

    git地址: https://github.com/JsoonLi/NSDate-Extension   - (NSString *)compareDate:(NSDate *)date{ NSTim ...

  5. UIScrollView和UIPageController

    实现代码: // // ViewController.m // UIpageControl // // Created by dllo on 16/3/10. // Copyright © 2016年 ...

  6. Nginx 配置详解

    http://www.cnblogs.com/analyzer/articles/1377684.html 本文转自:http://blog.c1gstudio.com/archives/434 推荐 ...

  7. 使用background和background-image对CSS优先级造成影响

    在写一个关于背景图的CSS时候发现一个奇怪的现象, 原图: 如下代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitiona ...

  8. 快速安装 GitLab 并汉化

    转载:http://www.jianshu.com/p/7a0d6917e009

  9. UVA5876 Writings on the Wall 扩展KMP

    扩展KMP的简单题. #include<stdio.h> #include<string.h> #define maxn 51010 char s[maxn],t[maxn]; ...

  10. Shell good example

    (1) Source code #! /bin/bash reference ()     {     pa=\$"$1"     echo $pa     x=`eval &qu ...