仿人们网右边可推出的效果
仿人人网右边可推出的效果
看了这篇模仿facebook布局效果还有这篇仿朋友网左右两边可推出的菜单效果
感觉实现太复杂,自己又写过这篇可左右两侧挤压傍边布局的Android抽屉,完全可以按照这个仿一个出来,简单又容易理解。
先看布局,布局很重要:
再看代码:
接口:
打开前:
打开后:
这样设计有一点不好,就是所有的代码都需要写在一个activity中,代码多了会很臃肿。
小米测试通过。
看了这篇模仿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中,代码多了会很臃肿。
小米测试通过。