仿人人网右边可推出的效果

已不推荐！
看了这篇模仿facebook布局效果还有这篇仿朋友网左右两边可推出的菜单效果
感觉实现太复杂，自己又写过这篇可左右两侧挤压傍边布局的Android抽屉，完全可以按照这个仿一个出来，简单又容易理解。
先看布局，布局很重要：

<?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"
    >

    <LinearLayout  android:id="@+id/layout_left"
        android:layout_width="fill_parent"
    	android:layout_height="fill_parent"
    	android:orientation="vertical"
    	android:background="@android:color/white"
    	android:layout_alignParentLeft="true"
    	android:layout_alignParentTop="true"
        >
        <!-- 这里添加其他控件，比如ListView -->
        <TextView 
            android:layout_width="fill_parent"
	    	android:layout_height="wrap_content"
	    	android:text="wwwwwwwwww"
	    	android:textColor="@android:color/black"
            />
    </LinearLayout>

    <LinearLayout android:id="@+id/layout_right"
        android:layout_width="fill_parent"
    	android:layout_height="fill_parent"
    	android:orientation="vertical"
    	android:background="@android:color/black"
    	android:layout_alignParentTop="true"
    	android:layout_marginLeft="280dip"
        >
        <ImageView android:id="@+id/iv"
            android:layout_width="wrap_content"
	    	android:layout_height="wrap_content"
	    	android:src="@drawable/ic_launcher"
	    	android:contentDescription="打开/关闭"
            />
        <!-- 为了不让里面的控件出现“折叠”现象，所以给了个足够长的固定宽度 -->
        <!-- 实际编程中该宽度最好计算求的 -->
        <LinearLayout android:id="@+id/layout_max_width"
        android:layout_width="300dip"
    	android:layout_height="fill_parent"
    	android:orientation="vertical"
        >
        	<!-- 这里添加其他控件，比如ListView -->
	        <TextView 
	            android:layout_width="fill_parent"
		    	android:layout_height="wrap_content"
		    	android:text="wwwwwwwwww"
		    	android:textColor="@android:color/white"
	            />
	        <TextView 
	            android:layout_width="fill_parent"
		    	android:layout_height="wrap_content"
		    	android:text="wwwwwwwwww"
		    	android:textColor="@android:color/white"
	            />
	    </LinearLayout>
    </LinearLayout>
    
</RelativeLayout>

再看代码：

package com.dl.test;

import android.app.Activity;
import android.os.AsyncTask;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.ViewTreeObserver;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout.LayoutParams;

public class App extends Activity implements OnPanelStatusChangedListener{
	private boolean hasMeasured=false;
	private LinearLayout layout_left;
	private LinearLayout layout_right;
	private ImageView iv;
	private LayoutParams lp;
	
	private int layout_left_width,layout_right_width=0;
	/**每次自动展开/收缩的范围*/  
	private int MAX_WIDTH=0;
	/**每次自动展开/收缩的速度*/  
    private final static int SPEED=20;
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        layout_left=(LinearLayout)findViewById(R.id.layout_left);
        layout_right=(LinearLayout)findViewById(R.id.layout_right);
        iv=(ImageView)findViewById(R.id.iv);
        iv.setOnClickListener(new View.OnClickListener() {
			
			@Override
			public void onClick(View v) {
				// TODO Auto-generated method stub
				LayoutParams lp = (android.widget.RelativeLayout.LayoutParams)layout_right.getLayoutParams();
				
				if (lp.leftMargin >=MAX_WIDTH)// CLOSE的状态  
                    new AsynMove().execute(new Integer[] { -SPEED });// 负数展开  
                else if (lp.leftMargin >= 0)// OPEN的状态  
                    new AsynMove().execute(new Integer[] { SPEED });// 正数收缩
			}
		});
        
        ViewTreeObserver observer = layout_right.getViewTreeObserver();
//        observer.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
//            @Override
//            public void onGlobalLayout() {
//		        if (hasMeasured == false){
//		        	layout_right_width = layout_right.getMeasuredWidth();//105
//		            layout_left_width=layout_left.getMeasuredWidth();//480
//		            MAX_WIDTH=layout_left_width-layout_right_width;//375
//		            hasMeasured = true;
//		        }
//            }
//        });
        //为了取得控件的宽
        observer.addOnPreDrawListener(new ViewTreeObserver.OnPreDrawListener(){
            public boolean onPreDraw(){
                if (hasMeasured == false){
                	layout_right_width = layout_right.getMeasuredWidth();
                    layout_left_width=layout_left.getMeasuredWidth();
                    MAX_WIDTH=layout_left_width-layout_right_width;
//                    Log.i("tag", "MAX_WIDTH=="+MAX_WIDTH);
                    hasMeasured = true;

//设置可拉动容器的宽为全屏（即不可拉动容器）的宽
                   View layout_max_width=findViewById(R.id.layout_max_width);
                   LinearLayout.LayoutParams lp=(LinearLayout.LayoutParams)layout_max_width.getLayoutParams();
                   lp.width=layout_left_width;
                   layout_max_width.setLayoutParams(lp);
                }
                return true;
            }
        });
        
    }
    
    @Override
	protected void onResume() {
		// TODO Auto-generated method stub
		super.onResume();
		
	}

	@Override
	public void onAttachedToWindow() {
		// TODO Auto-generated method stub
		super.onAttachedToWindow();
	}

	class AsynMove extends AsyncTask<Integer, Integer, Void> {  
    	  
        @Override  
        protected Void doInBackground(Integer... params) {  
            int times;  
            if (MAX_WIDTH % Math.abs(params[0]) == 0)// 整除  
                times = MAX_WIDTH / Math.abs(params[0]);  
            else  
                times = MAX_WIDTH / Math.abs(params[0]) + 1;// 有余数  
  
            for (int i = 0; i < times; i++) {  
                publishProgress(params);  
                try {  
                    Thread.sleep(Math.abs(params[0]));  
                } catch (InterruptedException e) {  
                    // TODO Auto-generated catch block  
                    e.printStackTrace();  
                }  
            }  
            return null;  
        }  
  
        @Override  
        protected void onProgressUpdate(Integer... params) {  
            LayoutParams lp = (LayoutParams)layout_right.getLayoutParams();  
            if (params[0] < 0)  
                lp.leftMargin = Math.max(lp.leftMargin + params[0], 0);  
            else  
                lp.leftMargin = Math.min(lp.leftMargin + params[0], MAX_WIDTH);  
  
            if(lp.leftMargin<=0){//展开之后  
                onPanelOpened();//调用OPEN回调函数  
            }  
            else if(lp.leftMargin>=MAX_WIDTH){//收缩之后  
                onPanelClosed();//调用CLOSE回调函数  
            }  
            layout_right.setLayoutParams(lp);  
        }  
    }

	@Override
	public void onPanelOpened() {
		// TODO Auto-generated method stub
		Log.i("tag", "=========onPanelOpened========");
	}

	@Override
	public void onPanelClosed() {
		// TODO Auto-generated method stub
		Log.i("tag", "=========onPanelClosed========");
	}  
      
    
}

接口：

package com.dl.test;

public interface OnPanelStatusChangedListener {
	void onPanelOpened();  
	void onPanelClosed();
}

打开前：

打开后：

这样设计有一点不好，就是所有的代码都需要写在一个activity中，代码多了会很臃肿。

小米测试通过。

评论

2 楼 langrenyijiu 2013-07-05  

不错       

1 楼 gsg8709 2012-07-13  

这个demo bug太多啦！